Merge pull request #30153 from storybookjs/docs_fix_broken_a11y_links

Docs: A11y minor fixes
storybookjs · Dec 30, 2024 · c321ce9 · c321ce9
2 parents 2b9f1cf + ac11562
commit c321ce9
Show file tree

Hide file tree

Showing 5 changed files with 156 additions and 14 deletions.
diff --git a/code/addons/a11y/docs/screenshot.png b/code/addons/a11y/docs/screenshot.png
diff --git a/docs/_snippets/storybook-addon-a11y-component-config.md b/docs/_snippets/storybook-addon-a11y-component-config.md
@@ -23,6 +23,11 @@ const meta: Meta<MyComponent> = {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },
@@ -62,6 +67,11 @@ export default meta;
             },
           ],
         },
+        /*
+         * 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: {}
       },
     },
@@ -97,6 +107,11 @@ export default {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },
@@ -131,6 +146,11 @@ export default {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },
@@ -168,6 +188,11 @@ export default {
             },
           ],
         },
+        /*
+         * 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: {},
       },
     },
@@ -205,6 +230,11 @@ const meta = {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },
@@ -244,6 +274,11 @@ const meta = {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },
@@ -283,6 +318,11 @@ export default meta;
             },
           ],
         },
+        /*
+         * 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: {},
       },
     },
@@ -320,6 +360,11 @@ const meta: Meta<typeof MyComponent> = {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },
@@ -359,6 +404,11 @@ const meta: Meta<typeof MyComponent> = {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },
@@ -393,6 +443,11 @@ export default {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },
@@ -427,6 +482,11 @@ const meta: Meta = {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   },

diff --git a/docs/_snippets/storybook-addon-a11y-global-config.md b/docs/_snippets/storybook-addon-a11y-global-config.md
@@ -18,7 +18,11 @@ export default {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -54,7 +58,11 @@ const preview: Preview = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },

diff --git a/docs/_snippets/storybook-addon-a11y-story-config.md b/docs/_snippets/storybook-addon-a11y-story-config.md
@@ -28,7 +28,11 @@ export const ExampleStory: Story = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -66,7 +70,11 @@ export const ExampleStory = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -109,7 +117,11 @@ export const ExampleStory: Story = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -152,7 +164,11 @@ export const ExampleStory: Story = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -195,7 +211,17 @@ export const ExampleStory: Story = {
           },
         ],
       },
+      /*
+       * 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: {},
+    },
+  }}
+  globals={{
+    a11y: {
+      // Optional flag to prevent the automatic check
       manual: true,
     },
   }}
@@ -227,7 +253,17 @@ export const ExampleStory = {
           },
         ],
       },
+      /*
+       * 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: {},
+    },
+  },
+  globals: {
+    a11y: {
+      // Optional flag to prevent the automatic check
       manual: true,
     },
   },
@@ -264,6 +300,11 @@ export const ExampleStory = {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   }}
@@ -306,7 +347,11 @@ export const ExampleStory: Story = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -349,6 +394,11 @@ export const ExampleStory: Story = {
           },
         ],
       },
+      /*
+       * 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: {},
     },
   }}
@@ -391,7 +441,11 @@ export const ExampleStory: Story = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -429,7 +483,11 @@ export const ExampleStory = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -472,7 +530,11 @@ export const ExampleStory = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -515,7 +577,11 @@ export const ExampleStory = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -551,7 +617,11 @@ export const ExampleStory = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },
@@ -592,7 +662,11 @@ export const ExampleStory: Story = {
           },
         ],
       },
-      // Axe's options parameter
+      /*
+       * 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: {},
     },
   },

diff --git a/docs/writing-tests/accessibility-testing.mdx b/docs/writing-tests/accessibility-testing.mdx
@@ -53,7 +53,7 @@ Cycling through both stories, you will see that the `Inaccessible` story contain
 
 ### Configure
 
-Out of the box, Storybook's accessibility addon includes a set of accessibility rules that cover most issues. You can also fine-tune the [addon configuration](https://github.com/storybookjs/storybook/tree/next/code/addons/a11y#parameters) or override [Axe's ruleset](https://github.com/storybookjs/storybook/tree/next/code/addons/a11y#handling-failing-rules) to best suit your needs.
+Out of the box, Storybook's accessibility addon includes a set of accessibility rules that cover most issues. You can also fine-tune the addon configuration or override [Axe's ruleset](https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#api-name-axeconfigure) to best suit your needs.
 
 #### Global a11y configuration