Tab decorations need to update scrollbar (fix #112799)

src/vs/workbench/browser/labels.ts

@@ -100,6 +100,10 @@ export const DEFAULT_LABELS_CONTAINER: IResourceLabelsContainer = {
 };
 
 export class ResourceLabels extends Disposable {
+
+	private _onDidChangeDecorations = this._register(new Emitter<void>());
+	readonly onDidChangeDecorations = this._onDidChangeDecorations.event;
+
 	private widgets: ResourceLabelWidget[] = [];
 	private labels: IResourceLabel[] = [];
 
@@ -148,7 +152,18 @@ export class ResourceLabels extends Disposable {
 		}));
 
 		// notify when file decoration changes
-		this._register(this.decorationsService.onDidChangeDecorations(e => this.widgets.forEach(widget => widget.notifyFileDecorationsChanges(e))));
+		this._register(this.decorationsService.onDidChangeDecorations(e => {
+			let notifyDidChangeDecorations = false;
+			this.widgets.forEach(widget => {
+				if (widget.notifyFileDecorationsChanges(e)) {
+					notifyDidChangeDecorations = true;
+				}
+			});
+
+			if (notifyDidChangeDecorations) {
+				this._onDidChangeDecorations.fire();
+			}
+		}));
 
 		// notify when theme changes
 		this._register(this.themeService.onDidColorThemeChange(() => this.widgets.forEach(widget => widget.notifyThemeChange())));
@@ -311,19 +326,21 @@ class ResourceLabelWidget extends IconLabel {
 		}
 	}
 
-	notifyFileDecorationsChanges(e: IResourceDecorationChangeEvent): void {
+	notifyFileDecorationsChanges(e: IResourceDecorationChangeEvent): boolean {
 		if (!this.options) {
-			return;
+			return false;
 		}
 
 		const resource = toResource(this.label);
 		if (!resource) {
-			return;
+			return false;
 		}
 
 		if (this.options.fileDecorations && e.affectsResource(resource)) {
-			this.render(false);
+			return this.render(false);
 		}
+
+		return false;
 	}
 
 	notifyExtensionsRegistered(): void {
@@ -465,7 +482,7 @@ class ResourceLabelWidget extends IconLabel {
 		this.setLabel('');
 	}
 
-	private render(clearIconCache: boolean): void {
+	private render(clearIconCache: boolean): boolean {
 		if (this.isHidden) {
 			if (!this.needsRedraw) {
 				this.needsRedraw = clearIconCache ? Redraw.Full : Redraw.Basic;
@@ -475,7 +492,7 @@ class ResourceLabelWidget extends IconLabel {
 				this.needsRedraw = Redraw.Full;
 			}
 
-			return;
+			return false;
 		}
 
 		if (this.label) {
@@ -492,7 +509,7 @@ class ResourceLabelWidget extends IconLabel {
 		}
 
 		if (!this.label) {
-			return;
+			return false;
 		}
 
 		this.renderDisposables.clear();
@@ -558,6 +575,8 @@ class ResourceLabelWidget extends IconLabel {
 		this.setLabel(label || '', this.label.description, iconLabelOptions);
 
 		this._onDidRender.fire();
+
+		return true;
 	}
 
 	dispose(): void {

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

@@ -129,6 +129,9 @@ export class TabsTitleControl extends TitleControl {
 		// If we are connected to remote, this accounts for the
 		// remote OS.
 		(async () => this.path = await this.pathService.path)();
+
+		// React to decorations changing for our resource labels
+		this._register(this.tabResourceLabels.onDidChangeDecorations(() => this.doHandleDecorationsChange()));
 	}
 
 	protected create(parent: HTMLElement): void {
@@ -161,7 +164,7 @@ export class TabsTitleControl extends TitleControl {
 		// Editor Actions Toolbar
 		this.createEditorActionsToolBar(this.editorToolbarContainer);
 
-		// Breadcrumbs (are on a separate row below tabs and actions)
+		// Breadcrumbs
 		const breadcrumbsContainer = document.createElement('div');
 		breadcrumbsContainer.classList.add('tabs-breadcrumbs');
 		this.titleContainer.appendChild(breadcrumbsContainer);
@@ -380,6 +383,13 @@ export class TabsTitleControl extends TitleControl {
 		}));
 	}
 
+	private doHandleDecorationsChange(): void {
+
+		// A change to decorations potentially has an impact on the size of tabs
+		// so we need to trigger a layout in that case to adjust things
+		this.layout(this.dimensions);
+	}
+
 	protected updateEditorActionsToolbar(): void {
 		super.updateEditorActionsToolbar();
 
@@ -611,7 +621,6 @@ export class TabsTitleControl extends TitleControl {
 
 		// Tab Editor Label
 		const editorLabel = this.tabResourceLabels.create(tabContainer);
-		const editorLabelRenderDisposable = editorLabel.onDidRender(() => this.layout(this.dimensions));
 
 		// Tab Actions
 		const tabActionsContainer = document.createElement('div');
@@ -637,7 +646,7 @@ export class TabsTitleControl extends TitleControl {
 		// Eventing
 		const eventsDisposable = this.registerTabListeners(tabContainer, index, tabsContainer, tabsScrollbar);
 
-		this.tabDisposables.push(combinedDisposable(eventsDisposable, tabActionBarDisposable, tabActionRunner, editorLabel, editorLabelRenderDisposable));
+		this.tabDisposables.push(combinedDisposable(eventsDisposable, tabActionBarDisposable, tabActionRunner, editorLabel));
 
 		return tabContainer;
 	}

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

@@ -109,7 +109,7 @@ export abstract class TitleControl extends Themable {
 		this.registerListeners();
 	}
 
-	protected registerListeners(): void {
+	private registerListeners(): void {
 
 		// Update actions toolbar when extension register that may contribute them
 		this._register(this.extensionService.onDidRegisterExtensions(() => this.updateEditorActionsToolbar()));