Edwin van den Houdt
97f7de4590
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>
34 lines
1.5 KiB
TypeScript
34 lines
1.5 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/angular';
|
|
import { applicationConfig } from '@storybook/angular';
|
|
import { provideRouter } from '@angular/router';
|
|
import { ApplicationLinkComponent } from './application-link.component';
|
|
|
|
const meta: Meta<ApplicationLinkComponent> = {
|
|
title: 'Molecules/Application Link',
|
|
component: ApplicationLinkComponent,
|
|
decorators: [applicationConfig({ providers: [provideRouter([])] })],
|
|
render: (args) => ({
|
|
props: args,
|
|
// Rows are <li>s — a real list gives them their normal layout in the story.
|
|
template: `<ul class="list-unstyled"><app-application-link [heading]="heading" [subtitle]="subtitle" [status]="status" [cta]="cta" [to]="to" [clickable]="clickable" /></ul>`,
|
|
}),
|
|
parameters: {
|
|
// Structural: app-application-link's host sits between the <ul> and its <li> —
|
|
// axe's list/listitem rule requires them adjacent regardless of `display:contents`.
|
|
// WP-11 (CIBG markup fidelity) reworks this markup; see docs/backlog/WP-11-markup-fidelity.md.
|
|
a11y: { disable: true },
|
|
},
|
|
};
|
|
export default meta;
|
|
type Story = StoryObj<ApplicationLinkComponent>;
|
|
|
|
export const Navigatie: Story = {
|
|
args: { heading: 'Inschrijven', subtitle: 'Schrijf u in in het BIG-register.', to: '/registreren' },
|
|
};
|
|
export const Actie: Story = {
|
|
args: { heading: 'Inschrijving', status: 'Stap 2 van 3', cta: 'Verder gaan', clickable: true },
|
|
};
|
|
export const NietInteractief: Story = {
|
|
args: { heading: 'Herregistratie', status: 'Referentie 2024-00123 · ingediend op 12 mei 2024' },
|
|
};
|