javascript - Screenreader focus lost/cannot be regained in React app?

Question

I have a React app where users go from Page A -> Page B.

After going from Page A to B, though, the Mac OS X screenreader focus is lost and even though the keyboard focus is set and the user can scroll through various elements on that page using the keyboard, the screenreader does not move. The black outline for the screenreader remains on the position where it was from Page A.

If I turn off the screenreader and then turn it back on when on Page B, then it works on Page B all of a sudden.

Is this likely related to the shadow DOM? If so, how can I solve this?

question from:https://stackoverflow.com/questions/66052639/screenreader-focus-lost-cannot-be-regained-in-react-app

Answer 1

Waitting for answers