Router: Which assistive technologies does Reach Router work with?

[nickcolley]

Hey! This project is amazing, thanks so much for sharing.

I had a look at the accessibility page: https://reach.tech/router/accessibility which assistive technologies is Reach Router tested in?

[ryanflorence]

I've used Safari + Voiceover, @marcysutton hasn't had a chance to test in JAWS and NVDA, but we will soon.

It's a pretty simple implementation though, we use role="group" for each router and move focus to it when it changes. We're after this:

Assistive technology products should listen for such an event and notify the user accordingly:

Screen readers should announce the group when focus first lands on a control inside it, and if aria-describedby has been set, the description may be spoken. Following this the focused control may be announced.

Screen magnifiers may enlarge the group.

https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_group_role

The "region" role might be a better semantic fit though. Waiting for @marcysutton to do some testing. Either way, moving focus w/ an imperfect role is a lot better than doing nothing :)

I'd like to record some videos showing what it's like in the popular screen readers.

If you've got JAWS or NVDA available I'd love to get your help :)

[nickcolley]

see https://github.com/reach/router/issues/20

[marcysutton]

iOS Voiceover and Safari is a big combo to test as well–it's the one that has the most trouble with programmatic focus management IMO. I've heard it has trouble focusing on wrapper elements and even headings with tabindex="-1", and also repeated focus calls to content that hasn't really changed. So it would be worth testing. I could do it later this week if nobody beats me to it.

[ryanflorence]

I need to make some money and buy JAWS here soon, but I've been re-learning VO and NVDA, and so far things are working how I'd like them to.

• On route changes the focus moves to the new content
• The new content is announced and the SR starts to read out the items in the "group"

[nickcolley]

@ryanflorence you can use JAWS in a 40minute mode for free!

Edit: Hmm, worth noting https://webaim.org/blog/jaws-license-not-developer-friendly/
Edit2: http://chrishofstader.com/what-did-i-just-agree-to/ it seems blurry, so make your own judgement.

[ryanflorence]

Yeah I'm just gonna buy it. I can't live my life on a 40 minute timer.

[marcysutton]

Following up on this: for the most part, it works well with iOS voiceover! I see very little issues with the demos as designed, but it would be interesting to test it again in a real-world application.

One thing I did find: the Invoice views in some of the demos don't seem to focus on mobile Voiceover in Safari though..it seems like they need an extra delay or something. https://reach.tech/router/tutorial/09-navigate