{"componentChunkName":"component---src-pages-components-file-uploader-accessibility-mdx","path":"/components/file-uploader/accessibility/","result":{"pageContext":{"frontmatter":{"title":"File uploader","description":"File uploaders allow the user to transfer a file or submit content of their own.","tabs":["Code","Usage","Style","Accessibility"]},"relativePagePath":"/components/file-uploader/accessibility.mdx","titleType":"prepend","MdxNode":{"id":"9f8d95ee-2510-57a0-acf0-e90dd26fa47a","children":[],"parent":"a9773e4c-5131-5065-8890-77ca62f8e1b2","internal":{"content":"---\ntitle: File uploader\ndescription: File uploaders allow the user to transfer a file or submit content of their own.\ntabs: ['Code', 'Usage', 'Style', 'Accessibility']\n---\n\nimport {\n  StructuredListWrapper,\n  StructuredListHead,\n  StructuredListBody,\n  StructuredListRow,\n  StructuredListInput,\n  StructuredListCell,\n  OrderedList,\n  ListItem,\n} from 'carbon-components-react';\n\n<PageDescription>\n\nThe file uploader React Carbon component has been tested against the latest\n[W3C Web Content Accessibility Guidelines (WCAG) 2.1 Level A and AA success\ncriteria](https://www.w3.org/TR/WCAG21/) and violations have been identified\nas high priority issues. This document will be updated when these\naccessibility issues are resolved.\n\n</PageDescription>\n\n<AnchorLinks>\n  <AnchorLink>Accessibility considerations</AnchorLink>\n  <AnchorLink>Resources</AnchorLink>\n  <AnchorLink>Accessibility testing</AnchorLink>\n</AnchorLinks>\n\n## Accessibility considerations\n\n1. After the file uploader closes, focus should retain the user's point of regard and return to the element that invoked it.\n2. The file uploader button can be activated using both the `Space` or `Enter` key.\n3. The file uploader button should have text or label that accurately describes the action of the button.\n\n## Resources\n\n- [IBM Accessibility Checklist Checkpoint](https://www.ibm.com/able/guidelines/ci162/accessibility_checklist.html):\n  - [1.4.13 Content on Hover or Focus](https://www.ibm.com/able/guidelines/ci162/no_keyboard_trap.html) (WCAG Success Criteria [1.4.13](https://www.w3.org/WAI/WCAG21/Understanding/content-on-hover-or-focus.html))\n  - [2.1.2 No Keyboard Traps](https://www.ibm.com/able/guidelines/ci162/no_keyboard_trap.html) (WCAG Success Criteria [2.1.2](https://www.w3.org/TR/UNDERSTANDING-WCAG20/keyboard-operation-trapping.html))\n  - [2.4.3 Focus Order](https://www.ibm.com/able/guidelines/ci162/link_purpose.html) (WCAG Success Criteria [2.4.3](https://www.w3.org/WAI/WCAG21/Understanding/focus-order))\n  - [3.2.2 On Input](https://www.ibm.com/able/guidelines/ci162/on_input.html) (WCAG Success Criteria [3.2.2](https://www.w3.org/TR/2016/NOTE-UNDERSTANDING-WCAG20-20161007/consistent-behavior-unpredictable-change.html))\n\n## Accessibility testing\n\nAutomated, manual and screen reader accessibility verification test has been performed on the file uploader React Carbon Component. [WCAG 2.1 Level A and AA success criteria](https://www.w3.org/TR/WCAG21/) issues have been identified and the list of open accessibility violations is available in the Carbon Component GitHub repository.\n\n### Automated test\n\n<Row>\n  <Column noGutterSm>\n    <StructuredListWrapper>\n      <StructuredListHead>\n        <StructuredListRow head>\n          <StructuredListCell head>\n            Automated test environment\n          </StructuredListCell>\n          <StructuredListCell head>Results</StructuredListCell>\n        </StructuredListRow>\n      </StructuredListHead>\n      <StructuredListBody>\n        <StructuredListRow>\n          <StructuredListCell>\n            - macOS Mojave version 10.14.2 with VoiceOver\n            <br />\n            - Chrome version 77.0.3865.90\n            <br />\n            - Dynamic Assessment Plugin (DAP) version 1.8.0.0 - IBM\n            Accessibility WCAG 2.1 Sept. 2019 Ruleset\n            <br />- Carbon React version 7.7.1\n          </StructuredListCell>\n          <StructuredListCell>\n            <strong>DAP test:</strong>\n            <br />- No violations\n          </StructuredListCell>\n        </StructuredListRow>\n      </StructuredListBody>\n    </StructuredListWrapper>\n  </Column>\n</Row>\n","type":"Mdx","contentDigest":"e0003cccdcd4e36622309f52b93de67b","counter":1509,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"File uploader","description":"File uploaders allow the user to transfer a file or submit content of their own.","tabs":["Code","Usage","Style","Accessibility"]},"exports":{},"rawBody":"---\ntitle: File uploader\ndescription: File uploaders allow the user to transfer a file or submit content of their own.\ntabs: ['Code', 'Usage', 'Style', 'Accessibility']\n---\n\nimport {\n  StructuredListWrapper,\n  StructuredListHead,\n  StructuredListBody,\n  StructuredListRow,\n  StructuredListInput,\n  StructuredListCell,\n  OrderedList,\n  ListItem,\n} from 'carbon-components-react';\n\n<PageDescription>\n\nThe file uploader React Carbon component has been tested against the latest\n[W3C Web Content Accessibility Guidelines (WCAG) 2.1 Level A and AA success\ncriteria](https://www.w3.org/TR/WCAG21/) and violations have been identified\nas high priority issues. This document will be updated when these\naccessibility issues are resolved.\n\n</PageDescription>\n\n<AnchorLinks>\n  <AnchorLink>Accessibility considerations</AnchorLink>\n  <AnchorLink>Resources</AnchorLink>\n  <AnchorLink>Accessibility testing</AnchorLink>\n</AnchorLinks>\n\n## Accessibility considerations\n\n1. After the file uploader closes, focus should retain the user's point of regard and return to the element that invoked it.\n2. The file uploader button can be activated using both the `Space` or `Enter` key.\n3. The file uploader button should have text or label that accurately describes the action of the button.\n\n## Resources\n\n- [IBM Accessibility Checklist Checkpoint](https://www.ibm.com/able/guidelines/ci162/accessibility_checklist.html):\n  - [1.4.13 Content on Hover or Focus](https://www.ibm.com/able/guidelines/ci162/no_keyboard_trap.html) (WCAG Success Criteria [1.4.13](https://www.w3.org/WAI/WCAG21/Understanding/content-on-hover-or-focus.html))\n  - [2.1.2 No Keyboard Traps](https://www.ibm.com/able/guidelines/ci162/no_keyboard_trap.html) (WCAG Success Criteria [2.1.2](https://www.w3.org/TR/UNDERSTANDING-WCAG20/keyboard-operation-trapping.html))\n  - [2.4.3 Focus Order](https://www.ibm.com/able/guidelines/ci162/link_purpose.html) (WCAG Success Criteria [2.4.3](https://www.w3.org/WAI/WCAG21/Understanding/focus-order))\n  - [3.2.2 On Input](https://www.ibm.com/able/guidelines/ci162/on_input.html) (WCAG Success Criteria [3.2.2](https://www.w3.org/TR/2016/NOTE-UNDERSTANDING-WCAG20-20161007/consistent-behavior-unpredictable-change.html))\n\n## Accessibility testing\n\nAutomated, manual and screen reader accessibility verification test has been performed on the file uploader React Carbon Component. [WCAG 2.1 Level A and AA success criteria](https://www.w3.org/TR/WCAG21/) issues have been identified and the list of open accessibility violations is available in the Carbon Component GitHub repository.\n\n### Automated test\n\n<Row>\n  <Column noGutterSm>\n    <StructuredListWrapper>\n      <StructuredListHead>\n        <StructuredListRow head>\n          <StructuredListCell head>\n            Automated test environment\n          </StructuredListCell>\n          <StructuredListCell head>Results</StructuredListCell>\n        </StructuredListRow>\n      </StructuredListHead>\n      <StructuredListBody>\n        <StructuredListRow>\n          <StructuredListCell>\n            - macOS Mojave version 10.14.2 with VoiceOver\n            <br />\n            - Chrome version 77.0.3865.90\n            <br />\n            - Dynamic Assessment Plugin (DAP) version 1.8.0.0 - IBM\n            Accessibility WCAG 2.1 Sept. 2019 Ruleset\n            <br />- Carbon React version 7.7.1\n          </StructuredListCell>\n          <StructuredListCell>\n            <strong>DAP test:</strong>\n            <br />- No violations\n          </StructuredListCell>\n        </StructuredListRow>\n      </StructuredListBody>\n    </StructuredListWrapper>\n  </Column>\n</Row>\n","fileAbsolutePath":"/zeit/1dde86ed/src/pages/components/file-uploader/accessibility.mdx"}}}}