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

Steps to reproduce the issue

Milestone 1a finding ID M1a-036
Backlog priority High
Severity — carried from Milestone 1a Serious
Implementation effort Low
Target milestone(s) MS2b — Core Forms and Validation; MS3b — Backend Template Build
WCAG 2.2 success criterion 1.1.1 Non-text Content; 1.4.3 Contrast (Minimum); 2.5.3 Label in Name; 4.1.2 Name, Role, Value
Responsibility tag(s) from report Development
Affected Joomla area/component MFA Captive View — MFA method-selection link names — Milestone 1a finding #36
Affected user journey(s) 04 — MFA Captive View (FE + BE)

List of MFA methods including Backup Codes, Code by Email, and Passkey

Audit finding

When selecting an MFA method, users are presented with links such as Backup Codes, Code by Email, and Passkey.

Each link contains:

  • The visible method name
  • An image representing the method, with alt text matching the method name
  • Hint text that repeats the method name

Because all three are inside the link, the accessible name repeats. For example, the report identifies “My Passkey Passkey Passkey” and “Code by Email Code by Email Code by Email”.

The report recommends making the image alt text empty and removing the duplicated hint text, so the link name is announced once.

User impact

Screen-reader users hear the same method name repeated multiple times when navigating normally or using a links list.

The repeated wording makes the MFA method list harder to scan and can be disorienting, particularly during sign-in when users need to choose a method quickly.

The verbose accessible names also make the links list less useful for navigation.

Remediation plan

Provide one concise accessible name for each MFA method link

  • Ensure each MFA method link has one concise, meaningful accessible name
  • Set the method image alt attribute to an empty string when the adjacent visible text already identifies the method
  • Remove hint text that duplicates the method name from the link's accessible name
  • Preserve any genuinely additional hint text outside the accessible name only if it provides new information
  • Ensure the visible method name remains the accessible name
  • Ensure the accessible name contains the visible label text
  • Apply the pattern consistently across front-end and back-end MFA method selection
  • Ensure the change works for all installed MFA methods, including third-party methods where applicable
  • Do not remove information needed to distinguish methods
  • Verify the accessible name in normal reading mode and links-list mode

Preconditions

  • Use Joomla 6.2 with Atum in the administrator interface and Cassiopeia on the front end
  • Create or use a test account with at least two MFA methods configured
  • Use a test installation where the MFA captive view can be reached without affecting a production account
  • Record the exact Joomla build, browser name and version, operating system, viewport dimensions, and browser zoom
  • Record the screen reader and browser combination if testing announcements
  • Start at 100% browser zoom
  • Record the active appearance and any template overrides or custom CSS
  • Record the configured MFA methods before testing

Steps to reproduce

  1. Open the Joomla front-end or administrator sign-in flow for the test account
  2. Complete the initial sign-in step
  3. Open the MFA captive view that asks the user to select an MFA method
  4. Inspect each method link using Developer Tools
  5. Record the visible method name, image alt attribute, and any hint text
  6. Record the link's computed accessible name
  7. Check whether the method name is repeated in the accessible name
  8. Move keyboard focus to each link
  9. Record the screen-reader announcement
  10. Open the screen reader's links list
  11. Record the names shown for the MFA method links
  12. Repeat for both the front-end and back-end MFA flows
  13. Capture the method list, link accessible names, and screen-reader announcements

Screen-reader verification

  1. Use a screen reader with the browser combination being tested
  2. Navigate through the MFA method links
  3. Record the announced accessible name for each link
  4. Check whether the method name is repeated
  5. Open the links list and record the link names
  6. Confirm that each method can still be distinguished
  7. Repeat with at least one additional screen reader if available
  8. Record the screen-reader name, version, browser, and operating system

Verification after remediation

  1. Open the MFA method-selection view
  2. Confirm that each method link has one concise accessible name
  3. Confirm that the image alt attribute is empty when the visible text identifies the method
  4. Confirm that duplicated hint text no longer contributes to the accessible name
  5. Confirm that the accessible name contains the visible method label
  6. Confirm that each method remains distinguishable
  7. Repeat for the front-end and back-end MFA flows
  8. Record the final accessible names and screen-reader announcements

