1958294 - The Dismiss dropdown button from the Review Checker Callout 3 has a vague accessible name

Status: RESOLVED FIXED

(Firefox :: Messaging System, defect, P3)

Description

[Anna Yeddi [:ayeddi]]

Attachment: the dropdown button is called "Menu pop-up"

Found in

• Nightly 138.0a1 (2025-04-03)

Affected versions

• Nightly 138.0a1 (2025-04-03)

Preconditions
Enable a screen reader.
Enable the Review Checker inside the Firefox Sidebar.

Steps to reproduce

1. Trigger the RC Callout 3
2. Use a screen reader to reach the Dismiss dropdown button.
3. Observe the screen reader announcement.

Expected result

• The Dropdown button should clearly communicate it's purpose and its relation to the "Dismiss" control, i.e. "More options - Dismiss" or "Dismiss, menu", or similar. Using aria-labelledby to refer to the ids of both the "Dismiss" button and the dropdown button itself (space-separated) would provide an acceptable, informative accessible name. Refer to WAI ARIA Menu button pattern for more examples and information on expected attributes and behaviors

Actual result

• The Dropdown button is announced as Menu pop-up button that is vague and not clear which menu is it?

Comment 1

[Meg Viar [:mviar]]

aminomancer to triage

Comment 2

[Shane Hughes [:aminomancer]]

Using aria-labelledby to refer to the ids of both the "Dismiss" button and the dropdown button itself (space-separated) would provide an acceptable, informative accessible name.

So which element should have aria-labelledby? Do you mean the button?

I think it's unusual for a menu in Firefox to be announced with ARIA labels or descriptions. menupopups don't tend to carry any ARIA attributes or strings in themselves, as far as I know. I think it's the underlying button that needs to provide more information, and then for the menu items to be accessible.

This messaging surface is dynamic, with not every submenu being related to dismissing. So it doesn't always follow the pattern of providing "More options" for whatever type of button it's attached to. That might be a good default, but I suppose the safest bet is no default at all, and let the message define its own aria label. This could be something for Emily to play around with, maybe aria-labelledby is a good alternative for when the message defines no label. That would fix the issue for all existing messages without requiring us to relaunch anything.

Otherwise, adding an aria-label is already possible, but we're just not using it because the button doesn't have any string data associated with it. But the MSLocalized component does let you set an aria-label even if you don't set a text label, so I think we could start adding an aria-label at any time.

We should give these submenu buttons a title as well, like we do for the dismiss_button. MSLocalized is missing the ability to add that without a fluent string, but we could add it. This is another reason to generally set a custom aria label for each button. You can dynamically set an aria-label by putting two id's in aria-labelledby, but you can't do the same with the tooltip. That string has to be given by the message. So we don't really have a good default there. Maybe More options is a safe default though.

Comment 3

[Emily McMinn :emcminn]

Attachment: Bug 1958294 - Add aria-label && aria-labelledby options to submenu buttons

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/cbc322557e05
Add aria-label && aria-labelledby options to submenu buttons r=omc-reviewers,fluent-reviewers,bolsson,mviar

Comment 5

[Norisz Fay [:noriszfay]]

https://hg.mozilla.org/mozilla-central/rev/cbc322557e05

Comment 6

[Rares Doghi, Desktop QA]

This issue is verified as fixed in our latest Nightly 139.0a1 (2025-04-13)

Comment 7

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

The patch landed in nightly and beta is affected.
:emcminn, is this bug important enough to require an uplift?

• If yes, please nominate the patch for beta approval.
• If no, please set status-firefox138 to wontfix.

For more information, please visit BugBot documentation.