Fix failing test case

.changeset/shiny-cities-doubt.md

@@ -0,0 +1,5 @@
+---
+"claude-dev": patch
+---
+
+Bug fix for the isMacOSOrLinux() function in the webview-ui/ code for the extension.

webview-ui/src/components/chat/chat-view/components/layout/WelcomeSection.tsx

@@ -15,7 +15,7 @@ import { PLATFORM_CONFIG, PlatformType } from "@/config/platform.config"
 import { useClineAuth } from "@/context/ClineAuthContext"
 import { useExtensionState } from "@/context/ExtensionStateContext"
 import { AccountServiceClient, StateServiceClient } from "@/services/grpc-client"
-import { isMacOSOrLinux } from "@/utils/platformUtils"
+import { useIsMacOSOrLinux } from "@/utils/platformUtils"
 import { WelcomeSectionProps } from "../../types/chatTypes"
 
 /**
@@ -39,11 +39,12 @@ export const WelcomeSection: React.FC<WelcomeSectionProps> = ({
 	const shouldShowInfoBanner = lastDismissedInfoBannerVersion < CURRENT_INFO_BANNER_VERSION
 	const shouldShowNewModelBanner = lastDismissedModelBannerVersion < CURRENT_MODEL_BANNER_VERSION
 
-	// Show CLI banner if not dismissed and platform is VSCode (not JetBrains/standalone)
+	const isMacOSOrLinux = useIsMacOSOrLinux()
+
+	// Show CLI banner on all platforms (VSCode only, not JetBrains/standalone)
+	// The banner content handles platform-specific messaging
 	const shouldShowCliBanner =
-		isMacOSOrLinux() &&
-		PLATFORM_CONFIG.type === PlatformType.VSCODE &&
-		lastDismissedCliBannerVersion < CURRENT_CLI_BANNER_VERSION
+		PLATFORM_CONFIG.type === PlatformType.VSCODE && lastDismissedCliBannerVersion < CURRENT_CLI_BANNER_VERSION
 
 	const { clineUser } = useClineAuth()
 	const { openRouterModels, setShowChatModelSelector, navigateToSettings, subagentsEnabled } = useExtensionState()
@@ -149,8 +150,8 @@ export const WelcomeSection: React.FC<WelcomeSectionProps> = ({
 			banners.push({
 				id: "cli-install",
 				icon: <Terminal className="w-5 h-5" />,
-				title: isMacOSOrLinux() ? "CLI & Subagents Available" : "Cline CLI Info",
-				description: isMacOSOrLinux() ? (
+				title: isMacOSOrLinux ? "CLI & Subagents Available" : "Cline CLI Info",
+				description: isMacOSOrLinux ? (
 					<>
 						Use Cline in your terminal and enable subagent capabilities.{" "}
 						<VSCodeLink href="https://docs.cline.bot/cline-cli/overview" style={{ display: "inline" }}>
@@ -165,7 +166,7 @@ export const WelcomeSection: React.FC<WelcomeSectionProps> = ({
 						</VSCodeLink>
 					</>
 				),
-				actions: isMacOSOrLinux()
+				actions: isMacOSOrLinux
 					? [
 							{ label: "Install", onClick: handleInstallCli, variant: "primary" },
 							{

webview-ui/src/components/cline-rules/ClineRulesToggleModal.tsx

@@ -17,7 +17,7 @@ import PopupModalContainer from "@/components/common/PopupModalContainer"
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
 import { useExtensionState } from "@/context/ExtensionStateContext"
 import { FileServiceClient } from "@/services/grpc-client"
-import { isMacOSOrLinux } from "@/utils/platformUtils"
+import { useIsMacOSOrLinux } from "@/utils/platformUtils"
 import HookRow from "./HookRow"
 import NewRuleRow from "./NewRuleRow"
 import RuleRow from "./RuleRow"
@@ -51,7 +51,8 @@ const ClineRulesToggleModal: React.FC = () => {
 		Array<{ workspaceName: string; hooks: Array<{ name: string; enabled: boolean; absolutePath: string }> }>
 	>([])
 
-	const isWindows = !isMacOSOrLinux()
+	const isMacOSOrLinux = useIsMacOSOrLinux()
+	const isWindows = !isMacOSOrLinux
 	const [isVisible, setIsVisible] = useState(false)
 	const buttonRef = useRef<HTMLDivElement>(null)
 	const modalRef = useRef<HTMLDivElement>(null)

webview-ui/src/components/common/CliInstallBanner.tsx

@@ -5,13 +5,14 @@ import { useCallback, useEffect, useState } from "react"
 import { Button } from "@/components/ui/button"
 import { useExtensionState } from "@/context/ExtensionStateContext"
 import { StateServiceClient } from "@/services/grpc-client"
-import { isMacOSOrLinux } from "@/utils/platformUtils"
+import { useIsMacOSOrLinux } from "@/utils/platformUtils"
 import { getAsVar, VSC_INACTIVE_SELECTION_BACKGROUND } from "@/utils/vscStyles"
 
 export const CURRENT_CLI_BANNER_VERSION = 1
 
 export const CliInstallBanner: React.FC = () => {
 	const { navigateToSettings, subagentsEnabled } = useExtensionState()
+	const isMacOSOrLinux = useIsMacOSOrLinux()
 	const [isCopied, setIsCopied] = useState(false)
 	const [isClineCliInstalled, setIsClineCliInstalled] = useState(false)
 
@@ -92,10 +93,10 @@ export const CliInstallBanner: React.FC = () => {
 			}}>
 			<h4 className="m-0 flex items-center gap-2" style={{ paddingRight: "24px" }}>
 				<Terminal className="w-4 h-4" />
-				{isMacOSOrLinux() ? "Cline for CLI is here!" : "Cline CLI Information"}
+				{isMacOSOrLinux ? "Cline for CLI is here!" : "Cline CLI Information"}
 			</h4>
 			<p className="m-0">
-				{isMacOSOrLinux() ? (
+				{isMacOSOrLinux ? (
 					<>
 						Install to use Cline directly in your terminal and enable subagent capabilities. Cline can spawn{" "}
 						<code>cline</code> commands to handle focused tasks like exploring large codebases for information. This
@@ -138,7 +139,7 @@ export const CliInstallBanner: React.FC = () => {
 						<span className={`codicon ${isCopied ? "codicon-check" : "codicon-copy"}`}></span>
 					</VSCodeButton>
 				</div>
-				{isMacOSOrLinux() ? (
+				{isMacOSOrLinux ? (
 					<div className="flex gap-2">
 						<VSCodeButton
 							appearance="primary"

webview-ui/src/components/settings/sections/FeatureSettingsSection.tsx

@@ -8,7 +8,7 @@ import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip
 import { PLATFORM_CONFIG, PlatformType } from "@/config/platform.config"
 import { useExtensionState } from "@/context/ExtensionStateContext"
 import { StateServiceClient } from "@/services/grpc-client"
-import { isMacOSOrLinux } from "@/utils/platformUtils"
+import { useIsMacOSOrLinux } from "@/utils/platformUtils"
 import Section from "../Section"
 import SubagentOutputLineLimitSlider from "../SubagentOutputLineLimitSlider"
 import { updateSetting } from "../utils/settingsHandlers"
@@ -37,6 +37,7 @@ const FeatureSettingsSection = ({ renderSectionHeader }: FeatureSettingsSectionP
 		enableParallelToolCalling,
 	} = useExtensionState()
 
+	const isMacOSOrLinux = useIsMacOSOrLinux()
 	const [isClineCliInstalled, setIsClineCliInstalled] = useState(false)
 
 	const handleReasoningEffortChange = (newValue: OpenaiReasoningEffort) => {
@@ -70,7 +71,7 @@ const FeatureSettingsSection = ({ renderSectionHeader }: FeatureSettingsSectionP
 			<Section>
 				<div style={{ marginBottom: 20 }}>
 					{/* Subagents - Only show on macOS and Linux */}
