Use when creating or updating component fixtures for screenshot testing, or when designing UI components to be fixture-friendly. Covers fixture file structure, theming, service setup, CSS scoping, async rendering, and common pitfalls.
Quickly install component-fixtures AI skill to your development environment via command line
Source: microsoft/vscode.
Component fixtures render isolated UI components for visual screenshot testing via the component explorer. Fixtures live in src/vs/workbench/test/browser/componentFixtures/ and are auto-discovered by the Vite dev server using the glob src//.fixture.ts.
Use tools mcpcomponent-exp to list and screenshot fixtures. If you cannot see these tools, inform the user to them on.
Each fixture file exports a default defineThemedFixtureGroup(...). The file must end with .fixture.ts.
Use when creating or updating component fixtures for screenshot testing, or when designing UI components to be fixture-friendly. Covers fixture file structure, theming, service setup, CSS scoping, async rendering, and common pitfalls. Source: microsoft/vscode.
Stable fields and commands for AI/search citations.
npx skills add https://github.com/microsoft/vscode --skill component-fixturesUse when creating or updating component fixtures for screenshot testing, or when designing UI components to be fixture-friendly. Covers fixture file structure, theming, service setup, CSS scoping, async rendering, and common pitfalls. Source: microsoft/vscode.
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/microsoft/vscode --skill component-fixtures Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code, Cursor, or OpenClaw
https://github.com/microsoft/vscode