Cache webview view title across reloads

Fixes #105867

Author: mjbvz

src/vs/workbench/api/browser/mainThreadWebviewViews.ts

@@ -78,7 +78,7 @@ export class MainThreadWebviewsViews extends Disposable implements extHostProtoc
 				});
 
 				try {
-					await this._proxy.$resolveWebviewView(handle, viewType, state, cancellation);
+					await this._proxy.$resolveWebviewView(handle, viewType, webviewView.title, state, cancellation);
 				} catch (error) {
 					onUnexpectedError(error);
 					webviewView.webview.html = this.mainThreadWebviews.getWebviewResolvedFailedContent(viewType);

src/vs/workbench/api/common/extHost.protocol.ts

@@ -686,7 +686,7 @@ export interface ExtHostCustomEditorsShape {
 }
 
 export interface ExtHostWebviewViewsShape {
-	$resolveWebviewView(webviewHandle: WebviewHandle, viewType: string, state: any, cancellation: CancellationToken): Promise<void>;
+	$resolveWebviewView(webviewHandle: WebviewHandle, viewType: string, title: string | undefined, state: any, cancellation: CancellationToken): Promise<void>;
 
 	$onDidChangeWebviewViewVisibility(webviewHandle: WebviewHandle, visible: boolean): void;
 

src/vs/workbench/api/common/extHostWebviewView.ts

@@ -29,12 +29,14 @@ class ExtHostWebviewView extends Disposable implements vscode.WebviewView {
 		handle: extHostProtocol.WebviewHandle,
 		proxy: extHostProtocol.MainThreadWebviewViewsShape,
 		viewType: string,
+		title: string | undefined,
 		webview: ExtHostWebview,
 		isVisible: boolean,
 	) {
 		super();
 
 		this.#viewType = viewType;
+		this.#title = title;
 		this.#handle = handle;
 		this.#proxy = proxy;
 		this.#webview = webview;
@@ -153,6 +155,7 @@ export class ExtHostWebviewViews implements extHostProtocol.ExtHostWebviewViewsS
 	async $resolveWebviewView(
 		webviewHandle: string,
 		viewType: string,
+		title: string | undefined,
 		state: any,
 		cancellation: CancellationToken,
 	): Promise<void> {
@@ -164,7 +167,7 @@ export class ExtHostWebviewViews implements extHostProtocol.ExtHostWebviewViewsS
 		const { provider, extension } = entry;
 
 		const webview = this._extHostWebview.createNewWebview(webviewHandle, { /* todo */ }, extension);
-		const revivedView = new ExtHostWebviewView(webviewHandle, this._proxy, viewType, webview, true);
+		const revivedView = new ExtHostWebviewView(webviewHandle, this._proxy, viewType, title, webview, true);
 
 		this._webviewViews.set(webviewHandle, revivedView);
 

src/vs/workbench/contrib/webviewView/browser/webviewViewPane.ts

@@ -28,7 +28,10 @@ import { IExtensionService } from 'vs/workbench/services/extensions/common/exten
 
 declare const ResizeObserver: any;
 
-const webviewStateKey = 'webviewState';
+const storageKeys = {
+	webviewState: 'webviewState',
+	title: 'title'
+} as const;
 
 export class WebviewViewPane extends ViewPane {
 
@@ -38,6 +41,9 @@ export class WebviewViewPane extends ViewPane {
 	private _container?: HTMLElement;
 	private _resizeObserver?: any;
 
+	private readonly defaultTitle: string;
+	private setTitle: string | undefined;
+
 	private readonly memento: Memento;
 	private readonly viewState: MementoObject;
 
@@ -60,10 +66,16 @@ export class WebviewViewPane extends ViewPane {
 		@IViewsService private readonly viewService: IViewsService,
 	) {
 		super({ ...options, titleMenuId: MenuId.ViewTitle }, keybindingService, contextMenuService, configurationService, contextKeyService, viewDescriptorService, instantiationService, openerService, themeService, telemetryService);
+		this.defaultTitle = this.title;
 
 		this.memento = new Memento(`webviewView.${this.id}`, storageService);
 		this.viewState = this.memento.getMemento(StorageScope.WORKSPACE);
 
+		const storedTitle = this.viewState[storageKeys.title];
+		if (typeof storedTitle === 'string') {
+			this.updateTitle(storedTitle);
+		}
+
 		this._register(this.onDidChangeBodyVisibility(() => this.updateTreeVisibility()));
 		this.updateTreeVisibility();
 	}
@@ -108,8 +120,9 @@ export class WebviewViewPane extends ViewPane {
 
 	public saveState() {
 		if (this._webview) {
-			this.viewState[webviewStateKey] = this._webview.state;
+			this.viewState[storageKeys.webviewState] = this._webview.state;
 		}
+		this.viewState[storageKeys.title] = this.setTitle;
 
 		this.memento.saveMemento();
 		super.saveState();
@@ -142,15 +155,15 @@ export class WebviewViewPane extends ViewPane {
 
 			const webviewId = `webviewView-${this.id.replace(/[^a-z0-9]/gi, '-')}`.toLowerCase();
 			const webview = this.webviewService.createWebviewOverlay(webviewId, {}, {}, undefined);
-			webview.state = this.viewState['webviewState'];
+			webview.state = this.viewState[storageKeys.webviewState];
 			this._webview = webview;
 
 			this._register(toDisposable(() => {
 				this._webview?.release(this);
 			}));
 
 			this._register(webview.onDidUpdateState(() => {
-				this.viewState[webviewStateKey] = webview.state;
+				this.viewState[storageKeys.webviewState] = webview.state;
 			}));
 
 			const source = this._register(new CancellationTokenSource());
@@ -164,8 +177,8 @@ export class WebviewViewPane extends ViewPane {
 					onDidChangeVisibility: this.onDidChangeBodyVisibility,
 					onDispose: this.onDispose,
 
-					get title() { return self.title; },
-					set title(value: string) { self.updateTitle(value); },
+					get title(): string | undefined { return self.setTitle; },
+					set title(value: string | undefined) { self.updateTitle(value); },
 
 					get description(): string | undefined { return self.titleDescription; },
 					set description(value: string | undefined) { self.updateTitleDescription(value); },
@@ -180,6 +193,11 @@ export class WebviewViewPane extends ViewPane {
 		}
 	}
 
+	protected updateTitle(value: string | undefined) {
+		this.setTitle = value;
+		super.updateTitle(typeof value === 'string' ? value : this.defaultTitle);
+	}
+
 	private async withProgress(task: () => Promise<void>): Promise<void> {
 		return this.progressService.withProgress({ location: this.id, delay: 500 }, task);
 	}