Merge pull request #107339 from jeanp413/fix-107209

Fixes outline: shift + tab needs to be pressed twice for focus to go to title actions

src/vs/workbench/contrib/outline/browser/outlinePane.css

@@ -31,6 +31,9 @@
 	display: none;
 	padding: 10px 22px 0 22px;
 	opacity: 0.5;
+	position: absolute;
+	pointer-events: none;
+	z-index: 1;
 }
 
 .monaco-workbench .outline-pane.message .outline-message {
@@ -40,7 +43,3 @@
 .monaco-workbench .outline-pane.message .outline-progress {
 	display: none;
 }
-
-.monaco-workbench .outline-pane.message .outline-tree {
-	display: none;
-}

src/vs/workbench/contrib/outline/browser/outlinePane.ts

@@ -243,7 +243,6 @@ export class OutlinePane extends ViewPane {
 	private _requestOracle?: RequestOracle;
 	private _domNode!: HTMLElement;
 	private _message!: HTMLDivElement;
-	private _inputContainer!: HTMLDivElement;
 	private _progressBar!: ProgressBar;
 	private _tree!: WorkbenchDataTree<OutlineModel, OutlineItem, FuzzyScore>;
 	private _treeDataSource!: OutlineDataSource;
@@ -288,13 +287,7 @@ export class OutlinePane extends ViewPane {
 
 	focus(): void {
 		if (this._tree) {
-			// focus on tree and fallback to root
-			// dom node when the tree cannot take focus,
-			// e.g. when hidden
 			this._tree.domFocus();
-			if (!this._tree.isDOMFocused()) {
-				this._domNode.focus();
-			}
 		}
 	}
 
@@ -302,12 +295,10 @@ export class OutlinePane extends ViewPane {
 		super.renderBody(container);
 
 		this._domNode = container;
-		this._domNode.tabIndex = 0;
 		container.classList.add('outline-pane');
 
 		let progressContainer = dom.$('.outline-progress');
 		this._message = dom.$('.outline-message');
-		this._inputContainer = dom.$('.outline-input');
 
 		this._progressBar = new ProgressBar(progressContainer);
 		this._register(attachProgressBarStyler(this._progressBar, this._themeService));
@@ -315,7 +306,7 @@ export class OutlinePane extends ViewPane {
 		let treeContainer = dom.$('.outline-tree');
 		dom.append(
 			container,
-			progressContainer, this._message, this._inputContainer, treeContainer
+			progressContainer, this._message, treeContainer
 		);
 
 		this._treeRenderer = this._instantiationService.createInstance(OutlineElementRenderer);
@@ -547,11 +538,6 @@ export class OutlinePane extends ViewPane {
 			this._tree.setInput(newModel, state);
 		}
 
-		// transfer focus from domNode to the tree
-		if (this._domNode === document.activeElement) {
-			this._tree.domFocus();
-		}
-
 		this._editorDisposables.add(toDisposable(() => this._contextKeyFiltered.reset()));
 
 		// feature: reveal outline selection in editor