joshkimux
commented
2 years ago Tagging @mnorthuis here for awareness ❤️
Open joshkimux opened 2 years ago
joshkimux
commented
2 years ago Tagging @mnorthuis here for awareness ❤️
joshkimux
commented
2 years ago 
Mottie
commented
2 years ago The "must" fix issue "Add file button must be a button" is assigned to the design system team in ticket https://github.com/department-of-veterans-affairs/va.gov-team/issues/36877. This problem applies to all upload buttons within forms as well, but is dependent on a different component.
joshkimux
commented
1 year ago I've updated this ticket to:
[A11y Maintenance Audit] Claims Status Tools
Maintenance audit of claims status tools. A list of issues will be created to be resolved below. More complex tickets that have dependencies or require interdisciplinary work will be converted into individual issue tickets.
Coverage
May 2022 Cursory Audit
This maintenance audit will cover:
NVDA, Chrome, Windows(Not enough time)It will follow WCAG 2.1 AA standards with mobile considerations.
vetsgov+test233@id.meusing ID.me login password hereMay 2023 Swarm Audit
We completed ~40% of our May 2023 swarm audit due to staging environment limitations where claims and users were inconsistent and difficult to test.
Instead of writing tickets for each of the new tickets, we plan on working with @skylerschain to address issues at their design roots across multiple iterations. The following constraints/acceptance criteria was provided to be implemented into new design iterations:
Headings
Labels
Links
Focus
h1when navigating between pages.Reflow and spacing
Color
List of caught issues
View all unticketed issues
| Issue description | Type | Severity | Design Recommendation | How to recreate | | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | ---------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | Blue text over white background is not AAA color contrast compliant | Color | Minor (4) | The color combination for this text has a contrast of 5.14:1.Darken the blue text to achieve the 7:1 contrast minimum for AAA compliance. | Navigate to the evidence gathering, review and decision accordion text. | | Claim status timeline relies on color to communicate if a step is in progress or not | Color | Major (2) | Provide written labels to communicate where a user is in the process instead of relying on color | Log in as user 233 and view claim 600390785 | | Focus is not managed after clicking "view details" when asking for your claim decision | Focus | Moderate (3) | Provided this is in the context of a single page application flow, focus should be managed to the \`h1\` so screen reader users are quickly oriented on where they have been navigated to "Ask for your claim details" | Log in as user 233 and view claim 600390785, on the files tab, click on "view details" in the ask for your claim decision box | | Remove should not come before selecting the file type in the focus order | Focus | Major (2) | Visually, one may assume the focus should go from selecting the file's type to deciding whether or not to remove it. However, due to the order of elements in the DOM, remove comes first. Focus should first go to the select file type then to remove. | Log in as user 233 and view claim 600390785, on the files tab. Add a file. Upon adding a file, tab through the file's card. Confirm remove comes before selecting a file type. | | Upon removing a file, focus is not managed | Focus | Major (2) | When using a "delete" button that disappears upon clicking it, focus should be managed to return back to what originally triggered the component or to the next logical component. In this case, focus should be returned to "add files." Platform may recommend providing a warning modal before deleting a file. | Log in as user 233 and view claim 600390785, on the files tab. Add a file. Upon adding a file, delete it. Confirm focus is lost. | | [Focus should go to first input field with an error upon submission](https://user-images.githubusercontent.com/14154792/169866049-113c0f47-9682-48ca-96d3-6db69bc535b6.MP4) | Focus | Major (2) | Upon attempting to submit files with errors, focus is not managed. When errors are triggered, focus should go to the first field with an error. | Log in as user 233 and view claim 600390785, on the files tab. Add a file. Upon adding a file, tab to the submit button without selecting a description. Confirm focus is not managed. | | Issue accordion's contents should not have a tabindex of 0 | Focus | Major (2) | Remove the tabindex if there is no need to manually send focus to the accordion's content. | Log in as user 233 and view claim SC6848 | | Submit button should not be disabled | Focus | Major (2) | VA design system standards recommends not to disabled buttons as it prevents users from receiving feedback and may not be detected by assistive technology. Enable it, and provide validation on submit instead to provide a plain language error. | Log in as user 233 and view claim 600390785, on the files tab, click on "view details" in the ask for your claim decision box | | Alerts skip heading levels on claim status page | Headings | Major (2) | Fix skipped heading levels | Log in as user 7 and view the claim status page | | Next steps skips heading levels on dependency claim status | Headings | Major (2) | Fix skipped heading levels | Log in as user 233 and view claim 600393080 | | Uploaded file headings should be headings, not spans | Headings | Major (2) | Despite looking like headings and starting sub-sections on the page through cards, the file card headings are in fact just spans. These should each be headings at the appropriate heading level. | Log in as user 233 and view claim 600390785, on the files tab. Add a file. Inspect the title of the card and confirm they are not headings. | | Payments skips heading levels on dependency claim status | Headings | Major (2) | Fix skipped heading levels | Log in as user 46 and view claim 600282890. Inspect the heading order and confirm there's a skipped heading. | | Information alert is missing a heading | Headings | Major (2) | Provide a heading for the information alert | Log in as user 46 and view claim 600392913. On the status page, confirm the information alert is missing a heading. | | [VoiceOver headings span bug splits up headings and requires span role="text" fix](https://user-images.githubusercontent.com/14154792/169866051-475aed9b-a6ed-4be3-bb32-a31eb6b169d9.PNG) | Headings | Minor (4) | | | | [Add file instructions / descriptions should be semantically linked to the add file button using aria-describedby](https://user-images.githubusercontent.com/14154792/169866025-f86d87a3-452f-4dae-a5bb-d239cae19268.PNG) | Labels | Major (2) | | | | [List of additional evidence should be unique or uniquely described](https://user-images.githubusercontent.com/14154792/169905053-5d1b9fe2-3873-4463-a074-e3a01da0f4b3.png) | Labels | Major (2) | | | | Consider including the count of claims being shown within the h2 (or describing it programatically) | Labels | Minor (4) | Across VA.gov for most pagination patterns we set the "showing x of y" as a \`h2\` for (a) easy navigability and (b) focus management | Log in as user 233 and view the claim status page | | It's unclear what "not yet-I still have more evidence to submit" means or will do | Labels | Moderate (3) | Buttons should clearly describe what they will do. Consider breaking this apart into smaller bits e.g. ask them if they have more evidence to submit (y/n) -> if yes, send them to a confirmation page explaining what they should do next with a link to return back to the claim status page / if no, ask them to confirm they've submitted all evidence -> submit | Log in as user 233 and view claim 600390785, on the files tab, click on "view details" in the ask for your claim decision box | | Buttons are not uniquely labelled | Labels | Major (2) | Remove buttons should have unique \`aria-label\`s describing what they are deleting. | Log in as user 233 and view claim 600390785, on the files tab. Add a file. Upon adding a file, turn on your screen reader. Tab to the remove button. Confirm it is not uniquely described. | | Mobile alert links open in a new tab | Links | Moderate (3) | Links should only open in a new tab when absolutely necessary. Consider not making this open in a new tab OR, if necessary, including (opens in new tab) within the link text. | Log in as user 233 and view the claim status page | | Open a live chat opens in a new tab | Links | Moderate (3) | Links should only open in a new tab when absolutely necessary. Consider not making this open in a new tab OR, if necessary, including (opens in new tab) within the link text. | Log in as user 233 and view the claim status page | | View details link for "ask for your claim decision" should be styled as an action link, not a button | Links | Moderate (3) | Use the action link style, not a button | Log in as user 233 and view claim 600390785, on the files tab, click on "view details" in the ask for your claim decision box | | Mail them to the VA claims opens in a new tab | Links | Moderate (3) | Links should only open in a new tab when absolutely necessary. Consider not making this open in a new tab OR, if necessary, including (opens in new tab) within the link text. | Log in as user 233 and view claim 600390785, on the files tab, expand the "need to mail claim" accordion | | Cancel link does not provide a purpose nor destination | Links | Major (2) | Links should include target and destination. In this case, it's unclear why cancel was designed to navigate to the status tab. I'm not entirely certain of its purpose. I've marked this as major as it can suddenly navigate the user out of the flow. | Log in as user 233 and view claim 600390785, on the files tab, find the cancel link next to submit files for review | | [Mobile card design needs more padding below the action link](https://user-images.githubusercontent.com/14154792/169866046-1467bf93-bc43-4663-9d2a-7673148012b4.PNG) | Other | Minor (4) | | | | Visual bug with errors in file type | Other | Minor (4) | When de-selecting a file type, an error is thrown. The visual styling breaks out of the upload box. | Log in as user 233 and view claim 600390785, on the files tab. Add a file. Upon adding a file, select a file type. Then de-select that type. Confirm the visual styling is broken. | | Accordions' + and - icons do not follow design system guidance and are likely to be missed by ZoomText users | Reflow | Major (2) | Follow design system guidance for accordions. | Log in as user 233 and view claim 600390785 | | Long file title overflows on mobile upon triggering an error during submission | Reflow | Critical (1, LB) | When submitting a file with a long file name and an error appears, the error overflows due to the long file name.
Ensure this error message forces a wrap. | Log in as user 233 and view claim 600390785, on the files tab. Add a file with a long file name and submit it. Confirm the error message overflows. | | We're adding your details is visually below the tabs, but programatically above the tabs at the same time | Wicked | Moderate (3) | There's a mismatch between the visual and aural experience. "We're adding your details" is both above and below the tabs at the same time as...
\- The interactive tabs themselves are above "We're adding your details"
\- The heading started the section of the tab is below "We're adding your details"
To fix this, "We're adding your details" should not belong to any of the spokes (or within the tabs); it should be a part of the global information above the tabs OR a part of the hub. | Log in as user 233 and view claim 600390785. Inspect the heading order and confirm that this shit be wack. |
Feedback framework