2008188 - Dialog lacks role (Story topic sections > ••• disclosure > Block dialog)

Status: RESOLVED WORKSFORME

(Firefox :: New Tab Page, defect)

Description

[John Northup]

Steps to Reproduce

Open DevTools. In any Story topic section (e.g., Popular Today), activate the ••• button. Within the resulting disclosure, activate the Block button. Inspect the dialog container.

Expected Behavior

Dialog container is a <dialog> (preferred) or has role="dialog".

Actual Behavior

Dialog is implemented using a generic container without a programmatically determinable dialog role.

User Impact

AT cannot identify the content as a dialog.

WCAG 2.2 References

• WCAG 4.1.2 - Name, Role, Value

Recommendations

Change dialog container to a <dialog> (preferred) or apply role="dialog" to the existing container.

Testing Environment

Any

Assistive Technology Used

Any or None

Code Pointers

<div class="confirmation-dialog">
  <div class="modal-overlay" role="presentation"></div>
  <div class="modal">
    <section class="modal-message">
      <span>
        <p data-l10n-id="newtab-section-confirm-block-topic-p1">Are you sure you want to block this topic?</p>
        <p data-l10n-id="newtab-section-confirm-block-topic-p2">Blocked topics will no longer appear in your feed.</p>
      </span>
    </section>
    <section class="actions">
      <button data-l10n-id="newtab-section-cancel-button">Not now</button>
      <button class="done" data-l10n-id="newtab-section-block-topic-button" data-l10n-args="{&quot;topic&quot;:&quot;Popular Today&quot;}">Block Popular Today</button>
    </section>
  </div>
</div>

Further Reference

• W3C WAI APG: Modal Dialog Example

Comment 1

[John Northup]

Attachment: Block dialog

Comment 2

[Dana Lucaci, Desktop QA]

Reproduced with Firefox 148.0a1 (2025-12-31) on macOS 15 and Windows 10.
Marking this issue as new for engineering input.
Thank you!

Comment 3

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

The issue is resolved by the bug 1997399 in Firefox 149 - the HTML <dialog> container is now used, thus providing role of dialog to the container in the accessibility tree.

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