Skip to content

Instantly share code, notes, and snippets.

@kylegach
Last active April 3, 2025 14:38
Show Gist options
  • Select an option

  • Save kylegach/4659ab5583c133f4bab7e0a0a0496ac7 to your computer and use it in GitHub Desktop.

Select an option

Save kylegach/4659ab5583c133f4bab7e0a0a0496ac7 to your computer and use it in GitHub Desktop.
Enabling WCAG 2.2 AA rules in @storybook/addon-a11y
// .storybook/preview.ts
// Replace your-renderer with the renderer you are using (e.g., react, vue3)
import { Preview } from '@storybook/your-renderer';
const defaultRulesets = ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa', 'best-practice'];
const preview: Preview = {
parameters: {
a11y: {
/*
* Axe's options parameter
* See https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#options-parameter
* to learn more about the available options.
*/
options: {
/*
* Opt in to running WCAG 2.2 AA rules
* Note that you must explicitly re-specify the defaults
* See https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#options-parameter-examples for more details
*/
runOnly: [...defaultRulesets, 'wcag22aa']
},
},
},
};
export default preview;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment