debug: fix resizing window makes debug toolbar disappear (microsoft#209075)

Fixes microsoft#208895

Should work but testing on aux windows was limited due to microsoft#209073

Author: connor4312

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

@@ -53,7 +53,6 @@ export class DebugToolBar extends Themable implements IWorkbenchContribution {
 	private activeActions: IAction[];
 	private updateScheduler: RunOnceScheduler;
 	private debugToolBarMenu: IMenu;
-	private yCoordinate = 0;
 
 	private isVisible = false;
 	private isBuilt = false;
@@ -141,7 +140,7 @@ export class DebugToolBar extends Themable implements IWorkbenchContribution {
 			}
 			if (e.affectsConfiguration(LayoutSettings.EDITOR_TABS_MODE) || e.affectsConfiguration(LayoutSettings.COMMAND_CENTER)) {
 				this._yRange = undefined;
-				this.setYCoordinate();
+				this.setCoordinates();
 			}
 		}));
 		this._register(this.debugToolBarMenu.onDidChange(() => this.updateScheduler.schedule()));
@@ -187,9 +186,14 @@ export class DebugToolBar extends Themable implements IWorkbenchContribution {
 			});
 		}));
 
-		this._register(this.layoutService.onDidChangePartVisibility(() => this.setYCoordinate()));
+		this._register(this.layoutService.onDidChangePartVisibility(() => this.setCoordinates()));
 
 		const resizeListener = this._register(new MutableDisposable());
+		const registerResizeListener = () => {
+			resizeListener.value = this._register(dom.addDisposableListener(
+				dom.getWindow(this.layoutService.activeContainer), dom.EventType.RESIZE, () => this.setCoordinates())
+			);
+		};
 
 		this._register(this.layoutService.onDidChangeActiveContainer(async () => {
 			this._yRange = undefined;
@@ -202,21 +206,24 @@ export class DebugToolBar extends Themable implements IWorkbenchContribution {
 				this.setCoordinates();
 			}
 
-			resizeListener.value = this._register(dom.addDisposableListener(
-				dom.getWindow(this.layoutService.activeContainer), dom.EventType.RESIZE, () => this.setYCoordinate()));
+			registerResizeListener();
 		}));
+
+		registerResizeListener();
 	}
 
 	private storePosition(): void {
 		const activeWindow = dom.getWindow(this.layoutService.activeContainer);
 		const isMainWindow = this.layoutService.activeContainer === this.layoutService.mainContainer;
 
-		const left = this.$el.getBoundingClientRect().left / activeWindow.innerWidth;
+		const rect = this.$el.getBoundingClientRect();
+		const y = rect.top;
+		const x = rect.left / activeWindow.innerWidth;
 		if (isMainWindow) {
-			this.storageService.store(DEBUG_TOOLBAR_POSITION_KEY, left, StorageScope.PROFILE, StorageTarget.MACHINE);
-			this.storageService.store(DEBUG_TOOLBAR_Y_KEY, this.yCoordinate, StorageScope.PROFILE, StorageTarget.MACHINE);
+			this.storageService.store(DEBUG_TOOLBAR_POSITION_KEY, x, StorageScope.PROFILE, StorageTarget.MACHINE);
+			this.storageService.store(DEBUG_TOOLBAR_Y_KEY, y, StorageScope.PROFILE, StorageTarget.MACHINE);
 		} else {
-			this.auxWindowCoordinates.set(activeWindow, { x: left, y: this.yCoordinate });
+			this.auxWindowCoordinates.set(activeWindow, { x, y });
 		}
 	}
 
@@ -271,11 +278,10 @@ export class DebugToolBar extends Themable implements IWorkbenchContribution {
 		this.setYCoordinate(y ?? this.yDefault);
 	}
 
-	private setYCoordinate(y = this.yCoordinate): void {
+	private setYCoordinate(y: number): void {
 		const [yMin, yMax] = this.yRange;
 		y = Math.max(yMin, Math.min(y, yMax));
 		this.$el.style.top = `${y}px`;
-		this.yCoordinate = y;
 	}
 
 	private get yDefault() {
@@ -322,7 +328,9 @@ export class DebugToolBar extends Themable implements IWorkbenchContribution {
 
 	private doShowInActiveContainer(): void {
 		this.layoutService.activeContainer.appendChild(this.$el);
-		this.trackPixelRatioListener.value = PixelRatio.getInstance(dom.getWindow(this.$el)).onDidChange(() => this.setYCoordinate());
+		this.trackPixelRatioListener.value = PixelRatio.getInstance(dom.getWindow(this.$el)).onDidChange(
+			() => this.setCoordinates()
+		);
 	}
 
 	private hide(): void {