No Code Attached Yet a11y a11y-audit-backlog a11y-priority-serious (High) a11y-ms1b-quickwins Design-System
avatar mbeganyi-a11y
mbeganyi-a11y
7 Sep 2026

Steps to reproduce the issue

Milestone 1a finding ID M1a-008
Backlog priority High
Severity — carried from Milestone 1a Serious
Implementation effort Medium
Target milestone(s) MS2b — Complex Components; MS3a — Frontend Template Build; MS3b — Backend Template Build
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 Development
Affected Joomla area/component Dashboard checkout information, article-list tooltips, MFA default indicator, and frontend editing tooltips — Milestone 1a finding #8
Affected user journey(s) 01 — Backend Template (Atum); 05 — MFA Setup — Method / Methods Views; 08 — Backend List View Pattern; 10 — Frontend User Forms

Popular Articles dashboard module showing a lock icon and a tooltip containing the article's checkout information

Audit finding

Additional information presented through tooltips is not consistently available through keyboard interaction, cannot always remain open while the pointer moves onto it, or cannot be dismissed without moving focus or the pointer.

The report identifies these cases

  • Popular Articles dashboard module — checkout information is attached to a lock indicator whose audited implementation is not keyboard focusable and does not expose suitable control semantics
  • Articles list — the tooltip cannot be hovered or dismissed without moving the pointer or focus
  • MFA Passkeys list — the “Default” tooltip on the star indicator has hover/focus interaction barriers
  • Frontend editing controls — tooltips are unavailable in small viewports and cannot be dismissed without moving keyboard focus

The failures need to be checked separately because the affected views may not use identical markup or tooltip handling.

User impact

Keyboard users may be unable to discover the checkout information shown to pointer users. That information helps explain why an article is locked and who has it checked out.

People using magnification may need to move the pointer onto the tooltip to read it. If the tooltip disappears during that movement, they cannot reliably inspect the information.

A tooltip that covers other content and cannot be dismissed while focus remains on its trigger forces users to abandon their current position to clear the obstruction.

Screen reader users may also miss the information when the trigger lacks suitable semantics or the tooltip text is not programmatically associated with it.

In frontend editing, losing the tooltip at a narrow viewport can remove useful context about which item the edit action affects.

Remediation plan

Fix the specific integrations and provide a consistent way to reveal, read, and dismiss the additional information

  • Identify whether each failure originates in shared tooltip behaviour or in the markup supplied by an individual module or view
  • Prefer persistent text or an inline disclosure when the information is important and a tooltip adds unnecessary interaction complexity
  • If retaining tooltips, make their information available through keyboard focus as well as pointer hover
  • Use a suitable focusable element for the trigger
    • Use a native button when the element performs an explicit disclosure or other action
    • Preserve an existing link or button's primary action rather than replacing it with an unrelated tooltip action
  • Give the trigger a useful accessible name and associate supplementary tooltip text appropriately, such as through aria-describedby
  • Do not rely on aria-labelledby attached to a generic non-interactive container as the complete accessibility implementation
  • Allow users to move the pointer from the trigger onto the tooltip without making it disappear
  • Keep the content available while the trigger or tooltip remains hovered, or while the trigger remains focused, unless the user dismisses it or the information becomes invalid
  • Provide dismissal without requiring the user to move focus or the pointer, such as Escape where appropriate
  • Do not require keyboard focus to move into a non-interactive tooltip merely to read its text
  • If the popup contains interactive content, use an appropriate disclosure or popup pattern rather than treating it as a simple tooltip
  • At narrow viewports, preserve the information or provide an equivalent accessible presentation
  • Verify each affected view after any shared change instead of assuming that one repaired instance resolves every case

Preconditions

  • Use Joomla 6.2
  • Use Atum for administrator testing and Cassiopeia for frontend testing
  • Record the exact build, browser name and version, operating system, viewport dimensions, and any screen reader used
  • Use a test installation for checkout and MFA setup
  • Ensure that the Popular Articles dashboard module is displayed and contains a checked-out test article
  • Use a separate test account or session to maintain the checkout state without modifying a production article
  • For MFA testing, use an account with a configured passkey and a visible default indicator
  • For frontend testing, use an account permitted to edit the displayed content
  • Do not include MFA secrets, authentication codes, or unrelated personal information in evidence

Steps to reproduce — dashboard checkout tooltip

  1. Open the Joomla administrator interface at the site's base URL followed by /administrator/
  2. Open the Home Dashboard
  3. Locate the Popular Articles module and the checked-out test article
    • If the module or lock indicator is absent, establish the required test setup before continuing
  4. Hover over the lock indicator
  5. Record the tooltip text and the information it provides
  6. Move the pointer from the indicator onto the tooltip
  7. Record whether the tooltip remains visible
  8. Keep the pointer in place and attempt to dismiss the tooltip using the available dismissal method
    • Test Escape and record whether it works
  9. Move the pointer away and use Tab or Shift+Tab to reach the same indicator
  10. Record whether it receives keyboard focus and reveals the same information
  11. If it is reachable, attempt dismissal without moving focus
  12. Inspect the trigger's element type, role, accessible name, and relationship to the tooltip
  13. Record the module and markup tested
    • Do not assume that a different checkout indicator elsewhere uses the same implementation

