Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[a11y]: tooltip's behaviour fails WCAG in two ways #16152

Closed
2 tasks done
mbgower opened this issue Apr 9, 2024 · 1 comment · Fixed by #16476
Closed
2 tasks done

[a11y]: tooltip's behaviour fails WCAG in two ways #16152

mbgower opened this issue Apr 9, 2024 · 1 comment · Fixed by #16476
Assignees
@guidari
Labels
role: dev 🤖 severity: 2 User cannot complete task, and/or no workaround type: a11y ♿ type: bug 🐛

Comments

@mbgower
Copy link

mbgower commented Apr 9, 2024

Package

@carbon/react

Browser

Chrome

Operating System

MacOS

Package version

@1.54.0

React version

https://react.carbondesignsystem.com/?path=/story/components-tooltip--default

Automated testing tool and ruleset

n/a

Assistive technology

n/a

Description

There are two issues with the current tooltip behaviour:

  1. It should be dismissible with Esc, even if activated by hover
  2. If I move the pointer over top of the exposed tooltip, it should not go away.

These are described in https://www.w3.org/WAI/WCAG21/Understanding/content-on-hover-or-focus.html as the Dismissible and Hoverable requirements.

WCAG 2.1 Violation

Content on Hover or Focus (Level AA)

Reproduction/example

https://react.carbondesignsystem.com/?path=/story/components-tooltip--default

Steps to reproduce

  1. Got to https://react.carbondesignsystem.com/?path=/story/components-tooltip--default
  2. Hover over the i icon
  3. Press Esc. Nothing happens. Expected behaviour is the tooltip should disappear.
  4. With the tooltip still visible, move the pointer so it is over top of the tooltip. It disappears. Expected behaviour is the tooltip should remain visible so long at the pointer is over either the target of the tooltip (so that a low vision user can move their magnification to it and read the tip)

Code of Conduct
@tay1orjones
Copy link
Member

It should be dismissible with Esc, even if activated by hover

Yeah I don't recall this being part of the spec for Tooltip's updates for v11, this should be pretty easy to add.

If I move the pointer over top of the exposed tooltip, it should not go away.

This is a regression, it used to work this way, here's an example from v11.25.0. I just grabbed that deploy preview at random from the list of release PRs. We could probably track down exactly what version it stopped working to get an sense of why/how this regression was introduced and how to fix it.

@tay1orjones tay1orjones added severity: 2 User cannot complete task, and/or no workaround type: bug 🐛 role: dev 🤖 and removed status: needs triage 🕵️‍♀️ labels Apr 10, 2024
@guidari guidari self-assigned this May 8, 2024
@guidari guidari mentioned this issue May 15, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@guidari guidari

Labels
role: dev 🤖 severity: 2 User cannot complete task, and/or no workaround type: a11y ♿ type: bug 🐛
Projects
Design System
Status: ✅ Done
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Tooltip fixes on hover and ESC guidari/carbon
3 participants
@tay1orjones @mbgower @guidari