Down arrow moves focus to extensions list (#53616)

* Down arrow focuses list view.

* Scoping

* Generalize focusFirstIfNothingFocused logic to all list views

* Revert "Generalize focusFirstIfNothingFocused logic to all list views"

This reverts commit 2bdfeef828c9b427c0897769ec45f315e19bbb65.

* Generalize to list in debug view

* Add to dispasables

* Same for scmViewlet

* Default 'list.inactiveFocusBackground' to null

* Migrate from `onDidFocus` to `onDidChange` where possible

* Remove changes for non-extensions

* Undo changed to color registry

* Move focus next position

src/vs/platform/theme/common/colorRegistry.ts

@@ -197,7 +197,7 @@ export const listActiveSelectionBackground = registerColor('list.activeSelection
 export const listActiveSelectionForeground = registerColor('list.activeSelectionForeground', { dark: Color.white, light: Color.white, hc: null }, nls.localize('listActiveSelectionForeground', "List/Tree foreground color for the selected item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not."));
 export const listInactiveSelectionBackground = registerColor('list.inactiveSelectionBackground', { dark: '#3F3F46', light: '#CCCEDB', hc: null }, nls.localize('listInactiveSelectionBackground', "List/Tree background color for the selected item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not."));
 export const listInactiveSelectionForeground = registerColor('list.inactiveSelectionForeground', { dark: null, light: null, hc: null }, nls.localize('listInactiveSelectionForeground', "List/Tree foreground color for the selected item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not."));
-export const listInactiveFocusBackground = registerColor('list.inactiveFocusBackground', { dark: '#313135', light: '#d8dae6', hc: null }, nls.localize('listInactiveSelectionBackground', "List/Tree background color for the selected item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not."));
+export const listInactiveFocusBackground = registerColor('list.inactiveFocusBackground', { dark: '#313135', light: '#d8dae6', hc: null }, nls.localize('listInactiveFocusBackground', "List/Tree background color for the focused item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not."));
 export const listHoverBackground = registerColor('list.hoverBackground', { dark: '#2A2D2E', light: '#F0F0F0', hc: null }, nls.localize('listHoverBackground', "List/Tree background when hovering over items using the mouse."));
 export const listHoverForeground = registerColor('list.hoverForeground', { dark: null, light: null, hc: null }, nls.localize('listHoverForeground', "List/Tree foreground when hovering over items using the mouse."));
 export const listDropBackground = registerColor('list.dropBackground', { dark: listFocusBackground, light: listFocusBackground, hc: null }, nls.localize('listDropBackground', "List/Tree drag and drop background when moving items around using the mouse."));

src/vs/workbench/parts/extensions/electron-browser/extensionsViewlet.ts

@@ -320,6 +320,7 @@ export class ExtensionsViewlet extends ViewContainerViewlet implements IExtensio
 
 		const onKeyDownForList = onKeyDown.filter(() => this.count() > 0);
 		onKeyDownForList.filter(e => e.keyCode === KeyCode.Enter).on(this.onEnter, this, this.disposables);
+		onKeyDownForList.filter(e => e.keyCode === KeyCode.DownArrow).on(this.focusListView, this, this.disposables);
 
 		const onSearchInput = domEvent(this.searchBox, 'input') as EventOf<SearchInputEvent>;
 		onSearchInput(e => this.triggerSearch(e.immediate), null, this.disposables);
@@ -476,6 +477,10 @@ export class ExtensionsViewlet extends ViewContainerViewlet implements IExtensio
 		(<ExtensionsListView>this.panels[0]).select();
 	}
 
+	private focusListView(): void {
+		this.panels[0].focus();
+	}
+
 	private onViewletOpen(viewlet: IViewlet): void {
 		if (!viewlet || viewlet.getId() === VIEWLET_ID) {
 			return;

src/vs/workbench/parts/extensions/electron-browser/extensionsViews.ts

@@ -640,6 +640,14 @@ export class ExtensionsListView extends ViewletPanel {
 	static isKeymapsRecommendedExtensionsQuery(query: string): boolean {
 		return /@recommended:keymaps/i.test(query);
 	}
+
+	focus(): void {
+		super.focus();
+		if (!(this.list.getFocus().length || this.list.getSelection().length)) {
+			this.list.focusNext();
+		}
+		this.list.domFocus();
+	}
 }
 
 export class InstalledExtensionsView extends ExtensionsListView {