feat(webview): add Playwright CT coverage ratcheting

Author: edelauna

.github/workflows/visual-regression.yml

@@ -32,6 +32,14 @@ jobs:
                   install-args: "--frozen-lockfile"
             - name: Run webview visual tests
               run: pnpm --filter @roo-code/vscode-webview test:visual
+            - name: Upload visual test coverage to Codecov
+              if: always()
+              uses: codecov/codecov-action@b9fd7d16f6d7d1b5d2bec1a2887e65ceed900238 # v4
+              with:
+                  files: webview-ui/coverage-ct/lcov.info
+                  disable_search: true
+                  flags: webview-ui-ct
+                  token: ${{ secrets.CODECOV_TOKEN }}
             - name: Upload visual test artifacts
               if: failure()
               uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4

codecov.yml

@@ -11,6 +11,7 @@ coverage:
         threshold: 0.5%
         flags:
           - webview-ui
+          - webview-ui-ct
     patch:
       default:
         target: 80%       # new lines must be 80% covered
@@ -20,13 +21,18 @@ coverage:
         threshold: 0%
         flags:
           - webview-ui
+          - webview-ui-ct
 
 flag_management:
   individual_flags:
     - name: webview-ui
       paths:
         - webview-ui/src/
       carryforward: true
+    - name: webview-ui-ct
+      paths:
+        - webview-ui/src/
+      carryforward: true
     - name: core-unit
       paths:
         - packages/core/src/

knip.json

@@ -31,7 +31,8 @@
 				"react-compiler-runtime",
 				"source-map",
 				"tailwindcss",
-				"tailwindcss-animate"
+				"tailwindcss-animate",
+				"monocart-coverage-reports"
 			]
 		},
 		"apps/cli": {

pnpm-lock.yaml

@@ -108,6 +108,7 @@
 		"@vitest/ui": "4.1.9",
 		"babel-plugin-react-compiler": "1.0.0",
 		"jsdom": "26.1.0",
+		"monocart-coverage-reports": "^2.12.12",
 		"vite": "8.1.0",
 		"vitest": "4.1.9"
 	}

webview-ui/package.json

@@ -44,7 +44,6 @@ export default defineConfig({
 				"process.env.PKG_RELEASE_CHANNEL": JSON.stringify("stable"),
 			},
 			optimizeDeps: {
-				include: ["@vscode/webview-ui-toolkit"],
 				exclude: ["@vscode/codicons"],
 			},
 		},

webview-ui/playwright-ct.config.ts

@@ -1,3 +1,10 @@
 import "./vscode-theme-dark.css"
 import "@vscode/codicons/dist/codicon.css"
 import "../src/index.css"
+
+// Eagerly load the toolkit into the CT entry chunk so lazy component chunks
+// reference already-registered custom elements. Splitting the toolkit into a
+// separate lazy chunk triggers a Vite 8/Rolldown scope-hoist bug that leaves
+// `FoundationElement` in a TDZ (`FoundationElement$N is not defined`).
+// See vitejs/vite#22583 and vscode-webview-ui-toolkit#561 (deprecated).
+import "@vscode/webview-ui-toolkit/react"

webview-ui/playwright/index.tsx

@@ -8,7 +8,6 @@ test("renders a toolkit progress indicator in the VS Code dark theme", async ({
 	const progressRing = component.locator("vscode-progress-ring")
 
 	await progressRing.evaluate(async (element) => {
-		await document.fonts.ready
 		await customElements.whenDefined("vscode-progress-ring")
 		await new Promise<void>((resolve) => requestAnimationFrame(() => resolve()))