[#48409] - Atum / Cassiopeia / MFA setup: Tooltip is inaccessible
- New
- Medium
- Build: 5.4-dev
- # 48409
Steps to reproduce the issue
NOTE: Accessibility backlog issue and work-in-progress. This issue has been opened to account for all the issues flagged in the initial Milestone 1a Audit Report. If this is a duplicate issue, it will be closed by the end of September 2026.
| Milestone 1a finding ID | M1a-008 |
|---|---|
| Backlog priority | High |
| Severity — carried from Milestone 1a | Serious |
| Implementation effort | Medium |
| Target milestone(s) | MS2a, MS2b, MS3a, MS3b, MS5a, MS7b, MS8a, MS10 |
| WCAG 2.2 success criterion | 1.4.13 Content on Hover or Focus; 2.1.1 Keyboard; 4.1.2 Name, Role, Value |
| Responsibility tag(s) from report | Design, Development |
| Affected Joomla area/component | https://accessibility-project.joomla.org/results/Milestone-1a/milestone1/deliverable1/wcag-report#715f3939-b761-4ca5-8eba-6f71b2bc5c3f |
| Affected user journey(s) | 01 – Backend Template (Atum); 05 – MFA Setup - Method / Methods Views; 08 – Backend List View Pattern; 10 – Frontend User Forms |
| Source report/reference | Milestone 1a WCAG audit report |
| STF reporting reference | To be assigned |
| Issue owner | To be assigned |
| Status | Triage |
Audit finding
Tooltip is inaccessible
User impact
The issue creates an accessibility barrier in that users will not be able to fully access information.
Remediation plan
Refactor the interaction so it is fully keyboard operable and appropriate focus and hover behavior is maintained.
Steps to reproduce (Atum "Articles" example)
- Open the Atum backend template and find the Popular Articles content section.
- Hover over the lock icon trigger and move toward the tooltip.
- Attempt to move into, dismiss, and read the tooltip using a mouse.
- Observe that it is unavailable, obscures content, or is not exposed correctly.
- Notice that focus cannot move to the same trigger with the keyboard.
Version
6.1
Expected result
Tooltip is reachable by mouse without tooltip disappearing. Keyboard interaction can dismiss the tooltip.
Actual result
The implemented tooltip has several problems and requirements:
- It cannot be operated using the keyboard. This means that keyboard users are unable to see the content of the tooltip at all. The tooltip invoker (the lock icon in this case) needs to be keyboard focusable. Current, a element is used, which is not focusable. Use either a , or tabindex="0" on the < div >.
- The invoker points at the tooltip for an accessible name using the aria-labelledby attribute. This is generally OK, but as the is a generic element and thus cannot have an accessible name, either use a element, or add a role="button".
- Ensure that the tooltip stays open when the user hovers over the tooltip and moves the focus away from the invoker.
- Allow the user to close the tooltip using the invoker button.
What device were you using? (eg, phone, laptop)
Desktop web
What web browser were you using? (eg, Chrome, Safari)
Chrome, Firefox, Edge, Safari
Assistive Technology?
N/A
Additional Comments
No response
| Labels |
Added:
a11y
a11y-audit-backlog
a11y-priority-serious (High)
|
||
joomla-cms-bot
- | Labels |
Added:
No Code Attached Yet
|
||
The problem is not the tooltip
The problem is that in a specific module the code for the tooltip is in the wrong place
| Title |
|
||||||
Ah OK that's good to know. That should be a simpler fix then. I've seen tooltips in other parts of the interface. Are they also similarly dependent on modules?
cannot confirm
keyviz_RhhZVi0S14.mp4