Test fixes

Author: brunobergher

webview-ui/src/__tests__/ContextWindowProgress.spec.tsx

@@ -8,6 +8,7 @@ import TaskHeader from "@src/components/chat/TaskHeader"
 // Mock formatLargeNumber function
 vi.mock("@/utils/format", () => ({
 	formatLargeNumber: vi.fn((num) => num.toString()),
+	formatCost: (cost: number) => `$${cost.toFixed(2)}`,
 }))
 
 // Mock VSCodeBadge component for all tests
@@ -128,12 +129,7 @@ describe("ContextWindowProgress", () => {
 		expect(windowSize).toBeInTheDocument()
 		expect(windowSize).toHaveTextContent("4000")
 
-		// The progress bar is now wrapped in tooltips, but we can verify the structure exists
-		// by checking for the progress bar container
-		const progressBarContainer = screen.getByTestId("context-tokens-count").parentElement
+		const progressBarContainer = screen.getByTestId("context-progress-bar-container").parentElement
 		expect(progressBarContainer).toBeInTheDocument()
-
-		// Verify the flex container has the expected structure
-		expect(progressBarContainer?.querySelector(".flex-1.relative")).toBeInTheDocument()
 	})
 })

webview-ui/src/components/chat/ContextWindowProgress.tsx

@@ -60,7 +60,9 @@ export const ContextWindowProgress = ({ contextWindow, contextTokens, maxTokens
 				<StandardTooltip content={tooltipContent} side="top" sideOffset={8}>
 					<div className="flex-1 relative">
 						{/* Main progress bar container */}
-						<div className="flex items-center h-1 rounded-[2px] overflow-hidden w-full bg-[color-mix(in_srgb,var(--vscode-foreground)_20%,transparent)]">
+						<div
+							data-testid="context-progress-bar-container"
+							className="flex items-center h-1 rounded-[2px] overflow-hidden w-full bg-[color-mix(in_srgb,var(--vscode-foreground)_20%,transparent)]">
 							{/* Current tokens container */}
 							<div
 								className="relative h-full"

webview-ui/src/components/chat/__tests__/TaskHeader.spec.tsx

@@ -88,6 +88,15 @@ vi.mock("@roo/array", () => ({
 	},
 }))
 
+// Mock the format utilities
+vi.mock("@/utils/format", async (importOriginal) => {
+	const actual = await importOriginal<typeof import("@/utils/format")>()
+	return {
+		...actual,
+		formatCost: (cost: number) => `$${cost.toFixed(2)}`,
+	}
+})
+
 describe("TaskHeader", () => {
 	const defaultProps: TaskHeaderProps = {
 		task: { type: "say", ts: Date.now(), text: "Test task", images: [] },