1761842 - "Download Firefox Focus" link button isn't keyboard accessible on MacOS or Windows

Status: VERIFIED FIXED

(Firefox :: Messaging System, defect, P1)

Description

[Emily McMinn :emcminn]

Currently, tabbing through elements on the Private Browsing landing page skips the "Download Firefox Focus" button; jumping from the "close" button of the focus promo to the "learn more" info section link.

The button accessible on Mac when VoiceOver is active; but can't be found via the keyboard on Windows even though it is read out by NVDA. Adding tabindex="0" to the <a> element of the button should fix this.

Comment 1

[Emily McMinn :emcminn]

Attachment: Bug 1761842 - Replace promo CTA link with a button for better a11y

Comment 2

[Emily McMinn :emcminn]

Opted to fix this by changing the <a> element to a <button>. Since the control now opens the modal instead of linking out to another page, this makes sense semantically and also fixes the a11y issue.

Comment 3

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/3cac71e18571
Replace promo CTA link with a button for better a11y r=mviar

Comment 4

[Atila Butkovits]

https://hg.mozilla.org/mozilla-central/rev/3cac71e18571

Comment 5

[Emily McMinn :emcminn]

Comment on attachment 9270282 [details]
Bug 1761842 - Replace promo CTA link with a button for better a11y

Beta/Release Uplift Approval Request

• User impact if declined: A primary CTA on about:privatebrowsing will be inaccessible to users navigating with a keyboard.
• Is this code covered by automated tests?: Yes
• Has the fix been verified in Nightly?: Yes
• Needs manual test from QE?: No
• If yes, steps to reproduce:
• List of other uplifts needed: None
• Risk to taking this patch: Low
• Why is the change risky/not risky? (and alternatives if risky): Semantic change of an <a> element to a <button>. Overall function remains the same, no visual changes.
• String changes made/needed: none

Comment 6

[Simona Rosu [:srosu], Ecosystem QA]

I‘ve verified this issue using the latest Firefox Nightly 101.0a1 (Build ID: 20220405212313) on Windows 10 x64, and macOS 11.6.

• The “Download Firefox Focus” button from the Firefox Focus promo can be accessed using keyboard navigation.

Comment 7

[Dianna Smith [:diannaS]]

Comment on attachment 9270282 [details]
Bug 1761842 - Replace promo CTA link with a button for better a11y

Approved for 100.0b3

Comment 8

[Dianna Smith [:diannaS]]

https://hg.mozilla.org/releases/mozilla-beta/rev/a00cf865cd34

Comment 9

[Marius Coman [:mcoman], Ecosystem QA]

This issue was part of the work done on QA-1420 for which we sent a Preliminary checkpoint. Considering this I am marking it as Verified.