Turn the interactive Storybook a11y addon into a build gate: - @storybook/test-runner + axe-playwright over the static build (.storybook/test-runner.ts reads the a11y tags from story context) - test-storybook / test-storybook:ci scripts; storybook-a11y CI job - triage: escape-hatch a11y.disable on stories whose display:contents wrapper splits <ul>/<li> or <dl>/<dt>/<dd> (structural, deferred to WP-11/WP-12, each with justification + cross-ref) - fix trivial violations: footer/wizard-shell contrast, text-input label, wizard stories missing provideApiClient Verified: broken story fails the gate; 133 stories pass. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
22 lines
642 B
TypeScript
22 lines
642 B
TypeScript
import type { TestRunnerConfig } from '@storybook/test-runner';
|
|
import { getStoryContext } from '@storybook/test-runner';
|
|
import { injectAxe, checkA11y } from 'axe-playwright';
|
|
|
|
const config: TestRunnerConfig = {
|
|
async preVisit(page) {
|
|
await injectAxe(page);
|
|
},
|
|
async postVisit(page, context) {
|
|
const storyContext = await getStoryContext(page, context);
|
|
if (storyContext.parameters?.a11y?.disable) return;
|
|
|
|
await checkA11y(page, '#storybook-root', {
|
|
axeOptions: storyContext.parameters?.a11y?.config,
|
|
detailedReport: true,
|
|
detailedReportOptions: { html: true },
|
|
});
|
|
},
|
|
};
|
|
|
|
export default config;
|