A11y: Use <button> as default wrapper for popover menu items #152
bettysteger
started this conversation in
Ideas
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Currently, popover menu items in PopoverDesktop are rendered as
<div>elements by default. This requires consumers to opt in to semantic markup by passing wrapperTag: 'button' via PopoverItemRenderParamsMap, which is easy to miss.Why this matters
A
<div>has no implicit role, is not keyboard-focusable by default, and gives screen readers no actionable context. A<button>element gives you all of this for free:role="button"out of the boxProposed change
Change the default wrapperTag for PopoverItemType.Default from 'div' to 'button'. The existing wrapperTag option in PopoverItemRenderParamsMap can remain for consumers who
have a reason to override it.
Current workaround
This works, but it shouldn't be the consumer's responsibility to enable baseline accessibility.
Beta Was this translation helpful? Give feedback.
All reactions