[waiting for fluentui-blazor release] Screen reader does not announce expanded/collapsed state for “View options” button:A11y_Aspire Dashboard_Resources

[kapilvaishna]

Please do not close this bug. This bug should only be closed by TCS, C+AI Accessibility tester after bug verification.

Leveraging SWE Agent can help accelerate this accessibility bug fix; review and validate all AI generated changes before merge.

Try ES Chat to learn more about the MAS rule and how to fix the issue. If you need more help, use our Teams channel or office hours.

"Check out Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier."

GitHub Tags

#A11yTCS; #A11yMAS; #A11ySev2; #DesktopWeb; #Win11; #Chrome; #ChromiumnEdge; #Aspire; #E2E_AspireDashboard_Web_May2026; #WCAG4.1.2; #STP; #ScreenReader; #Narrator; #NVDA; #FTP; #copilot:agent=a11yagent; #ES Chat; #Closed; #A11yFixed;

Issue Subcategory

State not programmatically exposed

User Experience

Screen reader users cannot determine the current state of a control (expanded, checked, selected, pressed). They see a toggle but cannot tell whether it is on or off.

Repro Steps

Turn on Screen reader such as NVDA/Narrator > Install Aspire CLI > Clone the Aspire repository https://github.com/microsoft/aspire/tree/main/playground/TestShop > From the console output, copy or open the Dashboard URL > View Options button > Observe issue: Screen reader does not announce expanded/collapsed state for “View options” button.

Actual Result

NVDA/Narrator announces the control as “View option menu button submenu”. However, when activating the button using the Enter key, NVDA/Narrator does not announce whether the menu is expanded or collapsed.

Expected Result

The button should programmatically convey its state, and NVDA should announce the expanded/collapsed state (e.g., “expanded” or “collapsed”) when the menu is toggled.

How to Fix

Add appropriate ARIA state attributes: aria-expanded="true|false", aria-checked="true|false", aria-pressed="true|false", aria-selected="true|false". Update values dynamically via JavaScript when state changes.

issue repro throughout the application where button expand/collapse the popup.

Environment details

Application Name: Aspire Dashboard
Edition Windows 11 Enterprise
Version 25H2
OS build 26200.8390
ChromiumEdge: Version 150.0.4041.0 (Official build) dev (64-bit)
Chrome: Version 148.0.7778.179 (Official Build) (64-bit)
Narrator: win11
NVDA: 2025.3.3

Attachment

17466_NVDA.mp4

Similar issue attachment

17466_Similar.issue.mp4

Recording.5-26.at.12.17.1.webm

[joperezr]

🤖 Aspire triage pass — 2026-05-25 09:41 UTC

Area: area-dashboard
Kind: bug (accessibility)
Repro: yes-minimal — see "Repro Steps" section of issue body
Affected version(s): Aspire Dashboard (latest release line)
Severity: S2 — screen reader users cannot determine expanded/collapsed state of the View options / Remove Data / Settings buttons (WCAG 4.1.2). Affects core a11y compliance for assistive-tech users; no client-side workaround.

Urgency: 🟡 vNext — recommend milestone 13.4
Reason: A11y conformance bug in shipping dashboard UI; clean repro and a clear fix (add aria-expanded and related ARIA state attributes). Not a regression vs 13.2 (no baseline cited), so does not meet the servicing bar, but should land in the next minor.

Suggested owner(s): James Newton-King (@JamesNK) (score 99), backup Adam Ratzman (@adamint) (score 8)
Evidence:

• James Newton-King (@JamesNK) authored 32 merged PRs labeled area-dashboard in the last 90 days
• Adam Ratzman (@adamint) authored 2 merged PRs labeled area-dashboard in the last 90 days
• .github/CODEOWNERS lists @JamesNK @adamint for src/Aspire.Dashboard

Confidence: medium
Needs human?: no — but recommend a11y-aware reviewer to confirm the proposed ARIA fix applies to all three buttons (View options, Remove Data, Settings).

Dry-run mode — no labels or milestone applied. Reply /triage apply to promote, or edit and reapply.

[adamint]

I uploaded the repro/fix evidence artifacts here: https://github.com/adamint/aspire/tree/a11y-artifacts-20260601042635/17466

Key files:

• Before screenshot: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/view-options-before.png
• Before video: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/before.webm
• After screenshot: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/view-options-open-after.png
• After video: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/after.webm
• After DOM/a11y state: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/view-options-after.json

Draft fix PR: #17774

[adamint]

Correction: I replaced the earlier videos with annotated evidence that visibly shows the relevant accessibility state on-screen.

Updated artifact folder: https://github.com/adamint/aspire/tree/a11y-artifacts-20260601042635/17466

Most useful files:

• Annotated before video: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/annotated-before.webm
• Annotated after video: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/annotated-after.webm
• Before state JSON: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/17466-before-fix.json
• After state JSON: https://raw.githubusercontent.com/adamint/aspire/a11y-artifacts-20260601042635/17466/17466-after-fix.json

The annotated before capture shows aria-expanded is absent/empty. The annotated after capture shows aria-expanded=\"false\" when closed and aria-expanded=\"true\" when open, with the accessibility snapshot reporting [expanded].

[kapilvaishna]

Adam Ratzman (@adamint) Issue is still reproducing.

Recording.7-01.at.13.40.3.webm

[kapilvaishna]

Adam Ratzman (@adamint) Issue is still reproducing for table column header, all other issue not repro

Recording.7-09.at.16.08.2.webm