aux window - reduce global access to document object

src/vs/base/browser/dnd.ts

@@ -3,7 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import { addDisposableListener } from 'vs/base/browser/dom';
+import { addDisposableListener, getWindow } from 'vs/base/browser/dom';
 import { Disposable } from 'vs/base/common/lifecycle';
 import { Mimes } from 'vs/base/common/mime';
 
@@ -95,11 +95,12 @@ export function applyDragImage(event: DragEvent, label: string | null, clazz: st
 	}
 
 	if (event.dataTransfer) {
-		document.body.appendChild(dragImage);
+		const ownerDocument = getWindow(event).document;
+		ownerDocument.body.appendChild(dragImage);
 		event.dataTransfer.setDragImage(dragImage, -10, -10);
 
 		// Removes the element when the DND operation is done
-		setTimeout(() => document.body.removeChild(dragImage), 0);
+		setTimeout(() => ownerDocument.body.removeChild(dragImage), 0);
 	}
 }
 

src/vs/base/browser/touch.ts

@@ -6,6 +6,7 @@
 import * as DomUtils from 'vs/base/browser/dom';
 import * as arrays from 'vs/base/common/arrays';
 import { memoize } from 'vs/base/common/decorators';
+import { Event as EventUtils } from 'vs/base/common/event';
 import { Disposable, IDisposable, markAsSingleton, toDisposable } from 'vs/base/common/lifecycle';
 import { LinkedList } from 'vs/base/common/linkedList';
 
