LG-7817 Ensure that screen reader maintains user's place on the page.#7487
LG-7817 Ensure that screen reader maintains user's place on the page.#7487eileen-nava wants to merge 10 commits intomainfrom
Conversation
# Conflicts: # app/javascript/packages/document-capture/components/in-person-location-step.tsx
| <AddressSearch onAddressFound={handleFoundAddress} registerField={registerField} /> | ||
| )} | ||
| </div> | ||
| <div role="status"> |
There was a problem hiding this comment.
This would make the region a live region, meaning I'd expect a screen reader to read the entire contents of this region at the first opportunity. Is that expected? Since there's quite a lot of location content, would we want to let the user navigate this themselves, since it's not really a "status" text?
There was a problem hiding this comment.
Yes, that was the screen reader behavior that I expected. I had interpreted these portions of the ticket
I want the screen reader to read out the correct order of the search page experience
and
Flow of the reader should follow the hierarchy of the page
to mean that the screen reader should read the about text and then the locations text.
You’re right that it is a lot of content, and I don’t personally use a screen reader, so I could be missing something. I will check in with product/design about your concerns and then get back to you.
There was a problem hiding this comment.
We already verbally talked about this in a meeting yesterday. However, for posterity’s sake, I wanted to note that I checked in with design/product yesterday and there is a new ticket for the updated screen reader implementation.
| <p>{t('in_person_proofing.body.location.location_step_about')}</p> | ||
| {locationsContent} | ||
| <BackButton onClick={toPreviousStep} /> | ||
| <div aria-live="polite"> |
There was a problem hiding this comment.
Can you explain why we're making this a live region? I'm not sure I follow from the ticket or pull request description how this is related to screen reader hierarchy.
There was a problem hiding this comment.
Oh, I see some of the references in the ticket to an earlier Slack thread. In my mind, I might expect there to be some announcement of a change in the page content, but more brief in terms of "Page updated" or "X results found", not announcing all of the new page content as live content.
|
I am closing this PR because we made a new ticket with the preferred screen reader behavior. The new PR is #7500. |
🎫 Ticket
Screen reader tab order
🛠 Summary of changes
If the user searches for an address on the "Select a location to verify your ID" page.....
[ ] the screen reader will maintain the user's place on the page
[ ] the screen reader will follow the hierarchy of the page
[ ] the screen reader will only read the word "back" once (Due to an issue that existed before this PR, the screen reader would read "back" 2x when it read the back button component)
📜 Testing Plan
👀 Screenshots
Screen capture below
Screen.Recording.2022-12-14.at.11.51.07.AM.mov