Version

6.2

Expected result

Each MFA method link has a concise accessible name that identifies the method once.

The method image does not duplicate the visible method name, and duplicated hint text does not contribute to the accessible name.

Screen-reader users can scan and distinguish the available MFA methods in normal reading mode and links-list mode.

Actual result

The MFA method links repeat the method name in their accessible names.

The image alt text and hint text duplicate the visible method name inside each link.

For example, the report identifies accessible names such as “My Passkey Passkey Passkey” and “Code by Email Code by Email Code by Email”.

The current Joomla 6.2 build needs to be checked to establish whether the issue persists and which MFA methods are affected.

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?

VoiceOver, JAWS, NVDA

Additional Comments

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

Development is the responsibility tag in the original report.

The report also notes that the helper text did not meet contrast requirements. Because the recommended fix removes that duplicated text, this issue focuses on the accessible name; contrast should be checked separately if equivalent helper text is retained.

This issue concerns the accessible names of MFA method-selection links. It is distinct from #48373, which concerns the missing alternative text for the MFA setup QR code.

MS2b is proposed for the shared MFA method-selection component, with MS3b covering the documented Atum and Cassiopeia integrations.

avatar mbeganyi-a11y mbeganyi-a11y - open - 4 Sep 2026
avatar joomla-cms-bot joomla-cms-bot - change - 4 Sep 2026
Labels Added: No Code Attached Yet a11y
avatar joomla-cms-bot joomla-cms-bot - labeled - 4 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 4 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 4 Sep 2026
avatar brianteeman
brianteeman - comment - 4 Sep 2026

Where does that screen exist - its not what I am seeing

avatar mbeganyi-a11y mbeganyi-a11y - change - 7 Sep 2026
Labels Added: a11y-priority-serious (High)
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar rdeutz rdeutz - change - 7 Sep 2026
Labels Added: a11y-audit-backlog
avatar rdeutz rdeutz - labeled - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 7 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 7 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 7 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 7 Sep 2026
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
…
Very verbose link names when selecting a MFA method
MFA setup: Very verbose link names when selecting a MFA method
avatar mbeganyi-a11y mbeganyi-a11y - edited - 9 Sep 2026
avatar mbeganyi-a11y
mbeganyi-a11y - comment - 11 Sep 2026

Where does that screen exist - its not what I am seeing

Apologies for not being more specific. It's in the "User: Edit Profile" screen within the "Multi-factor Authentication" tab.

However, the audit report screenshot of the issue seems to show a different screen than what I see, so perhaps the issue belongs to the initial MFA setup during a new user creation process and not the editing of existing preferences for existing users. Are those screens different depending if the user exists or not, and is the code different?

When I tested with a screen reader in the Edit Profile section, the output was correct. However, the report indicates that the output should be as follows:

These links contain the link name (Passkey, Code by Email, …) an image that represents that method, and a hint text that is the same text as the actual link name. As the images have alt attributes and all three elements are part of the link, the Passkey link’s accessible name is “My Passkey Passkey Passkey” while the “Code by Email” link’s accessible name is “Code by Email Code by Email Code by Email”.

...which makes me believe that the audit report specifies the creation of a new user account.

avatar brianteeman
brianteeman - comment - 11 Sep 2026

Sorry I have no idea which is why I asked

avatar mbeganyi-a11y
mbeganyi-a11y - comment - 11 Sep 2026

Me either. If we can mimic a new user creation process we'll be able to test the MFA setup in mobile view and determine if that's where the issue is, because it's definitely not in the backend setting sections of an existing user account.

avatar mbeganyi-a11y mbeganyi-a11y - change - 23 Oct 2026
Labels Added: a11y-ms1b-quickwins
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 23 Oct 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 26 Oct 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 26 Oct 2026
avatar drmenzelit drmenzelit - change - 5 Nov 2026
Status New ⇒ Closed
Closed_Date 0000-00-00 00:00:00 ⇒ 2026-11-05 22:54:14
Closed_By ⇒ drmenzelit
avatar drmenzelit drmenzelit - close - 5 Nov 2026

Add a Comment

Login with GitHub to post a comment