Skip to content

[do not review] Add Manage Data selection accessible names#17784

Closed
adamint wants to merge 1 commit into
microsoft:mainfrom
adamint:adamint/a11y-17467
Closed

[do not review] Add Manage Data selection accessible names#17784
adamint wants to merge 1 commit into
microsoft:mainfrom
adamint:adamint/a11y-17467

Conversation

@adamint
Copy link
Copy Markdown
Member

@adamint adamint commented Jun 1, 2026

Description

Fixes #17467

The Manage logs and telemetry dialog selection buttons now expose meaningful accessible names. Previously several icon-only selection buttons had no useful accessible name, so screen reader users could not tell which selection control they were operating.

The labels now describe the action and target:

Deselect all
Deselect apigateway
Deselect Console logs for apigateway

This stays scoped to accessible names only; checkbox role/state semantics are left for the separate role issue.

User-facing usage

Screen reader users can distinguish the Manage Data selection controls, including duplicate data types across different resources. Annotated evidence captures the before state with missing nested labels and the after state with action-oriented labels that include the parent resource.

Checklist

  • Is this feature complete?
    • Yes. Ready to ship.
    • No. Follow-up changes expected.
  • Are you including unit tests for the changes and scenario tests if relevant?
    • Yes
    • No
  • Did you add public API?
    • Yes
      • If yes, did you have an API Review for it?
        • Yes
        • No
      • Did you add <remarks /> and <code /> elements on your triple slash comments?
        • Yes
        • No
    • No
  • Does the change make any security assumptions or guarantees?
    • Yes
      • If yes, have you done a threat model and had a security review?
        • Yes
        • No
    • No

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Jun 1, 2026

🚀 Dogfood this PR with:

⚠️ WARNING: Do not do this without first carefully reviewing the code of this PR to satisfy yourself it is safe.

curl -fsSL https://raw.githubusercontent.com/microsoft/aspire/main/eng/scripts/get-aspire-cli-pr.sh | bash -s -- 17784

Or

  • Run remotely in PowerShell:
iex "& { $(irm https://raw.githubusercontent.com/microsoft/aspire/main/eng/scripts/get-aspire-cli-pr.ps1) } 17784"

@adamint
Copy link
Copy Markdown
Member Author

adamint commented Jun 1, 2026

Uploaded annotated evidence artifacts here: https://github.com/adamint/aspire/tree/a11y-artifacts-20260601042635/17467

Most useful files:

The before capture shows nested selection buttons with missing/non-action names. The after capture shows action-oriented labels such as Deselect all and Deselect Console logs for apigateway.

Draft fix PR: #17784

@adamint
Copy link
Copy Markdown
Member Author

adamint commented Jun 2, 2026

I verified this in a real browser with Playwright against main and this PR. Repro host was the dashboard mock app with TestResource plus TestResource child, then Settings > Manage data.

Steps: open Settings, click Manage, and inspect the selection controls in the Manage data dialog. On main, the selection controls did not expose the expected accessible names. On this PR, the names are present for all/top-level resource selections.

Proof:

{"pr":"17784","phase":"base","names":[]}
{"pr":"17784","phase":"pr","names":["Deselect all","Deselect TestResource","Deselect TestResource child"]}

@adamint
Copy link
Copy Markdown
Member Author

adamint commented Jun 2, 2026

Adding the visual proof too; the earlier verification comment had the browser details but the proof was too JSON-heavy.

I used Chromium against seeded dashboard mock host with TestResource / TestResource child. Steps: opened Settings > Manage data, inspected the visible selection controls, and captured their accessible names.

main / before: No nested resource expander was rendered; captured the visible selection controls. Accessible names found: Close, Tooltip, Export selected, Remove selected, Import logs and telemetry

this PR / after: No nested resource expander was rendered; captured the visible selection controls. Accessible names found: Close, Tooltip, Deselect all, Export selected, Remove selected, Import logs and telemetry

MP4 proof, not webm, with visible keyboard/mouse/focus trace overlay: https://raw.githubusercontent.com/adamint/aspire/cd33e79ec249a7354240cc851b921502ada33d1a/proof/a11y/17784/pr-17784-visual-proof.mp4

Contact sheet with the before/after screenshots: https://raw.githubusercontent.com/adamint/aspire/cd33e79ec249a7354240cc851b921502ada33d1a/proof/a11y/17784/pr-17784-contact-sheet.png

before/after accessibility proof for PR #17784

@adamint adamint changed the title Add Manage Data selection accessible names [do not review] Add Manage Data selection accessible names Jun 2, 2026
@adamint
Copy link
Copy Markdown
Member Author

adamint commented Jun 4, 2026

Condensed into #17928 to keep the Manage Data selection a11y changes together. Closing this smaller draft.

@adamint adamint closed this Jun 4, 2026
@microsoft-github-policy-service microsoft-github-policy-service Bot added this to the 13.5 milestone Jun 4, 2026
@adamint adamint self-assigned this Jun 4, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Accessible name is missing for “Console logs” checkbox:A11y_Aspire Dashboard_Settting_Manage logs_Devtools

1 participant