pwa-wco (#164067)

* pwa-wco

* increase titlebar height with WCO as well

* remove unused import

* move to browser and fix compact menu case

resources/server/manifest.json

@@ -3,7 +3,9 @@
 	"short_name": "Code- OSS",
 	"start_url": "/",
 	"lang": "en-US",
-	"display": "standalone",
+	"display_override": [
+		"window-controls-overlay"
+	],
 	"icons": [
 		{
 			"src": "code-192.png",

src/vs/base/browser/browser.ts

@@ -210,3 +210,7 @@ if (window.matchMedia) {
 export function isStandalone(): boolean {
 	return standalone;
 }
+
+export function isWCOVisible(): boolean {
+	return (navigator as any)?.windowControlsOverlay?.visible;
+}

src/vs/workbench/browser/layout.ts

@@ -6,7 +6,7 @@
 import { Disposable, DisposableStore } from 'vs/base/common/lifecycle';
 import { Event, Emitter } from 'vs/base/common/event';
 import { EventType, addDisposableListener, getClientArea, Dimension, position, size, IDimension, isAncestorUsingFlowTo, computeScreenAwareSize } from 'vs/base/browser/dom';
-import { onDidChangeFullscreen, isFullscreen } from 'vs/base/browser/browser';
+import { onDidChangeFullscreen, isFullscreen, isWCOVisible } from 'vs/base/browser/browser';
 import { IWorkingCopyBackupService } from 'vs/workbench/services/workingCopy/common/workingCopyBackup';
 import { isWindows, isLinux, isMacintosh, isWeb, isNative, isIOS } from 'vs/base/common/platform';
 import { EditorInputCapabilities, GroupIdentifier, isResourceEditorInput, IUntypedEditorInput, pathsToEditors } from 'vs/workbench/common/editor';
@@ -1074,6 +1074,11 @@ export abstract class Layout extends Disposable implements IWorkbenchLayoutServi
 			return true;
 		}
 
+		// if WCO is visible, we have to show the title bar
+		if (isWCOVisible()) {
+			return true;
+		}
+
 		// remaining behavior is based on menubar visibility
 		switch (getMenuBarVisibility(this.configurationService)) {
 			case 'classic':

src/vs/workbench/browser/parts/titlebar/media/titlebarpart.css

@@ -250,10 +250,14 @@
 
 .monaco-workbench.mac .part.titlebar>.window-controls-container {
 	width: 70px;
-	height: env(titlebar-area-width, 28px);
+	height: env(titlebar-area-height, 28px);
+}
+
+.monaco-workbench.web .part.titlebar>.window-controls-container {
+	width: calc(100% - env(titlebar-area-width, 100%));
+	height: env(titlebar-area-height, 35px);
 }
 
-.monaco-workbench.web .part.titlebar>.window-controls-container,
 .monaco-workbench.fullscreen .part.titlebar>.window-controls-container {
 	display: none;
 	background-color: transparent;

src/vs/workbench/browser/parts/titlebar/titlebarPart.ts

@@ -7,7 +7,7 @@ import 'vs/css!./media/titlebarpart';
 import { localize } from 'vs/nls';
 import { Part } from 'vs/workbench/browser/part';
 import { ITitleService, ITitleProperties } from 'vs/workbench/services/title/common/titleService';
-import { getZoomFactor } from 'vs/base/browser/browser';
+import { getZoomFactor, isWCOVisible } from 'vs/base/browser/browser';
 import { MenuBarVisibility, getTitleBarStyle, getMenuBarVisibility } from 'vs/platform/window/common/window';
 import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
 import { StandardMouseEvent } from 'vs/base/browser/mouseEvent';
@@ -48,7 +48,7 @@ export class TitlebarPart extends Part implements ITitleService {
 	readonly minimumWidth: number = 0;
 	readonly maximumWidth: number = Number.POSITIVE_INFINITY;
 	get minimumHeight(): number {
-		const value = this.isCommandCenterVisible ? 35 : 30;
+		const value = this.isCommandCenterVisible || (isWeb && isWCOVisible()) ? 35 : 30;
 		return value / (this.useCounterZoom ? getZoomFactor() : 1);
 	}
 
@@ -64,6 +64,7 @@ export class TitlebarPart extends Part implements ITitleService {
 
 	protected rootContainer!: HTMLElement;
 	protected windowControls: HTMLElement | undefined;
+	protected dragRegion: HTMLElement | undefined;
 	protected title!: HTMLElement;
 
 	protected customMenubar: CustomMenubarControl | undefined;
@@ -231,6 +232,9 @@ export class TitlebarPart extends Part implements ITitleService {
 		this.element = parent;
 		this.rootContainer = append(parent, $('.titlebar-container'));
 
+		// Draggable region that we can manipulate for #52522
+		this.dragRegion = prepend(this.rootContainer, $('div.titlebar-drag-region'));
+
 		// App Icon (Native Windows/Linux and Web)
 		if (!isMacintosh || isWeb) {
 			this.appIcon = prepend(this.rootContainer, $('a.window-appicon'));

src/vs/workbench/electron-sandbox/parts/titlebar/titlebarPart.ts

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 
 import { getZoomFactor } from 'vs/base/browser/browser';
-import { $, addDisposableListener, append, EventType, hide, prepend, show } from 'vs/base/browser/dom';
+import { $, addDisposableListener, append, EventType, hide, show } from 'vs/base/browser/dom';
 import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 import { IConfigurationService, IConfigurationChangeEvent } from 'vs/platform/configuration/common/configuration';
 import { IStorageService } from 'vs/platform/storage/common/storage';
@@ -25,7 +25,6 @@ import { IHoverService } from 'vs/workbench/services/hover/browser/hover';
 
 export class TitlebarPart extends BrowserTitleBarPart {
 	private maxRestoreControl: HTMLElement | undefined;
-	private dragRegion: HTMLElement | undefined;
 	private resizer: HTMLElement | undefined;
 	private cachedWindowControlStyles: { bgColor: string; fgColor: string } | undefined;
 	private cachedWindowControlHeight: number | undefined;
@@ -165,9 +164,6 @@ export class TitlebarPart extends BrowserTitleBarPart {
 			})));
 		}
 
-		// Draggable region that we can manipulate for #52522
-		this.dragRegion = prepend(this.rootContainer, $('div.titlebar-drag-region'));
-
 		// Window Controls (Native Windows/Linux)
 		const hasWindowControlsOverlay = typeof (navigator as any).windowControlsOverlay !== 'undefined';
 		if (!isMacintosh && getTitleBarStyle(this.configurationService) !== 'native' && !hasWindowControlsOverlay && this.windowControls) {