core icon indicating copy to clipboard operation
core copied to clipboard

ARIA role "tab" not allowed for label element

Open juthilo opened this issue 1 year ago • 3 comments

In the tab component, the label element gets the attribute role="tab".

According to the HTML spec (see label entry in table in linked section), no roles are allowed for the native label element, because it has "strong native semantics" and its role should not be overridden.

This gets flagged by our accessibility checker unless we explicitly disable the rule.

I saw that similar code was still included in db-ui/mono, so I hope we can find a solution for the current and future component that is fully compliant.

juthilo avatar Apr 22 '24 09:04 juthilo

@juthilo, thanks a lot for your feedback.

I'm not totally happy with this pattern either, even though that the tradeoff is in between this and JavaScript reliance. So as we would be searching for another solution, I'd like to even also involve a11y feedback. Out of curiosity, which accessibility checker solution are you using (I could've even also reproduced problems being reported by lighthouse)?

mfranzke avatar Apr 23 '24 05:04 mfranzke

@mfranzke We're using the AXE plugin for Cypress and checking inbetween our Cypress test steps to cover all opened dialogs etc.

juthilo avatar Apr 23 '24 06:04 juthilo

I've just set up an issue within the other repository: https://github.com/db-ui/mono/issues/2567

mfranzke avatar Apr 23 '24 06:04 mfranzke