Remove screenreader specific behavior of quick pick

ref #176081
microsoft · Apr 4, 2023 · 87d2eee · 87d2eee
1 parent cbf3532
commit 87d2eee
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 11 deletions.
diff --git a/src/vs/platform/quickinput/browser/quickInput.ts b/src/vs/platform/quickinput/browser/quickInput.ts
@@ -1054,10 +1054,6 @@ class QuickPick<T extends IQuickPickItem> extends QuickInput implements IQuickPi
 			this.ui.checkAll.checked = this.ui.list.getAllVisibleChecked();
 			this.ui.visibleCount.setCount(this.ui.list.getVisibleCount());
 			this.ui.count.setCount(this.ui.list.getCheckedCount());
-			// Ensure no item is focused when using a screenreader when items update (#57501 & #166920 & #176848)
-			if (this.ui.isScreenReaderOptimized() && ariaLabel && visibilities.inputBox) {
-				this._itemActivation = ItemActivation.NONE;
-			}
 			switch (this._itemActivation) {
 				case ItemActivation.NONE:
 					this._itemActivation = ItemActivation.FIRST; // only valid once, then unset
@@ -1364,11 +1360,6 @@ export class QuickInputController extends Disposable {
 				}
 			}, 0);
 		}));
-		this._register(list.onDidChangeFocus(() => {
-			if (this.comboboxAccessibility) {
-				this.getUI().inputBox.setAttribute('aria-activedescendant', this.getUI().list.getActiveDescendant() || '');
-			}
-		}));
 
 		const focusTracker = dom.trackFocus(container);
 		this._register(focusTracker);
@@ -1733,12 +1724,14 @@ export class QuickInputController extends Disposable {
 				ui.inputBox.setAttribute('role', 'combobox');
 				ui.inputBox.setAttribute('aria-haspopup', 'true');
 				ui.inputBox.setAttribute('aria-autocomplete', 'list');
-				ui.inputBox.setAttribute('aria-activedescendant', ui.list.getActiveDescendant() || '');
+				ui.inputBox.setAttribute('aria-controls', ui.list.id);
+				ui.inputBox.setAttribute('aria-expanded', 'true');
 			} else {
 				ui.inputBox.removeAttribute('role');
 				ui.inputBox.removeAttribute('aria-haspopup');
 				ui.inputBox.removeAttribute('aria-autocomplete');
-				ui.inputBox.removeAttribute('aria-activedescendant');
+				ui.inputBox.removeAttribute('aria-controls');
+				ui.inputBox.removeAttribute('aria-expanded');
 			}
 		}
 	}

diff --git a/src/vs/platform/quickinput/browser/quickInputList.ts b/src/vs/platform/quickinput/browser/quickInputList.ts
@@ -286,6 +286,7 @@ export class QuickInputList {
 
 	readonly id: string;
 	private container: HTMLElement;
+	private liveElement: HTMLElement;
 	private list: List<ListElement>;
 	private inputElements: Array<QuickPickItem> = [];
 	private elements: ListElement[] = [];
@@ -325,6 +326,10 @@ export class QuickInputList {
 	) {
 		this.id = id;
 		this.container = dom.append(this.parent, $('.quick-input-list'));
+		this.liveElement = dom.append(this.container, $('div', {
+			'aria-live': 'polite',
+			'aria-relevant': 'additions'
+		}));
 
 		const delegate = new ListElementDelegate();
 		const accessibilityProvider = new QuickInputAccessibilityProvider();
@@ -337,6 +342,19 @@ export class QuickInputList {
 		} as IListOptions<ListElement>);
 		this.list.getHTMLElement().id = id;
 		this.disposables.push(this.list);
+		this.disposables.push(this.list.onDidChangeFocus(e => {
+			const item = $('div', {
+				'aria-labelledby': this.getActiveDescendant() ?? ''
+			});
+			if (this.liveElement.hasChildNodes()) {
+				dom.reset(this.liveElement, item);
+			} else {
+				// give NVDA time to register that the newly created live region - ref https://github.com/nvaccess/nvda/issues/8873
+				setTimeout(() => {
+					dom.reset(this.liveElement, item);
+				}, 500);
+			}
+		}));
 		this.disposables.push(this.list.onKeyDown(e => {
 			const event = new StandardKeyboardEvent(e);
 			switch (event.keyCode) {