Tooltips should be (reliably and deliberately) announced to screen reader users #8112
Labels
accessibility
Anything related to ensuring no barriers exist that prevent interactions or information access
help wanted
Is your feature request related to a problem? Please describe.
When tooltips are toggled visible they're not reliably announced by screen readers.
This is because screen readers generally don't announce elements on DOM updates or changes to CSS (e.g.
display
).(I.e. #8111 doesn't help the case for screen reader users.)
(I say "not reliably announced" because a side effect of the focus loss described in #8114 causes Narrator to announce all tooltips when only 1 is toggled opened. OTOH, in NVDA tooltips are not announced at all after being toggled visible.)
Describe the solution you'd like
For each open tooltip:
role="tooltip"
(onleaflet-tooltip
)aria-describedby
on the bound element(s) with anid
reference to the tooltip(s)(space-separated
id
references if pointing to multiple tooltips)Caveat: standalone tooltips
This proposed solution is not applicable to standalone tooltips since there's no element to be described using
aria-describedby
. No natural element anyway, could perhaps be hacked around... Anyway, this is the safest option, and as such another reason for implementers to try to avoid standalone tooltips.Describe alternatives you've considered
1. Make the
leaflet-tooltip-pane
an ARIA Live regionBy setting it to
role="status"
, andaria-live="polite"
per MDN's compatibility notes:This will result in tooltips being announced to screen reader users when they're toggled visible.
However, this solution could potentially have negative effects on screen reader users if the Leaflet implementer is toggling tooltips irresponsibly (e.g. toggling without user interactions) or other unexpected ways. Additionally, this solution expects tooltips to exist in the default tooltip pane.
2. Focus delegation
I don't believe this is a good option, tooltips should NOT receive focus, at least this is true for browsers' native tooltips, and per the ARIA best practices for tooltips:
Additional context
Accessible tooltips using
role="tooltip"
andaria-describedby
: https://zoebijl.github.io/apg-tooltip/.The text was updated successfully, but these errors were encountered: