You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
test(webview): use the real VS Code toolkit in Playwright visual baselines #2105
The Playwright visual tests do not show the real VS Code toolkit components.
webview-ui/playwright/vite.config.ts replaced @vscode/webview-ui-toolkit/react with the Vitest mock (webview-ui/src/__mocks__/@vscode/webview-ui-toolkit/react.tsx) for every story. The mock draws a plain <input> and puts the label after it. The extension uses real toolkit custom elements, which put the label above the field and add padding and borders.
As a result, baselines that show a VSCodeTextField (and other toolkit components) do not look like the extension. Example: openai-compatible-azure-guidance-dark.png shows each label under its input. A visual test that does not match the extension gives little value.
Current state
PR #1299 adds Ollama.visual.tsx. It is the first story that uses the real toolkit.
vite.config.ts now has a plugin, playwright-gallery-toolkit-mock. It gives the mock to every importer except those in realToolkitImporters.
realToolkitImporters has one entry: /settings/providers/Ollama.tsx.
optimizeDeps.include lists the toolkit. Without it, a cold Vite cache makes the first run fail.
Task
Move every story that uses toolkit components to the real toolkit. Add each importer to realToolkitImporters, or remove the mock for the gallery.
Regenerate the baselines with pnpm test:visual:docker:update.
Review each new image against the extension.
Check that the contrast audits and layout contracts still pass.
Notes
In a trial that removed the alias for all stories, 26 visual tests failed. The count includes tests that are also flaky on the unchanged branch (for example RenderedContentContrast). Check this count again before the work starts.
RenderedContentContrast and ChatTextArea failed in a full local Docker run on an unchanged branch. They passed when run alone. Find the cause before you trust a full-suite result.
Do this in small steps, for example one settings area for each PR, so each baseline review stays small.
Activity