Focus shifts to leaflet-container
after activating markers when using a screen readerΒ #8114
Description
Warning
This issue is blocked on
#8112 and#8115, or there'll be accessibility regressions in some screen readers! This is because the side effect of the focus shift described here actually causes some screen readers to announce tooltips and popups.
- I've looked at the documentation to make sure the behavior is documented and expected
- I'm sure this is a Leaflet code issue, not an issue with my own code nor with the framework I'm using (Cordova, Ionic, Angular, Reactβ¦)
- I've searched through the issues to make sure it's not yet reported
Steps to reproduce
- Go to quick-start/example.html
- Turn on a screen reader of your choice (note that you can pause speech by pressing ctrl at any time, if desired)
- Tab to the marker and press Enter
Expected behavior
When activating the marker, focus should stay on the marker.
Current behavior
When activating the marker, focus is shifted to the map container.
This results in a reset of the focus order for keyboard users, and irrelevant and verbose announcements for screen reader users. It is a failure of WCAG success criterion 3.2.2 On Input.
Environment
- Leaflet version: 1.7.1 / 1.8.0 / 1.9.4
- Browser (with version): Chrome 127.0.6533.90
- OS/Platform (with version): Windows 10
- Assistive tech: Narrator, NVDA
Additional context
The current behavior has the side effect that popups actually are announced (although not only the popup the user is interested in), so this issue is blocked on #8112 and #8115! Or there'll be accessibility regressions.
- The problem for end-users (who use screen readers) is pretty much the same as
_refocusOnMap
forces keyboard/swipe gesture users to navigate all the way back to continue interacting with a control + causes verbose speechΒ #7947.