Adding automated accessibility tests for layout pages (#2995)

* a11y testing on acccordion * updated a11y testing
elastic · Mar 9, 2020 · feb59d7 · feb59d7
1 parent 2271622
commit feb59d7
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 12 deletions.
diff --git a/scripts/a11y-testing.js b/scripts/a11y-testing.js
@@ -8,7 +8,7 @@ const docsPages = async (root, page) => {
     ...(await page.$$eval('nav a', anchors => anchors.map(a => a.href))),
   ];
 
-  links = links.splice(0, 9);
+  links = links.splice(0, 14);
 
   return links;
 };

diff --git a/src-docs/src/views/accordion/accordion_arrow.js b/src-docs/src/views/accordion/accordion_arrow.js
@@ -10,7 +10,7 @@ import {
 export default () => (
   <div>
     <EuiAccordion
-      id="accordion10"
+      id="accordion9"
       buttonContent="Arrows default to the left"
       paddingSize="s">
       <EuiText>
@@ -22,7 +22,7 @@ export default () => (
     </EuiAccordion>
     <EuiSpacer />
     <EuiAccordion
-      id="accordion11"
+      id="accordion10"
       arrowDisplay="right"
       buttonContent="This one has it on the right"
       paddingSize="s">
@@ -35,7 +35,7 @@ export default () => (
     </EuiAccordion>
     <EuiSpacer />
     <EuiAccordion
-      id="accordion12"
+      id="accordion11"
       arrowDisplay="none"
       buttonContent="This one has it removed entirely"
       paddingSize="s">

diff --git a/src-docs/src/views/accordion/accordion_callback.js b/src-docs/src/views/accordion/accordion_callback.js
@@ -5,7 +5,7 @@ import { EuiAccordion, EuiText, EuiCode } from '../../../../src/components';
 export default () => (
   <div>
     <EuiAccordion
-      id="accordion1"
+      id="accordion8"
       buttonContent="I have an `onToggle` callback"
       onToggle={isOpen =>
         console.log(`EuiAccordion is now ${isOpen ? 'open' : 'closed'}`)

diff --git a/src-docs/src/views/accordion/accordion_form.js b/src-docs/src/views/accordion/accordion_form.js
@@ -52,7 +52,7 @@ const buttonContent = (
 
       <EuiFlexItem>
         <EuiTitle size="s" className="euiAccordionForm__title">
-          <h6>Webhook</h6>
+          <h3>Webhook</h3>
         </EuiTitle>
       </EuiFlexItem>
     </EuiFlexGroup>

diff --git a/src-docs/src/views/accordion/accordion_grow.js b/src-docs/src/views/accordion/accordion_grow.js
@@ -70,7 +70,7 @@ class AccordionGrow extends Component {
   render() {
     return (
       <EuiAccordion
-        id="accordion1"
+        id="accordion7"
         buttonContent="Click me to toggle close / open"
         initialIsOpen={true}
         paddingSize="l">

diff --git a/src-docs/src/views/accordion/accordion_multiple.js b/src-docs/src/views/accordion/accordion_multiple.js
@@ -5,7 +5,7 @@ import { EuiAccordion, EuiText, EuiSpacer } from '../../../../src/components';
 export default () => (
   <div>
     <EuiAccordion
-      id="accordion1"
+      id="accordion3"
       buttonContent="An accordion with padding applied through props"
       paddingSize="l">
       <EuiText>
@@ -18,7 +18,7 @@ export default () => (
     <EuiSpacer />
 
     <EuiAccordion
-      id="accordion2"
+      id="accordion4"
       buttonContent="A second accordion with padding and a very long title that should truncate because of eui-textTruncate"
       buttonContentClassName="eui-textTruncate"
       paddingSize="l">
@@ -35,7 +35,7 @@ export default () => (
     <EuiSpacer />
 
     <EuiAccordion
-      id="accordion3"
+      id="accordion5"
       buttonContent="A third accordion with a nested accordion"
       paddingSize="m">
       <EuiText>
@@ -45,7 +45,7 @@ export default () => (
         </p>
       </EuiText>
       <EuiSpacer />
-      <EuiAccordion id="accordion4" buttonContent="A fourth nested accordion">
+      <EuiAccordion id="accordion6" buttonContent="A fourth nested accordion">
         <EuiText>
           <p>The content inside can be of any height.</p>
           <p>The content inside can be of any height.</p>

diff --git a/src-docs/src/views/accordion/accordion_open.js b/src-docs/src/views/accordion/accordion_open.js
@@ -5,7 +5,7 @@ import { EuiAccordion, EuiText, EuiCode } from '../../../../src/components';
 export default () => (
   <div>
     <EuiAccordion
-      id="accordion1"
+      id="accordion2"
       buttonContent="I am opened by default. Click me to toggle close / open"
       initialIsOpen={true}
       paddingSize="l">