Steps to reproduce the issue

Audit finding

During Multi-Factor Authentication setup, the generated QR code is rendered as an <img> element without an alt attribute.

Screen-reader users therefore receive no text alternative identifying the image as a QR code.

The report recommends adding at least alt="QR Code".

User impact

Screen-reader users cannot determine that the image is a QR code or understand its purpose in the MFA setup flow.

They may not realise that the QR code can be scanned by an authentication application. This can make it harder to locate and use the code during account setup.

Because the QR code is part of setting up multi-factor authentication, the missing information can create a significant barrier to completing the task independently.

Remediation plan

Provide a text alternative for the MFA setup QR code

• Add a complete, translatable alt attribute to the generated MFA QR-code image
• Ensure the alternative text identifies the image as a QR code
• Ensure the alternative text conveys its purpose in the MFA setup flow, where appropriate
• Avoid embedding the secret key, one-time code, or other sensitive setup data in the alternative text
• Ensure the alternative text remains accurate for all supported MFA methods that display a QR code
• Ensure the text alternative is announced by screen readers
• Apply the pattern consistently in Atum and Cassiopeia
• Ensure the QR code remains functional and does not rely on visual appearance alone
• Do not use an empty alt attribute for this image
• Consider providing an equivalent non-QR-code setup path, such as a copyable secret, where supported

Preconditions

• Use Joomla 6.2 with Atum in the administrator interface and Cassiopeia on the front end
• Use a test account in a test installation where MFA can be configured safely
• Ensure the MFA method being tested displays a QR code during setup
• 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
• Do not use a production account or expose a real secret key in screenshots or logs

Steps to reproduce

1. Open the Joomla front-end or administrator interface
2. Sign in to the test account
3. Open the MFA setup flow
   • In the administrator interface, open the user's profile or Multi-factor Authentication settings
   • Record the navigation labels if they differ in the tested build
4. Choose an MFA method that displays a QR code
5. Locate the QR code in the setup view
6. Inspect the QR-code image using Developer Tools
7. Record whether it is an <img> element
8. Record whether it has an alt attribute and, if present, its value
9. Record the image's computed accessible name and description
10. Move keyboard focus to the QR code if it is focusable
11. Use a screen reader to navigate to the image
12. Record the screen-reader announcement
13. Repeat for the front-end and back-end MFA setup flows
14. Capture the QR-code markup, accessible name, and screen-reader announcement
15. Do not capture or publish the unredacted secret key

Screen-reader verification

1. Use a screen reader with the browser combination being tested
2. Open the MFA setup view containing the QR code
3. Navigate to the QR-code image
4. Record the announced role, name, and description
5. Check whether the announcement identifies the image as a QR code
6. Check whether the announcement conveys its purpose in the MFA setup flow
7. Repeat for the front-end and back-end setup flows
8. Repeat with at least one additional screen reader if available
9. Record the screen-reader name, version, browser, and operating system

Verification after remediation

1. Open the MFA setup view containing the QR code
2. Confirm that the QR-code image has a complete, translatable alt attribute
3. Confirm that the alternative text identifies the image as a QR code
4. Confirm that the alternative text conveys its purpose without exposing sensitive setup data
5. Confirm that screen readers announce the text alternative
6. Repeat for the front-end and back-end MFA setup flows
7. Record the final alt value and screen-reader announcements

Version

6.2

Expected result

The MFA setup QR code has a complete, translatable text alternative that identifies it as a QR code and conveys its purpose.

Screen-reader users can locate and understand the QR code during MFA setup.

Actual result

The MFA setup QR code is rendered as an <img> element without an alt attribute.

No text alternative is provided.

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's suggested alt="QR Code" is a minimum. Use wording that also conveys the QR code's purpose in the MFA setup flow where appropriate.

Do not include the secret key, one-time code, or other sensitive setup data in the alternative text.

This issue concerns the QR code's missing text alternative. It is distinct from #48375, which concerns the verbose accessible names of the MFA method-selection links.

MS7a is proposed for the shared MFA setup QR-code pattern, with MS7b covering the documented Atum and Cassiopeia integrations.