Component Fixtures

This handles component fixtures for visual screenshot testing in VS Code's component explorer. It walks you through the fixture file structure, how to use defineThemedFixtureGroup to auto-generate dark and light variants, and how to set up the dependency injection container with createEditorServices. The real value is in the specifics: CSS scoping gotchas when your component relies on deep ancestor selectors, how to avoid DOM reparenting that causes flicker in screenshots, and patterns for mocking services. Use it when you're building isolated UI component tests or need to make existing components fixture-friendly without breaking their production CSS.

Install to Claude Code

npx -y skills add microsoft/vscode --skill component-fixtures --agent claude-code