Skip to content

Align chat model picker ARIA semantics with single-selection menu behavior#296620

Merged
meganrogge merged 3 commits intomainfrom
copilot/fix-accessibility-model-picker
Feb 25, 2026
Merged

Align chat model picker ARIA semantics with single-selection menu behavior#296620
meganrogge merged 3 commits intomainfrom
copilot/fix-accessibility-model-picker

Conversation

Copy link
Contributor

Copilot AI commented Feb 20, 2026

The chat model picker exposed checkbox semantics to assistive tech, which is misleading because model selection behaves as a single-choice selection list. This updates the picker to announce radio-style menu semantics while preserving selected-state announcements.

  • Accessibility semantics

    • Switched action item role from menuitemcheckbox to menuitemradio in the model picker accessibility provider.
    • Kept selected-state wiring (isChecked) so the active model remains announced as selected within the menu.
  • Code structure

    • Extracted picker accessibility mapping into getModelPickerAccessibilityProvider() in chatModelPicker.ts.
    • Reused the provider at widget show-time to keep role/state behavior centralized and testable.
  • Coverage

    • Added a focused unit test validating:
      • action items => menuitemradio
      • separators => separator
      • widget role => menu
getRole: (element) => {
	switch (element.kind) {
		case ActionListItemKind.Action: return 'menuitemradio';
		case ActionListItemKind.Separator: return 'separator';
		default: return 'separator';
	}
}
Original prompt

This section details on the original issue you should resolve

<issue_title>Model picker exposes checked checkbox state to screen readers but is not actionable</issue_title>
<issue_description>### Accessibility issue
The model picker exposes a checked/checkbox state to screen readers even though the control is not actionable as a checkbox.

Expected behavior

The model picker should expose a semantic role/state that matches its actual interaction model (for example, menuitemradio or option with selected state), and avoid announcing "checkbox" when users cannot toggle it as a checkbox.

Actual behavior

Screen readers announce checked checkbox semantics that are misleading and not actionable.

Image</issue_description>

Comments on the Issue (you are @copilot in this section)


💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

Co-authored-by: meganrogge <29464607+meganrogge@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix accessibility issue in model picker for screen readers Align chat model picker ARIA semantics with single-selection menu behavior Feb 20, 2026
@meganrogge meganrogge requested a review from sandy081 February 20, 2026 20:27
@meganrogge meganrogge added this to the February 2026 milestone Feb 20, 2026
@meganrogge meganrogge marked this pull request as ready for review February 20, 2026 20:47
Copilot AI review requested due to automatic review settings February 20, 2026 20:47
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Updates the Chat Model Picker’s accessibility semantics so assistive technologies perceive it as a single-selection menu (radio-style) rather than a multi-toggle checkbox list, aligning ARIA roles with actual interaction behavior.

Changes:

  • Switched model item ARIA role from menuitemcheckbox to menuitemradio while keeping checked-state announcements.
  • Extracted the picker accessibility provider into getModelPickerAccessibilityProvider() and reused it at show-time.
  • Added a unit test validating widget/item roles (menu, menuitemradio, separator).

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.

File Description
src/vs/workbench/contrib/chat/browser/widget/input/chatModelPicker.ts Centralizes model picker list accessibility provider and updates action item role to menuitemradio.
src/vs/workbench/contrib/chat/test/browser/widget/input/chatModelPicker.test.ts Adds coverage to ensure the accessibility provider returns the expected widget/item roles.

…cker.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
@meganrogge meganrogge enabled auto-merge (squash) February 20, 2026 20:52
@meganrogge meganrogge merged commit f6d14c5 into main Feb 25, 2026
19 checks passed
@meganrogge meganrogge deleted the copilot/fix-accessibility-model-picker branch February 25, 2026 17:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Model picker exposes checked checkbox state to screen readers but is not actionable

4 participants