1900023 - Using keyboard to navigating through the settings button and its submenu are inconsistent on MacOS

Status: VERIFIED FIXED

(Firefox :: Translations, defect, P3)

Description

[Daniel Bodea [:danibodea]]

Note

• On MacOS, if the user uses keyboard navigation to activate the Settings button, he will need to use the SPACE key explicitly, however, to activate on of its submenu buttons, he needs to use the ENTER key explicitly. This flow is quite confusing since the user has to know to use SPACE, and then ENTER.
• The underlying problem seems to be the fact that if the user taps SPACE after opening the settings submenu, then the Settings button appears to activate again instead of the selected submenu option. This underlying issue is present on all operating systems, but it is worse on MacOS because no panel origin buttons can be activated using ENTER key, only SPACE key.

Found in

• Nightly v128.0a1

Affected versions

• Nightly v128.0a1

Tested platforms

• Affected platforms: MacOS 11
• Unaffected platforms: Windows10, Ubuntu22

Steps to reproduce

1. Load a webpage that is displayed in a different language than the browser's (and supported by the feature).
2. Open the context menu on a selection of text or a translatable link.
3. Select the Translate option.
4. Use keyboard navigation (TAB key) to focus the Settings button (cog icon).
5. Press SPACE to activate button.
6. Choose a submenu option (Up/Down arrow keys).
7. Press SPACE to activate option.

Expected result

• The submenu option is activated and the user is redirected correctly.

Actual result

• The Settings (cog) button displays the animation of being pressed and nothing happens.

Regression range

• not a regression.

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The severity field for this bug is set to S4. However, the accessibility severity is higher, .
:nordzilla, could you consider increasing the severity?

For more information, please visit BugBot documentation.

Comment 2

[Erik Nordin [:nordzilla]]

Attachment: Bug 1900023 - Fix SelectTranslationsPanel keyboard navigation on macOS r=#translations-reviewers!,ohall

This patch ensures that every button in the SelectTranslationsPanel
can be invoked both with the Enter key or the space bar on all
operating systems.

Comment 3

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/65f814530374
Fix SelectTranslationsPanel keyboard navigation on macOS r=ohall,translations-reviewers

Comment 4

[Sandor Molnar[:smolnar]]

https://hg.mozilla.org/mozilla-central/rev/65f814530374

Comment 5

[Erik Nordin [:nordzilla]]

Attachment: Bug 1900023 - Fix SelectTranslationsPanel keyboard navigation on macOS

This patch ensures that every button in the SelectTranslationsPanel
can be invoked both with the Enter key or the space bar on all
operating systems.

Original Revision: https://phabricator.services.mozilla.com/D213635

Comment 6

[Erik Nordin [:nordzilla]]

Attachment: Bug 1900023 - Fix SelectTranslationsPanel keyboard navigation on macOS

This patch ensures that every button in the SelectTranslationsPanel
can be invoked both with the Enter key or the space bar on all
operating systems.

Original Revision: https://phabricator.services.mozilla.com/D213635

Comment 7

[Phabricator Automation]

beta Uplift Approval Request

• User impact if declined: This patch stack fixes keyboard navigation in the Select Translations Panel on macOS, ensuring that we provide a uniform keyboard navigation experience across all platforms.
• Code covered by automated testing: yes
• Fix verified in Nightly: yes
• Needs manual QE test: no
• Steps to reproduce for manual QE testing: QA will already be verifying all of this in the beta test process for Select Translations
• Risk associated with taking this patch: Low Risk
• Explanation of risk level: These changes only affect the Select Translations Panel functionality on macOS. There are, unfortunately, still some intermittent test failures associated with the new tests that I added in this stack, which I am still trying to eliminate, but I think that this patch would be worth uplifting regardless.
• String changes made/needed: None
• Is Android affected?: no

Comment 8

[Daniel Bodea [:danibodea]]

I can confirm that the settings button can be enabled with the ENTER key, along with the Copy, Translate full page and Done buttons. The drop-down buttons continue to be accessed using the down arrow key. It has been tested on MacOS11 in Nightly v129.0a1.

Comment 9

[Pulsebot]

https://hg.mozilla.org/releases/mozilla-beta/rev/51b3ccb52a7b

Comment 10

[Daniel Bodea [:danibodea]]

I can confirm that the ENTER key can be used to activate all panel buttons across all operating systems. Tested in Windows10, MacOS11, Ubuntu22 in Beta v128.0b5.