Fix layout picker accessibility: radio groups not announced by screen readers

[Copilot]

Description

Fixes #143581

The Customize Layout picker's option groups (Side Bar Position, Panel Alignment, Quick Input Position) were not properly structured as radio groups in the accessibility tree. Screen readers announced items as a flat list without group semantics, and checked states were inconsistent across platforms (worked on NVDA, failed on VoiceOver).

Changes

Quick Pick Infrastructure (src/vs/platform/quickinput/common/quickInput.ts):

• Added role?: 'radiogroup' to IQuickPickSeparator to mark group containers
• Added checked?: boolean to IQuickPickItem for radio selection state

Accessibility Provider (src/vs/platform/quickinput/browser/quickInputList.ts):

getRole(element: IQuickPickElement) {
    if (element instanceof QuickPickSeparatorElement && element.separator.role === 'radiogroup') {
        return 'radiogroup';
    }
    if (element instanceof QuickPickItemElement && element.separator?.role === 'radiogroup') {
        return 'radio';
    }
    return element.hasCheckbox ? 'checkbox' : 'option';
}

Layout Actions (src/vs/workbench/browser/actions/layoutActions.ts):

• Marked separators for Side Bar Position, Panel Alignment, and Quick Input Position with role: 'radiogroup'
• Set checked: toggled on items to reflect active state

Screen readers now announce:

• "Primary Side Bar Position, radio group"
• "Left, radio button, checked" (active option)
• "Right, radio button, not checked" (inactive option)

Testing

Added unit test verifying role assignment and checked state handling. Manual screen reader testing required for full validation.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Layout picker isn't accessible</issue_title>
<issue_description>Testing #143581

• use screen reader mode
• run F1 > Customize Layout
• the checked state of Side Bar Position and Panel Alignment aren't read out

</issue_description>

<agent_instructions>Each group (such as "Visibility") should be a radio group from A11Y perspective with single radio option selected</agent_instructions>

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

@sbatten I verified that I am setting the aria label with (Active) for checked elements. It reads with NVDA, if not for macos, I think this is a quick pick bug. @TylerLeonhardt @sbatten are you saying it works with NVDA but not VoiceOver?

cc @isidorn </comment_new>
<comment_new>@sbatten
@TylerLeonhardt that's right</comment_new>
<comment_new>@isidorn
@TylerLeonhardt we should still have the ability internally for quick pick clients to define what roles their elements are.
In this particular case the role should be checkbox and not listitem.</comment_new>
<comment_new>@TylerLeonhardt
@isidorn agreed. This is essentially like the API AccessibilityInformation. I would like to light that up.</comment_new>
<comment_new>@dmitrivMS
It's not just the role of individual items, but they are also not grouped in A11Y tree - it's one global list.
Visually there are separators and labels, but not in the tree.

• Fixes Layout picker isn't accessible #143667

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.