add-component-visual-tests

name	add-component-visual-tests
description	Workflow for adding Storybook visual-test stories for a @skyux/* component in this Nx monorepo, used for Percy visual regression snapshots. Use when asked to "add visual tests", "add a story", "create a storybook story", or set up Percy/visual coverage for a component. Covers the @skyux-sdk/e2e-schematics:story generator, the component-e2e generator when no storybook app exists yet, the wrapper component + .stories.ts conventions, and the build/lint/format gate. For unit tests use the add-component-unit-tests skill; for harnesses use the add-component-harness skill. Use when this capability is needed.
metadata	{"author":"blackbaud"}

Add Visual Tests (Storybook stories) for a Component

Use this skill to add Storybook stories that drive Percy visual-regression snapshots for a component in a published @skyux/* library. The file-level conventions live in visual-testing.instructions.md (it auto-applies to **/apps/e2e/*-storybook/src/app/**/*.stories.ts) — read it before writing code rather than guessing.

Read AGENTS.md first if you are not already familiar with the monorepo's conventions (Nx tasks, the e2e/storybook app layout, and Conventional Commits).

When to Use

• A component needs visual-regression coverage (a new story), or an existing story needs to cover a new visual state.

Do NOT use this skill for:

• Unit tests — use add-component-unit-tests.
• — use .