2008117 - Button accessible name does not convey its function and is misleading (Settings dialog > Topics dialog > Close button)

Status: NEW

(Firefox :: New Tab Page, defect)

Description

[John Northup]

Attachment: Close button containing "< Topics"

Steps to Reproduce

Open DevTools. Activate the Customize button. Within the Settings dialog, activate the Manage topics button. The Topics dialog opens. Using the Accessibility Inspector, inspect the button that contains the Topics heading.

Expected Behavior

name describes the function of the button.

Actual Behavior

name represents the dialog content ( Topics ), omitting the function of the button (to close the dialog).

User Impact

The function of the button (close the dialog) is not exposed to AT. The < icon (chrome://global/skin/icons/arrow-left.svg) gives a visual clue that activating the button will go back, but this is not exposed to AT users.

WCAG 2.2 References

• WCAG 2.4.6 - Headings and Labels

Recommendations

Remove the Topics heading from the button, leaving the < icon to visually represent the button, with aria-label="back to settings" and an accessible tooltip expressing the same.

Testing Environment

Any

Assistive Technology Used

Any

Code Pointers

<button class="arrow-button">
  <h1 data-l10n-id="newtab-section-mangage-topics-title">Topics</h1>
</button>

Further Reference

• Deque: Tooltip Example

Comment 1

[Oana Botisan, Desktop QA]

Managed to reproduce this issue on macOs 13 using Nightly 149.0a1. I will set this request as "NEW" to allow the engineering team to consider whether they will implement the fix or not.

Comment 2

[❌ Anna Yeddi [:ayeddi] ❌ On leave until 2027-01-04]

Using the current page's title as a label for the "Back" button is misleading, thus assigning it access-S2 severity

Comment 3

[❌ Anna Yeddi [:ayeddi] ❌ On leave until 2027-01-04]

When this bug would address the structure of the "< Topics" button, the 2 (now closed) bugs should be re-evaluated to ensure the change in the content of the dialog is being communicated to assistive technology users appropriately:

1. bug 2008179 (communicating accessible name of the container/dialog)
2. bug 2008186 (ensuring the change in a type of container, if any, is communicated)

Comment 4

[❌ Anna Yeddi [:ayeddi] ❌ On leave until 2027-01-04]

Assigning the Severity value to align with the Accessibility severity, per discussions with :thecount and :marco

Comment 5

[❌ Anna Yeddi [:ayeddi] ❌ On leave until 2027-01-04]

Assigning the Severity value to align with the Accessibility severity, per discussions with :thecount and :marco