Skip to content

Focus shifts to leaflet-container after activating markers when using a screen readerΒ #8114

Open
@Malvoz

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

  1. Go to quick-start/example.html
  2. Turn on a screen reader of your choice (note that you can pause speech by pressing ctrl at any time, if desired)
  3. 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.

Metadata

Assignees

No one assigned

    Labels

    accessibilityAnything related to ensuring no barriers exist that prevent interactions or information accessbuglater

    Type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions