Skip to content

Accessibility in the Quality Process

mirano-darren edited this page Oct 19, 2022 · 23 revisions

Accessibility Tools

The Quality team is expected to utilize these accessibility tools as part of their review process

Screen Readers

Cypress-Axe

  • Our Cypress tests have cypress-axe built within them for automated accessibility testing. These tests are run on every single page to ensure no accessibility issues get checked in.
  • A11y Standards that are checked are:
  • For more information regarding cypress-axe and A11y testing, please refer to this article!

WAVE Evaluation Tool

  • WAVE is an accessibility tool that can be used to evaluate accessibility on a page!
  • How to use it (Chrome Extension):
    • Navigate to the page you'd like to evaluate and click on the WAVE extension in you Google Chrome extensions. It's that simple.

Accessibility Notes

Navigations with Screen Reader + Tab

Mac Voiceover:

Firefox Chrome Edge Safari
Main Navigation Bar Firefox starts tab at top navigation. User can easily tab through account submenu and log out easily. Tabbing over the drop down menu option whites out the word. [1] Chrome immediately starts at the eAPD navigation, so user has to tab backwards to get to account information. User can easily tab through account submenu and log out easily. Tabbing over the drop down menu option whites out the word. [1] Like Chrome, Edge immediately starts at the eAPD navigation, so user has to tab backwards to get to account information. User can easily tab through account submenu and log out easily. Tabbing over the drop down menu option whites out the word. [1] Like Chrome, Safari immediately starts at the eAPD navigation, so user has to tab backwards to get to account information. Tab will immediately skip the submenu.
eAPD Navigation Tab will start at Skip to Main link. User has to tab through upper navigation to get to eAPD navigation. Voiceover picks up title and will consistently say how many list items under the link. Tab will immediately select the first navigation link in an eAPD. Voiceover will sometimes skip to the next link title or not say the link title. This can be corrected navigating back and forth with Tab and Tab+Shift can reset Voiceover. Like Chrome, tab will immediately select the first navigation link in the eAPD. Voiceover picks up title and is consistent through eAPD navigation. Like Chrome, tab will immediately select the first navigation link in the eAPD. When tabbing through eAPD navigation, tab skips over all sub navigation items to the next navigation.

Window's Narrator:

Firefox Chrome Edge
Main Navigation Bar Firefox starts tab at top navigation. User can easily tab through account submenu and log out easily. Tabbing over the drop down menu option whites out the word. [1] Chrome immediately starts at the eAPD navigation, so user has to tab backwards to get to account information. User can easily tab through account submenu and log out easily. Tabbing over the drop down menu option whites out the word. [1] Like Chrome, Edge immediately starts at the eAPD navigation, so user has to tab backwards to get to account information. User can easily tab through account submenu and log out easily. Tabbing over the drop down menu option whites out the word. [1]
eAPD Navigation Tab will start at Skip to Main link. User has to tab through upper navigation to get to eAPD navigation. Voiceover picks up title and will consistently say how many list items under the link. Tab will immediately select the first navigation link in an eAPD. Voiceover will sometimes skip to the next link title or not say the link title. This can be corrected navigating back and forth with Tab and Tab+Shift can reset Voiceover. Like Chrome, tab will immediately select the first navigation link in the eAPD. Voiceover picks up title and is consistent through eAPD navigation.

[1] Screen Shot 2022-09-14 at 1 21 28 PM

Known Screen Reader Bugs (Chrome + VoiceOver)

When using the Chrome browser, Voiceover, the default screen reader for Mac, does not always work on subforms. When tabbing through existing subforms, such as Key Personnel and Program Management, it will read out the first input value when tabbing on to edit. When edit is selected it will usually start to automatically read a different part of the subform and not say the correct value as the user tabs through the inputs.

To mitigate this, the user can tab back out of the subform and re-tab in and the voiceover should pick up all correct input values.

Voiceover might also not indicate that there is text in a rich text area (for example: Other Funding Description or Activity Details). If this happens, the user can prompt the screen reader by utilizing the up and down arrow keys.

On the page for Assurances and Compliance, Voice over will repeat ‘No no no no’ with no current way to pause or stop.

Known Screen Reader Bugs (Chrome + Narrator)

Tabbing into a rich text area (TinyMCE text boxes) doesn't read the text content out loud.

How we work

eAPD documentation

Design documentation

Technical documentation

Operations and Support documentation

Recovery Plans

Operations Runbooks

Quality Documentation

Clone this wiki locally