2.1.1/2.1.3 Keyboard-usage for hoverable additional content on disabled buttons

[Sommerli2]

We are currently debating about deactivated interactive elements, such as buttons and input fields, where no visible labeling should be used (icon buttons).

Active, interactive elements can be focused and hovered. A tooltip (conform to 1.4.13) is displayed as a label.

Disabled interactive elements cannot be focused anymore, but can be hovered. We are currently showing the tooltip, it is accessible to screenreaders (linear reading) but not for keyboard-only-users.

Here an example: https://public-ui.github.io/sample-react/#/button/basic?theme=zoll-v3

What do you say?

[JAWS-test]

Transmit the button information?

• No: Then the tooltip does not matter, but then the buttons could be removed.
• Yes: Then the tooltip is relevant and there is a WCAG violation that the tooltip cannot be shown with keyboard. And then the contrast of the buttons is not sufficient...

[deleonio]

❓

Are disabled interactive elements without a visible label, such as buttons, links, and inputs, allowed to have tooltips?

[patrickhlauke]

if they're there, then there must be a way for a keyboard-only/non-mouse user to get the same info...

[deleonio]

This is a good point. Disabled interactive elements cannot be focused.

What's now?

We don't know - what is right?

• Kein Tooltip bei _disabled="true" public-ui/kolibri#5390
• https://public-ui.github.io/sample-react/#/button/basic

[patrickhlauke]

What's now?

Now you evaluate ... is the information shown in the tooltip important for somebody to know/perceive even if the control is disabled? If yes, it fails keyboard-related SCs - and authors need to think about how to bridge that particular gap (e.g. making the button/control not actually disabled, still keyboard-focusable, but using aria-disabled="true" and extra JS to suppress functionality.

If not, it's arguably ancilliary, and a keyboard user is not disadvantaged for not getting the tooltip. suggest then as best practice to suppress the unnecessary tooltip for mouse/pointer users too ... if it's not important for keyboard users, then there's no point for those users to get it too

[deleonio]

Issue-Ticket: public-ui/kolibri#5975
Code-Draft: https://stackblitz.com/edit/web-platform-qqbiaj?file=index.html

@Sommerli2, @patrickhlauke What do you think?!