tabs title - 💄 height compute

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

@@ -109,12 +109,12 @@ export interface IEditorGroupsAccessor {
 	arrangeGroups(arrangement: GroupsArrangement, target?: IEditorGroupView | GroupIdentifier): void;
 }
 
-export interface IEditorGroupTitleDimensions {
+export interface IEditorGroupTitleHeight {
 
 	/**
 	 * The overall height of the editor group title control.
 	 */
-	height: number;
+	total: number;
 
 	/**
 	 * The height offset to e.g. use when drawing drop overlays.
@@ -137,7 +137,7 @@ export interface IEditorGroupView extends IDisposable, ISerializableView, IEdito
 	readonly group: EditorGroup;
 	readonly whenRestored: Promise<void>;
 
-	readonly titleDimensions: IEditorGroupTitleDimensions;
+	readonly titleHeight: IEditorGroupTitleHeight;
 
 	readonly isEmpty: boolean;
 	readonly isMinimized: boolean;

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

@@ -521,7 +521,7 @@ class DropOverlay extends Themable {
 
 		// With tabs and opened editors: use the area below tabs as drop target
 		if (!this.groupView.isEmpty && this.accessor.partOptions.showTabs) {
-			return this.groupView.titleDimensions.offset;
+			return this.groupView.titleHeight.offset;
 		}
 
 		// Without tabs or empty group: use entire editor area as drop target

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

@@ -30,7 +30,7 @@ import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { Promises, RunOnceWorker } from 'vs/base/common/async';
 import { EventType as TouchEventType, GestureEvent } from 'vs/base/browser/touch';
 import { TitleControl } from 'vs/workbench/browser/parts/editor/titleControl';
-import { IEditorGroupsAccessor, IEditorGroupView, getActiveTextEditorOptions, IEditorOpeningEvent, EditorServiceImpl, IEditorGroupTitleDimensions } from 'vs/workbench/browser/parts/editor/editor';
+import { IEditorGroupsAccessor, IEditorGroupView, getActiveTextEditorOptions, IEditorOpeningEvent, EditorServiceImpl, IEditorGroupTitleHeight } from 'vs/workbench/browser/parts/editor/editor';
 import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
 import { ActionRunner, IAction, Action } from 'vs/base/common/actions';
@@ -710,8 +710,8 @@ export class EditorGroupView extends Themable implements IEditorGroupView {
 		return this._group.count === 0;
 	}
 
-	get titleDimensions(): IEditorGroupTitleDimensions {
-		return this.titleAreaControl.getDimensions();
+	get titleHeight(): IEditorGroupTitleHeight {
+		return this.titleAreaControl.getHeight();
 	}
 
 	get isMinimized(): boolean {

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

@@ -14,7 +14,7 @@ import { IAction } from 'vs/base/common/actions';
 import { CLOSE_EDITOR_COMMAND_ID } from 'vs/workbench/browser/parts/editor/editorCommands';
 import { Color } from 'vs/base/common/color';
 import { withNullAsUndefined, assertIsDefined, assertAllDefined } from 'vs/base/common/types';
-import { IEditorGroupTitleDimensions } from 'vs/workbench/browser/parts/editor/editor';
+import { IEditorGroupTitleHeight } from 'vs/workbench/browser/parts/editor/editor';
 import { equals } from 'vs/base/common/objects';
 
 interface IRenderedEditorLabel {
@@ -332,9 +332,9 @@ export class NoTabsTitleControl extends TitleControl {
 		return { primaryEditorActions: editorActions.primary.filter(action => action.id === CLOSE_EDITOR_COMMAND_ID), secondaryEditorActions: [] };
 	}
 
-	getDimensions(): IEditorGroupTitleDimensions {
+	getHeight(): IEditorGroupTitleHeight {
 		return {
-			height: NoTabsTitleControl.HEIGHT,
+			total: NoTabsTitleControl.HEIGHT,
 			offset: 0
 		};
 	}
@@ -344,6 +344,6 @@ export class NoTabsTitleControl extends TitleControl {
 			this.breadcrumbsControl.layout(undefined);
 		}
 
-		return new Dimension(dimensions.container.width, this.getDimensions().height);
+		return new Dimension(dimensions.container.width, this.getHeight().total);
 	}
 }

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

@@ -33,7 +33,7 @@ import { INotificationService } from 'vs/platform/notification/common/notificati
 import { MergeGroupMode, IMergeGroupOptions, GroupsArrangement, IEditorGroupsService } from 'vs/workbench/services/editor/common/editorGroupsService';
 import { addDisposableListener, EventType, EventHelper, Dimension, scheduleAtNextAnimationFrame, findParentWithClass, clearNode } from 'vs/base/browser/dom';
 import { localize } from 'vs/nls';
-import { IEditorGroupsAccessor, IEditorGroupView, EditorServiceImpl, IEditorGroupTitleDimensions } from 'vs/workbench/browser/parts/editor/editor';
+import { IEditorGroupsAccessor, IEditorGroupView, EditorServiceImpl, IEditorGroupTitleHeight } from 'vs/workbench/browser/parts/editor/editor';
 import { CloseOneEditorAction, UnpinEditorAction } from 'vs/workbench/browser/parts/editor/editorActions';
 import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
 import { BreadcrumbsControl } from 'vs/workbench/browser/parts/editor/breadcrumbsControl';
@@ -1290,25 +1290,42 @@ export class TabsTitleControl extends TitleControl {
 		tabContainer.style.outlineColor = this.getColor(activeContrastBorder) || '';
 	}
 
-	getDimensions(): IEditorGroupTitleDimensions {
-		let height: number;
+	getHeight(): IEditorGroupTitleHeight {
+		const showsBreadcrumbs = this.breadcrumbsControl && !this.breadcrumbsControl.isHidden();
+
+		// Return quickly if our used dimensions are known
+		if (this.dimensions.used) {
+			return {
+				total: this.dimensions.used.height,
+				offset: showsBreadcrumbs ? this.dimensions.used.height - BreadcrumbsControl.HEIGHT : this.dimensions.used.height
+			};
+		}
+
+		// Otherwise compute via browser APIs
+		else {
+			return this.computeHeight();
+		}
+	}
+
+	private computeHeight(): IEditorGroupTitleHeight {
+		let total: number;
 
 		// Wrap: we need to ask `offsetHeight` to get
 		// the real height of the title area with wrapping.
 		if (this.accessor.partOptions.wrapTabs && this.tabsAndActionsContainer?.classList.contains('wrapping')) {
-			height = this.tabsAndActionsContainer.offsetHeight;
+			total = this.tabsAndActionsContainer.offsetHeight;
 		} else {
-			height = TabsTitleControl.TAB_HEIGHT;
+			total = TabsTitleControl.TAB_HEIGHT;
 		}
 
-		const offset = height;
+		const offset = total;
 
 		// Account for breadcrumbs if visible
 		if (this.breadcrumbsControl && !this.breadcrumbsControl.isHidden()) {
-			height += BreadcrumbsControl.HEIGHT; // Account for breadcrumbs if visible
+			total += BreadcrumbsControl.HEIGHT; // Account for breadcrumbs if visible
 		}
 
-		return { height, offset };
+		return { total, offset };
 	}
 
 	layout(dimensions: ITitleControlDimensions): Dimension {
@@ -1329,7 +1346,7 @@ export class TabsTitleControl extends TitleControl {
 
 		// First time layout: compute the dimensions and store it
 		if (!this.dimensions.used) {
-			this.dimensions.used = new Dimension(dimensions.container.width, this.getDimensions().height);
+			this.dimensions.used = new Dimension(dimensions.container.width, this.computeHeight().total);
 		}
 
 		return this.dimensions.used;
@@ -1353,7 +1370,7 @@ export class TabsTitleControl extends TitleControl {
 		// return it fast from the `layout` call without having to
 		// compute it over and over again
 		const oldDimension = this.dimensions.used;
-		const newDimension = this.dimensions.used = new Dimension(dimensions.container.width, this.getDimensions().height);
+		const newDimension = this.dimensions.used = new Dimension(dimensions.container.width, this.computeHeight().total);
 
 		// In case the height of the title control changed from before
 		// (currently only possible if wrapping changed on/off), we need

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

@@ -30,7 +30,7 @@ import { DraggedEditorGroupIdentifier, DraggedEditorIdentifier, fillResourceData
 import { EditorPane } from 'vs/workbench/browser/parts/editor/editorPane';
 import { BreadcrumbsConfig } from 'vs/workbench/browser/parts/editor/breadcrumbs';
 import { BreadcrumbsControl, IBreadcrumbsControlOptions } from 'vs/workbench/browser/parts/editor/breadcrumbsControl';
-import { IEditorGroupsAccessor, IEditorGroupTitleDimensions, IEditorGroupView } from 'vs/workbench/browser/parts/editor/editor';
+import { IEditorGroupsAccessor, IEditorGroupTitleHeight, IEditorGroupView } from 'vs/workbench/browser/parts/editor/editor';
 import { EditorCommandsContextActionRunner, IEditorCommandsContext, IEditorInput, EditorResourceAccessor, IEditorPartOptions, SideBySideEditor, ActiveEditorPinnedContext, ActiveEditorStickyContext } from 'vs/workbench/common/editor';
 import { ResourceContextKey } from 'vs/workbench/common/resources';
 import { AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
@@ -390,7 +390,7 @@ export abstract class TitleControl extends Themable {
 
 	abstract layout(dimensions: ITitleControlDimensions): Dimension;
 
-	abstract getDimensions(): IEditorGroupTitleDimensions;
+	abstract getHeight(): IEditorGroupTitleHeight;
 
 	dispose(): void {
 		dispose(this.breadcrumbsControl);

src/vs/workbench/test/browser/workbenchTestServices.ts

@@ -10,7 +10,7 @@ import { URI } from 'vs/base/common/uri';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { NullTelemetryService } from 'vs/platform/telemetry/common/telemetryUtils';
 import { IEditorInputWithOptions, IEditorIdentifier, IUntitledTextResourceEditorInput, IResourceDiffEditorInput, IEditorInput, IEditorPane, IEditorCloseEvent, IEditorPartOptions, IRevertOptions, GroupIdentifier, EditorInput, EditorOptions, EditorsOrder, IFileEditorInput, IEditorInputFactoryRegistry, IEditorInputFactory, Extensions as EditorExtensions, ISaveOptions, IMoveResult, ITextEditorPane, ITextDiffEditorPane, IVisibleEditorPane, IEditorOpenContext, SideBySideEditorInput } from 'vs/workbench/common/editor';
-import { IEditorOpeningEvent, EditorServiceImpl, IEditorGroupView, IEditorGroupsAccessor, IEditorGroupTitleDimensions } from 'vs/workbench/browser/parts/editor/editor';
+import { IEditorOpeningEvent, EditorServiceImpl, IEditorGroupView, IEditorGroupsAccessor, IEditorGroupTitleHeight } from 'vs/workbench/browser/parts/editor/editor';
 import { Event, Emitter } from 'vs/base/common/event';
 import { IBackupFileService } from 'vs/workbench/services/backup/common/backup';
 import { IConfigurationService, ConfigurationTarget } from 'vs/platform/configuration/common/configuration';
@@ -650,7 +650,7 @@ export class TestEditorGroupView implements IEditorGroupView {
 	minimumHeight!: number;
 	maximumHeight!: number;
 
-	titleDimensions!: IEditorGroupTitleDimensions;
+	titleHeight!: IEditorGroupTitleHeight;
 
 	isEmpty = true;
 	isMinimized = false;