Steps to reproduce — Articles list tooltip

  1. Open Content → Articles
  2. Locate the checked-out test article and its lock or checkout-information trigger
  3. Reveal the tooltip with the pointer
  4. Move the pointer onto the tooltip and check whether it remains visible
  5. Attempt to dismiss it without moving the pointer
  6. Navigate to the trigger with the keyboard
  7. Check whether focus reveals the information
  8. Attempt to dismiss it without moving keyboard focus
  9. Record keyboard access, hover persistence, and dismissal as separate results

Steps to reproduce — MFA Default tooltip

  1. Open the test account's MFA management page through the available account settings
  2. Open the configured Passkeys list
  3. Locate the star or other indicator identifying the default passkey
  4. Hover over it and record the “Default” tooltip
  5. Repeat the pointer-movement and dismissal checks
  6. Check whether the same information is available through keyboard navigation or another accessible presentation
  7. Record the exact trigger and whether it has an independent action
  8. Do not change the default authentication method or remove a passkey during the test

Steps to reproduce — frontend editing tooltips

  1. Open the site's frontend and sign in with the permitted test account
  2. Locate an available edit control associated with an article or module
  3. Record the page URL, item title, and edit control tested
  4. At a wide viewport, reveal its tooltip using hover and keyboard focus
  5. Record the information provided
  6. Attempt dismissal while keeping focus on the edit control
  7. Reduce the viewport width to 320 CSS pixels
    • Record the viewport height and browser zoom
  8. Repeat the hover and keyboard checks
  9. If the tooltip is suppressed, check whether equivalent information remains available through the control's name or nearby text
  10. Record any information lost in the narrow layout
  11. Do not activate an edit or checkout action merely to test tooltip dismissal

Supplementary screen reader verification

  1. Enable a screen reader and record the screen reader and browser combination
  2. Navigate to each available trigger
  3. Record its announced name, role, and supplementary information
  4. Compare that information with the tooltip shown to pointer users
  5. Check whether dismissal preserves a useful focus location
  6. Record results separately for each module or view

Version

6.2

Expected result

Tooltip information is available through keyboard interaction and is programmatically associated with an appropriate trigger.

Where hover/focus content is retained, users can move the pointer onto it, keep it available long enough to read, and dismiss it without being forced to move focus or the pointer, subject to the applicable criterion's exceptions.

Narrow layouts do not remove information without an equivalent accessible presentation.

Actual result

The audit reports keyboard-access and semantic problems with the dashboard checkout indicator, hover and dismissal failures in the Articles list and MFA default indicator, and missing or non-dismissible tooltips on frontend editing controls.

The individual failures and their implementation sources need to be verified separately in Joomla 6.2.

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

The browser entries above are carried forward from the original issue and do not represent a new verification of every browser against Joomla 6.2.

The supplementary screen reader checks are proposed verification, not a claim that a screen reader was used in the original test.

The issue discussion disputes a universal tooltip-component diagnosis and identifies incorrect tooltip placement in a particular module as a possible cause. Verify the affected module markup before applying a global change.

The original report's affected-sample list identifies MFA Setup as journey 05. A subsection labels that example “06 – MFA Setup”, but journey 06 is Media Manager; this draft follows the affected-sample list.

Development is the responsibility tag in the original report.

MS2b is proposed only for shared tooltip-component work that investigation establishes is necessary. MS3a and MS3b cover the documented frontend and backend integrations.

avatar mbeganyi-a11y mbeganyi-a11y - open - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 7 Sep 2026
Labels Added: a11y a11y-audit-backlog a11y-priority-serious (High)
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar joomla-cms-bot joomla-cms-bot - change - 7 Sep 2026
Labels Added: No Code Attached Yet
avatar joomla-cms-bot joomla-cms-bot - labeled - 7 Sep 2026
avatar brianteeman
brianteeman - comment - 7 Sep 2026

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 >.

cannot confirm

keyviz_RhhZVi0S14.mp4
avatar brianteeman
brianteeman - comment - 7 Sep 2026

The problem is not the tooltip

The problem is that in a specific module the code for the tooltip is in the wrong place

avatar mbeganyi-a11y mbeganyi-a11y - change - 8 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 8 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 9 Sep 2026
Title
…
Tooltip is inaccessible
Atum / Cassiopeia / MFA setup: Tooltip is inaccessible
avatar mbeganyi-a11y mbeganyi-a11y - edited - 9 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 9 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 9 Sep 2026
avatar mbeganyi-a11y
mbeganyi-a11y - comment - 11 Sep 2026

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?

avatar mbeganyi-a11y mbeganyi-a11y - change - 26 Oct 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 26 Oct 2026
avatar brianteeman
brianteeman - comment - 3 Nov 2026

please test #48760

avatar rdeutz rdeutz - change - 4 Nov 2026
Labels Added: Design-System
avatar rdeutz rdeutz - labeled - 4 Nov 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 5 Nov 2026
Labels Added: a11y-ms1b-quickwins
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 5 Nov 2026

Add a Comment

Login with GitHub to post a comment