fix accessibility issues with action list, specifically Other Models action list (#305270)

This commit is contained in:
Megan Rogge
2026-03-26 17:22:51 -04:00
committed by GitHub
parent 5a3846c8ce
commit 4cdcd4f345
2 changed files with 19 additions and 6 deletions

View File

@@ -252,6 +252,14 @@ class ActionItemRenderer<T> implements IListRenderer<IActionListItem<T>, IAction
dom.setVisibility(!element.hideIcon, data.icon);
// Set aria-expanded for section toggle items
if (element.isSectionToggle) {
const expanded = element.group?.icon === Codicon.chevronDown;
data.container.setAttribute('aria-expanded', String(expanded));
} else {
data.container.removeAttribute('aria-expanded');
}
// Apply optional className - clean up previous to avoid stale classes
// from virtualized row reuse
if (data.previousClassName) {
@@ -1109,8 +1117,12 @@ export class ActionListWidget<T> extends Disposable {
}
const element = e.elements[0];
if (element.isSectionToggle) {
if (element.isSectionToggle && element.section) {
this._list.setSelection([]);
const section = element.section;
queueMicrotask(() => {
this._toggleSection(section);
});
return;
}
// Don't select when clicking the toolbar or submenu indicator
@@ -1444,11 +1456,6 @@ export class ActionListWidget<T> extends Disposable {
}
private onListClick(e: IListMouseEvent<IActionListItem<T>>): void {
if (e.element && e.element.isSectionToggle && e.element.section) {
const section = e.element.section;
queueMicrotask(() => this._toggleSection(section));
return;
}
if (e.element && this.focusCondition(e.element)) {
this._list.setFocus([]);
}

View File

@@ -447,9 +447,15 @@ export function buildModelPickerItems(
export function getModelPickerAccessibilityProvider() {
return {
isChecked(element: IActionListItem<IActionWidgetDropdownAction>) {
if (element.isSectionToggle) {
return undefined;
}
return element.kind === ActionListItemKind.Action ? !!element?.item?.checked : undefined;
},
getRole: (element: IActionListItem<IActionWidgetDropdownAction>) => {
if (element.isSectionToggle) {
return 'menuitem';
}
switch (element.kind) {
case ActionListItemKind.Action: return 'menuitemradio';
case ActionListItemKind.Separator: return 'separator';