MapStore2
MapStore2 copied to clipboard
Add localized aria-labels to glyph buttons
Description
MapStore uses a lot of glyph-only buttons with text tooltips. While these tooltips provide
text for the buttons via aria-labeledby
properties, they are only effective when the tooltips
are being rendered (and the id tying them together is often broken).
This PR proposes a change to the tooltip
enhancer, which adds the tooltip text as
aria-label
to the wrapped buttons.
It also refactors some buttons to also use the tooltip
enhancer, and adds localized aria-label
s
to a few glyph buttons without tooltip.
We would be interested in your opinion whether this is a small enough change to accept, or whether it introduces unnecessary complexity. However, this is not a high priority issue.
What kind of change does this PR introduce?
- [x] Feature
Issue
What is the current behavior?
#10158
What is the new behavior?
Most glyph buttons now have a reliably present, localized aria-label
.
Breaking change
Does this PR introduce a breaking change?
- [x] No
Other useful information
- The most important change is the one to the tooltip enhancer (first commit). To achieve localization without needing to modify existing usages, the props of a
Message
component passed astooltip
prop are read out. Maybe this is a little "hacky". - Using the tooltip enhancer (and
ButtonWithTooltip
component) wherever possible seems like a sensible refactoring whether you like thearia-label
change or not. If you do not want to merge this PR, I could do a new one just with this commit.