@@ -89,9 +90,12 @@ export class Gesture extends Disposable {
 		this.activeTouches = {};
 		this.handle = null;
 		this._lastSetTapCountTime = 0;
-		this._register(DomUtils.addDisposableListener(document, 'touchstart', (e: TouchEvent) => this.onTouchStart(e), { passive: false }));
-		this._register(DomUtils.addDisposableListener(document, 'touchend', (e: TouchEvent) => this.onTouchEnd(e)));
-		this._register(DomUtils.addDisposableListener(document, 'touchmove', (e: TouchEvent) => this.onTouchMove(e), { passive: false }));
+
+		this._register(EventUtils.runAndSubscribe(DomUtils.onDidRegisterWindow, ({ window, disposableStore }) => {
+			disposableStore.add(DomUtils.addDisposableListener(window.document, 'touchstart', (e: TouchEvent) => this.onTouchStart(e), { passive: false }));
+			disposableStore.add(DomUtils.addDisposableListener(window.document, 'touchend', (e: TouchEvent) => this.onTouchEnd(e)));
+			disposableStore.add(DomUtils.addDisposableListener(window.document, 'touchmove', (e: TouchEvent) => this.onTouchMove(e), { passive: false }));
+		}, { window, disposableStore: this._store }));
 	}
 
 	public static addTarget(element: HTMLElement): IDisposable {

src/vs/base/browser/ui/dialog/dialog.ts

@@ -473,7 +473,7 @@ export class Dialog extends Disposable {
 			this.modalElement = undefined;
 		}
 
-		if (this.focusToReturn && isAncestor(this.focusToReturn, getWindow(this.container).document.body)) {
+		if (this.focusToReturn && isAncestor(this.focusToReturn, this.container.ownerDocument.body)) {
 			this.focusToReturn.focus();
 			this.focusToReturn = undefined;
 		}

src/vs/base/browser/ui/inputbox/inputBox.ts

@@ -166,9 +166,9 @@ export class InputBox extends Widget {
 			// from ScrollableElement to DOM
 			this._register(this.scrollableElement.onScroll(e => this.input.scrollTop = e.scrollTop));
 
-			const onSelectionChange = this._register(new DomEmitter(document, 'selectionchange'));
+			const onSelectionChange = this._register(new DomEmitter(container.ownerDocument, 'selectionchange'));
 			const onAnchoredSelectionChange = Event.filter(onSelectionChange.event, () => {
-				const selection = document.getSelection();
+				const selection = container.ownerDocument.getSelection();
 				return selection?.anchorNode === wrapper;
 			});
 

src/vs/base/browser/ui/list/listView.ts

@@ -1131,7 +1131,7 @@ export class ListView<T> implements IListView<T> {
 				while (e && !e.classList.contains('monaco-workbench')) {
 					e = e.parentElement;
 				}
-				return e || document.body;
+				return e || this.domNode.ownerDocument;
 			};
 
 			const container = getDragImageContainer(this.domNode);

src/vs/base/browser/ui/sash/sash.ts

@@ -516,7 +516,7 @@ export class Sash extends Disposable {
 			return;
 		}
 
-		const iframes = document.getElementsByTagName('iframe');
+		const iframes = this.el.ownerDocument.getElementsByTagName('iframe');
 		for (const iframe of iframes) {
 			iframe.classList.add(PointerEventsDisabledCssClass); // disable mouse events on iframes as long as we drag the sash
 		}

src/vs/base/browser/ui/splitview/paneview.ts

@@ -372,9 +372,9 @@ class PaneDraggable extends Disposable {
 			e.dataTransfer?.setData(DataTransfers.TEXT, this.pane.draggableElement.textContent || '');
 		}
 
-		const dragImage = append(document.body, $('.monaco-drag-image', {}, this.pane.draggableElement.textContent || ''));
+		const dragImage = append(this.pane.element.ownerDocument.body, $('.monaco-drag-image', {}, this.pane.draggableElement.textContent || ''));
 		e.dataTransfer.setDragImage(dragImage, -10, -10);
-		setTimeout(() => document.body.removeChild(dragImage), 0);
+		setTimeout(() => this.pane.element.ownerDocument.body.removeChild(dragImage), 0);
 
 		this.context.draggable = this;
 	}

src/vs/base/browser/ui/splitview/splitview.ts

@@ -887,8 +887,8 @@ export class SplitView<TLayoutContext = undefined, TView extends IView<TLayoutCo
 
 		// This way, we can press Alt while we resize a sash, macOS style!
 		const disposable = combinedDisposable(
-			addDisposableListener(document.body, 'keydown', e => resetSashDragState(this.sashDragState!.current, e.altKey)),
-			addDisposableListener(document.body, 'keyup', () => resetSashDragState(this.sashDragState!.current, false))
+			addDisposableListener(this.el.ownerDocument.body, 'keydown', e => resetSashDragState(this.sashDragState!.current, e.altKey)),
+			addDisposableListener(this.el.ownerDocument.body, 'keyup', () => resetSashDragState(this.sashDragState!.current, false))
 		);
 
 		const resetSashDragState = (start: number, alt: boolean) => {

src/vs/platform/actionWidget/browser/actionList.ts

@@ -248,7 +248,7 @@ export class ActionList<T> extends Disposable {
 
 		// For finding width dynamically (not using resize observer)
 		const itemWidths: number[] = this._allMenuItems.map((_, index): number => {
-			const element = document.getElementById(this._list.getElementID(index));
+			const element = this.domNode.ownerDocument.getElementById(this._list.getElementID(index));
 			if (element) {
 				element.style.width = 'auto';
 				const width = element.getBoundingClientRect().width;
@@ -262,7 +262,7 @@ export class ActionList<T> extends Disposable {
 		const width = Math.max(...itemWidths, minWidth);
 
 		const maxVhPrecentage = 0.7;
-		const height = Math.min(heightWithHeaders, document.body.clientHeight * maxVhPrecentage);
+		const height = Math.min(heightWithHeaders, this.domNode.ownerDocument.body.clientHeight * maxVhPrecentage);
 		this._list.layout(height, width);
 
 		this.domNode.style.height = `${height}px`;

src/vs/workbench/browser/actions/developerActions.ts

@@ -11,7 +11,7 @@ import { DomEmitter } from 'vs/base/browser/event';
 import { Color } from 'vs/base/common/color';
 import { Event } from 'vs/base/common/event';
 import { IDisposable, toDisposable, dispose, DisposableStore, setDisposableTracker, DisposableTracker, DisposableInfo } from 'vs/base/common/lifecycle';
-import { getDomNodePagePosition, createStyleSheet, createCSSRule, append, $ } from 'vs/base/browser/dom';
+import { getDomNodePagePosition, createStyleSheet, createCSSRule, append, $, getActiveDocument } from 'vs/base/browser/dom';
 import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
 import { ContextKeyExpr, IContextKeyService, RawContextKey } from 'vs/platform/contextkey/common/contextkey';
 import { Context } from 'vs/platform/contextkey/browser/contextKeyService';
@@ -63,15 +63,16 @@ class InspectContextKeysAction extends Action2 {
 		createCSSRule('*', 'cursor: crosshair !important;', stylesheet);
 
 		const hoverFeedback = document.createElement('div');
-		document.body.appendChild(hoverFeedback);
-		disposables.add(toDisposable(() => document.body.removeChild(hoverFeedback)));
+		const activeDocument = getActiveDocument();
+		activeDocument.body.appendChild(hoverFeedback);
+		disposables.add(toDisposable(() => activeDocument.body.removeChild(hoverFeedback)));
 
 		hoverFeedback.style.position = 'absolute';
 		hoverFeedback.style.pointerEvents = 'none';
 		hoverFeedback.style.backgroundColor = 'rgba(255, 0, 0, 0.5)';
 		hoverFeedback.style.zIndex = '1000';
 
-		const onMouseMove = disposables.add(new DomEmitter(document.body, 'mousemove', true));
+		const onMouseMove = disposables.add(new DomEmitter(activeDocument, 'mousemove', true));
 		disposables.add(onMouseMove.event(e => {
 			const target = e.target as HTMLElement;
 			const position = getDomNodePagePosition(target);
@@ -82,10 +83,10 @@ class InspectContextKeysAction extends Action2 {
 			hoverFeedback.style.height = `${position.height}px`;
 		}));
 
-		const onMouseDown = disposables.add(new DomEmitter(document.body, 'mousedown', true));
+		const onMouseDown = disposables.add(new DomEmitter(activeDocument, 'mousedown', true));
 		Event.once(onMouseDown.event)(e => { e.preventDefault(); e.stopPropagation(); }, null, disposables);
 
-		const onMouseUp = disposables.add(new DomEmitter(document.body, 'mouseup', true));
+		const onMouseUp = disposables.add(new DomEmitter(activeDocument, 'mouseup', true));
 		Event.once(onMouseUp.event)(e => {
 			e.preventDefault();
 			e.stopPropagation();

src/vs/workbench/browser/parts/editor/editorActions.ts

@@ -34,6 +34,7 @@ import { KeybindingWeight } from 'vs/platform/keybinding/common/keybindingsRegis
 import { ILogService } from 'vs/platform/log/common/log';
 import { Categories } from 'vs/platform/action/common/actionCommonCategories';
 import { ActiveEditorAvailableEditorIdsContext, ActiveEditorContext, ActiveEditorGroupEmptyContext } from 'vs/workbench/common/contextkeys';
+import { getActiveDocument } from 'vs/base/browser/dom';
 
 class ExecuteCommandAction extends Action2 {
 
@@ -2276,7 +2277,8 @@ abstract class AbstractCreateEditorGroupAction extends Action2 {
 		// of an editor having keyboard focus in an inactive editor group
 		// (see https://github.com/microsoft/vscode/issues/189256)
 
-		const focusNewGroup = layoutService.hasFocus(Parts.EDITOR_PART) || document.activeElement === document.body;
+		const activeDocument = getActiveDocument();
+		const focusNewGroup = layoutService.hasFocus(Parts.EDITOR_PART) || activeDocument.activeElement === activeDocument.body;
 
 		const group = editorGroupService.addGroup(editorGroupService.activeGroup, this.direction);
 		editorGroupService.activateGroup(group);

src/vs/workbench/browser/parts/editor/editorGroupView.ts

@@ -1449,9 +1449,8 @@ export class EditorGroupView extends Themable implements IEditorGroupView {
 	}
 
 	private shouldRestoreFocus(target: Element): boolean {
-		const activeElement = document.activeElement;
-
-		if (activeElement === document.body) {
+		const activeElement = target.ownerDocument.activeElement;
+		if (activeElement === target.ownerDocument.body) {
 			return true; // always restore focus if nothing is focused currently
 		}
 

src/vs/workbench/browser/parts/editor/editorPanes.ts

@@ -296,9 +296,8 @@ export class EditorPanes extends Disposable {
 			return true; // restore focus if nothing was focused
 		}
 
-		const activeElement = document.activeElement;
-
-		if (!activeElement || activeElement === document.body) {
+		const activeElement = expectedActiveElement.ownerDocument.activeElement;
+		if (!activeElement || activeElement === expectedActiveElement.ownerDocument.body) {
 			return true; // restore focus if nothing is focused currently
 		}
 

src/vs/workbench/browser/parts/editor/editorPart.ts

@@ -495,9 +495,8 @@ export class EditorPart extends Part implements IEditorPart {
 			return false;
 		}
 
-		const activeElement = document.activeElement;
-
-		if (activeElement === document.body) {
+		const activeElement = target.ownerDocument.activeElement;
+		if (activeElement === target.ownerDocument.body) {
 			return true; // always restore focus if nothing is focused currently
 		}
 

src/vs/workbench/contrib/debug/browser/debugEditorContribution.ts

@@ -316,11 +316,12 @@ export class DebugEditorContribution implements IDebugEditorContribution {
 
 	private applyHoverConfiguration(model: ITextModel, stackFrame: IStackFrame | undefined): void {
 		if (stackFrame && this.uriIdentityService.extUri.isEqual(model.uri, stackFrame.source.uri)) {
+			const ownerDocument = this.editor.getContainerDomNode().ownerDocument;
 			if (this.altListener) {
 				this.altListener.dispose();
 			}
 			// When the alt key is pressed show regular editor hover and hide the debug hover #84561
-			this.altListener = addDisposableListener(document, 'keydown', keydownEvent => {
+			this.altListener = addDisposableListener(ownerDocument, 'keydown', keydownEvent => {
 				const standardKeyboardEvent = new StandardKeyboardEvent(keydownEvent);
 				if (standardKeyboardEvent.keyCode === KeyCode.Alt) {
 					this.altPressed = true;
@@ -332,7 +333,7 @@ export class DebugEditorContribution implements IDebugEditorContribution {
 						this.showEditorHover(this.hoverPosition, false);
 					}
 
-					const onKeyUp = new DomEmitter(document, 'keyup');
+					const onKeyUp = new DomEmitter(ownerDocument, 'keyup');
 					const listener = Event.any<KeyboardEvent | boolean>(this.hostService.onDidChangeFocus, onKeyUp.event)(keyupEvent => {
 						let standardKeyboardEvent = undefined;
 						if (isKeyboardEvent(keyupEvent)) {

src/vs/workbench/contrib/notebook/browser/view/cellParts/cellDnd.ts

@@ -75,8 +75,8 @@ export class CellDragAndDropController extends Disposable {
 
 		this.listInsertionIndicator = DOM.append(notebookListContainer, $('.cell-list-insertion-indicator'));
 
-		this._register(DOM.addDisposableListener(document.body, DOM.EventType.DRAG_START, this.onGlobalDragStart.bind(this), true));
-		this._register(DOM.addDisposableListener(document.body, DOM.EventType.DRAG_END, this.onGlobalDragEnd.bind(this), true));
+		this._register(DOM.addDisposableListener(notebookListContainer.ownerDocument.body, DOM.EventType.DRAG_START, this.onGlobalDragStart.bind(this), true));
+		this._register(DOM.addDisposableListener(notebookListContainer.ownerDocument.body, DOM.EventType.DRAG_END, this.onGlobalDragEnd.bind(this), true));
 
 		const addCellDragListener = (eventType: string, handler: (e: CellDragEvent) => void, useCapture = false) => {
 			this._register(DOM.addDisposableListener(

src/vs/workbench/contrib/notebook/browser/view/cellParts/codeCell.ts

@@ -191,7 +191,7 @@ export class CodeCell extends Disposable {
 					if (
 						this.notebookEditor.getActiveCell() === this.viewCell &&
 						this.viewCell.focusMode === CellFocusMode.Editor &&
-						(this.notebookEditor.hasEditorFocus() || document.activeElement === document.body)) // Don't steal focus from other workbench parts, but if body has focus, we can take it
+						(this.notebookEditor.hasEditorFocus() || this.notebookEditor.getDomNode().ownerDocument.activeElement === this.notebookEditor.getDomNode().ownerDocument.body)) // Don't steal focus from other workbench parts, but if body has focus, we can take it
 					{
 						this.templateData.editor?.focus();
 					}
@@ -338,7 +338,7 @@ export class CodeCell extends Disposable {
 		// the document active element is inside the notebook editor or the document body (cell editor being disposed previously)
 		return this.notebookEditor.getActiveCell() === this.viewCell
 			&& this.viewCell.focusMode === CellFocusMode.Editor
-			&& (this.notebookEditor.hasEditorFocus() || document.activeElement === document.body);
+			&& (this.notebookEditor.hasEditorFocus() || this.notebookEditor.getDomNode().ownerDocument.activeElement === this.notebookEditor.getDomNode().ownerDocument.body);
 	}
 
 	private updateEditorForFocusModeChange() {

src/vs/workbench/contrib/notebook/browser/view/cellParts/markupCell.ts

@@ -224,7 +224,7 @@ export class MarkupCell extends Disposable {
 
 	override dispose() {
 		// move focus back to the cell list otherwise the focus goes to body
-		if (this.notebookEditor.getActiveCell() === this.viewCell && this.viewCell.focusMode === CellFocusMode.Editor && (this.notebookEditor.hasEditorFocus() || document.activeElement === document.body)) {
+		if (this.notebookEditor.getActiveCell() === this.viewCell && this.viewCell.focusMode === CellFocusMode.Editor && (this.notebookEditor.hasEditorFocus() || this.notebookEditor.getDomNode().ownerDocument.activeElement === this.notebookEditor.getDomNode().ownerDocument.body)) {
 			this.notebookEditor.focusContainer();
 		}
 
@@ -407,7 +407,7 @@ export class MarkupCell extends Disposable {
 
 	private focusEditorIfNeeded() {
 		if (this.viewCell.focusMode === CellFocusMode.Editor &&
-			(this.notebookEditor.hasEditorFocus() || document.activeElement === document.body)
+			(this.notebookEditor.hasEditorFocus() || this.notebookEditor.getDomNode().ownerDocument.activeElement === this.notebookEditor.getDomNode().ownerDocument.body)
 		) { // Don't steal focus from other workbench parts, but if body has focus, we can take it
 			if (!this.editor) {
 				return;

src/vs/workbench/contrib/preferences/browser/settingsWidgets.ts

@@ -484,9 +484,9 @@ export class ListSettingWidget extends AbstractListSettingWidget<IListDataItem>
 			if (ev.dataTransfer) {
 				ev.dataTransfer.dropEffect = 'move';
 				const dragImage = this.getDragImage(item);
-				document.body.appendChild(dragImage);
+				rowElement.ownerDocument.body.appendChild(dragImage);
 				ev.dataTransfer.setDragImage(dragImage, -10, -10);
-				setTimeout(() => document.body.removeChild(dragImage), 0);
+				setTimeout(() => rowElement.ownerDocument.body.removeChild(dragImage), 0);
 			}
 		}));
 		this.listDisposables.add(DOM.addDisposableListener(rowElement, DOM.EventType.DRAG_OVER, (ev) => {

src/vs/workbench/services/suggest/browser/simpleSuggestWidget.ts

@@ -395,7 +395,7 @@ export class SimpleSuggestWidget implements IDisposable {
 		// 	return;
 		// }
 
-		const bodyBox = dom.getClientArea(document.body);
+		const bodyBox = dom.getClientArea(this._container.ownerDocument.body);
 		const info = this._getLayoutInfo();
 
 		if (!size) {