I found two places the alert messages are being added to screens dynamically. These are potential stops in the schedule flow, and should be announced to assistive technology users. Screenshots and code recommendations attached below.
Point of Contact
VFS Point of Contact:Trevor
Acceptance Criteria
As a screen reader user, I want the alert boxes to be announced when I try to select a VA provider that I cannot schedule an appoint with, AND
I want to hear the alert box announced when I load the detail view for a pending appointment.
I should hear these messages announced in all major screen readers (JAWS, NVDA, VoiceOver) in their preferred browsers.
Environment
/vaos/new-appointment/va-facility
/vaos/appointments/pending/
Possible Fixes (optional)
We could add an empty <div> to the pages listed in the Environment above, and add aria-live and aria-atomic attributes so the alerts will be read aloud. I created a public codepen to show the different behaviors for live regions: https://codepen.io/tpierce_402/pen/JjjXJXp
Description
I found two places the alert messages are being added to screens dynamically. These are potential stops in the schedule flow, and should be announced to assistive technology users. Screenshots and code recommendations attached below.
Point of Contact
VFS Point of Contact: Trevor
Acceptance Criteria
Environment
/vaos/appointments/pending/Possible Fixes (optional)
We could add an empty
<div>
to the pages listed in the Environment above, and addaria-live
andaria-atomic
attributes so the alerts will be read aloud. I created a public codepen to show the different behaviors for live regions: https://codepen.io/tpierce_402/pen/JjjXJXpWCAG or Vendor Guidance (optional)
Screenshots or Trace Logs