-					{isMacOSOrLinux() && PLATFORM_CONFIG.type === PlatformType.VSCODE && (
+					{isMacOSOrLinux && PLATFORM_CONFIG.type === PlatformType.VSCODE && (
 						<div
 							className="relative p-3 mb-3 rounded-md"
 							id="subagents-section"
@@ -394,14 +395,14 @@ const FeatureSettingsSection = ({ renderSectionHeader }: FeatureSettingsSectionP
 					<div className="mt-2.5">
 						<VSCodeCheckbox
 							checked={hooksEnabled}
-							disabled={!isMacOSOrLinux()}
+							disabled={!isMacOSOrLinux}
 							onChange={(e: any) => {
 								const checked = e.target.checked === true
 								updateSetting("hooksEnabled", checked)
 							}}>
 							Enable Hooks
 						</VSCodeCheckbox>
-						{!isMacOSOrLinux() ? (
+						{!isMacOSOrLinux ? (
 							<p className="text-xs mt-1" style={{ color: "var(--vscode-inputValidation-warningForeground)" }}>
 								Hooks are not yet supported on Windows. This feature is currently available on macOS and Linux
 								only.

webview-ui/src/utils/platformUtils.ts

@@ -1,8 +1,20 @@
+import { useExtensionState } from "@/context/ExtensionStateContext"
+
 export interface NavigatorUAData {
 	platform: string
 	brands: { brand: string; version: string }[]
 }
 
+/**
+ * Pure helper: checks whether a given platform string is macOS or Linux.
+ *
+ * This is intentionally *not* a React hook so it can be used safely from anywhere
+ * (including non-React code and unit tests).
+ */
+export const isMacOSOrLinux = (platform?: string): boolean => {
+	return platform === "darwin" || platform === "linux"
+}
+
 export const unknown = "Unknown"
 
 const platforms = {
@@ -42,10 +54,13 @@ export const isChrome = userAgent.indexOf("Chrome") >= 0
 export const isSafari = !isChrome && userAgent.indexOf("Safari") >= 0
 
 /**
- * Checks if the platform is macOS or Linux
- * @returns true if platform is darwin (macOS) or linux
+ * React hook to check whether the platform is macOS or Linux
+ * @returns true if platform is darwin (macOS) or linux, false for Windows or unknown
  */
-export const isMacOSOrLinux = (): boolean => {
-	const platform = process?.platform
-	return !platform?.startsWith("win") // Non-Windows
+export const useIsMacOSOrLinux = (): boolean => {
+	const { platform } = useExtensionState()
+	// Be conservative: only return true when we *explicitly* know we're on macOS/Linux.
+	// This avoids incorrectly enabling mac/linux-only UI during the initial hydration phase
+	// where platform may still be "unknown".
+	return isMacOSOrLinux(platform)
 }