Cleaning up webviewElement

src/vs/workbench/contrib/webview/browser/webviewElement.ts

@@ -6,11 +6,9 @@
 import { Emitter } from 'vs/base/common/event';
 import { URI } from 'vs/base/common/uri';
 import { Webview, WebviewContentOptions, WebviewOptions } from 'vs/workbench/contrib/webview/common/webview';
-import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { IThemeService, ITheme } from 'vs/platform/theme/common/themeService';
 import { IEnvironmentService } from 'vs/platform/environment/common/environment';
 import { IFileService } from 'vs/platform/files/common/files';
-import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { Disposable } from 'vs/base/common/lifecycle';
 import { areWebviewInputOptionsEqual } from 'vs/workbench/contrib/webview/browser/webviewEditorService';
 import { addDisposableListener, addClass } from 'vs/base/browser/dom';
@@ -25,9 +23,9 @@ interface WebviewContent {
 }
 
 export class IFrameWebview extends Disposable implements Webview {
-	private element: HTMLIFrameElement;
+	private element?: HTMLIFrameElement;
 
-	private _ready: Promise<void>;
+	private readonly _ready: Promise<void>;
 
 	private content: WebviewContent;
 	private _focused = false;
@@ -37,11 +35,9 @@ export class IFrameWebview extends Disposable implements Webview {
 	constructor(
 		private _options: WebviewOptions,
 		contentOptions: WebviewContentOptions,
-		@IInstantiationService instantiationService: IInstantiationService,
 		@IThemeService themeService: IThemeService,
 		@IEnvironmentService environmentService: IEnvironmentService,
 		@IFileService private readonly fileService: IFileService,
-		@ITelemetryService telemetryService: ITelemetryService,
 		@IConfigurationService private readonly _configurationService: IConfigurationService,
 	) {
 		super();
@@ -58,8 +54,7 @@ export class IFrameWebview extends Disposable implements Webview {
 		this.id = `webview-${Date.now()}`;
 
 		this.element = document.createElement('iframe');
-		this.element.sandbox.add('allow-scripts');
-		this.element.sandbox.add('allow-same-origin');
+		this.element.sandbox.add('allow-scripts', 'allow-same-origin');
 		this.element.setAttribute('src', `${environmentService.webviewEndpoint}?id=${this.id}`);
 		this.element.style.border = 'none';
 		this.element.style.width = '100%';
@@ -78,20 +73,13 @@ export class IFrameWebview extends Disposable implements Webview {
 					return;
 
 				case 'did-click-link':
-					let [uri] = e.data.data;
+					const [uri] = e.data.data;
 					this._onDidClickLink.fire(URI.parse(uri));
 					return;
 
-				case 'did-set-content':
-					// this._webview.style.flex = '';
-					// this._webview.style.width = '100%';
-					// this._webview.style.height = '100%';
-					// this.layout();
-					return;
-
 				case 'did-scroll':
-					// if (event.args && typeof event.args[0] === 'number') {
-					// 	this._onDidScroll.fire({ scrollYPercentage: event.args[0] });
+					// if (e.args && typeof e.args[0] === 'number') {
+					// 	this._onDidScroll.fire({ scrollYPercentage: e.args[0] });
 					// }
 					return;
 
@@ -126,7 +114,9 @@ export class IFrameWebview extends Disposable implements Webview {
 		this._ready = new Promise(resolve => {
 			const subscription = this._register(addDisposableListener(window, 'message', (e) => {
 				if (e.data && e.data.target === this.id && e.data.channel === 'webview-ready') {
-					addClass(this.element, 'ready');
+					if (this.element) {
+						addClass(this.element, 'ready');
+					}
 					subscription.dispose();
 					resolve();
 				}
@@ -138,7 +128,9 @@ export class IFrameWebview extends Disposable implements Webview {
 	}
 
 	public mountTo(parent: HTMLElement) {
-		parent.appendChild(this.element);
+		if (this.element) {
+			parent.appendChild(this.element);
+		}
 	}
 
 	public set options(options: WebviewContentOptions) {
@@ -195,7 +187,6 @@ export class IFrameWebview extends Disposable implements Webview {
 	}
 
 	initialScrollProgress: number;
-	state: string | undefined;
 
 	private readonly _onDidFocus = this._register(new Emitter<void>());
 	public readonly onDidFocus = this._onDidFocus.event;
@@ -221,7 +212,9 @@ export class IFrameWebview extends Disposable implements Webview {
 	}
 
 	focus(): void {
-		this.element.focus();
+		if (this.element) {
+			this.element.focus();
+		}
 	}
 
 	dispose(): void {
@@ -263,16 +256,28 @@ export class IFrameWebview extends Disposable implements Webview {
 		throw new Error('Method not implemented.');
 	}
 
+	public set state(state: string | undefined) {
+		this.content = {
+			html: this.content.html,
+			options: this.content.options,
+			state,
+		};
+	}
+
 	private _send(channel: string, data: any): void {
 		this._ready
-			.then(() => this.element.contentWindow!.postMessage({
-				channel: channel,
-				args: data
-			}, '*'))
+			.then(() => {
+				if (!this.element) {
+					return;
+				}
+				this.element.contentWindow!.postMessage({
+					channel: channel,
+					args: data
+				}, '*');
+			})
 			.catch(err => console.error(err));
 	}
 
-
 	private style(theme: ITheme): void {
 		const { styles, activeTheme } = getWebviewThemeData(theme, this._configurationService);
 		this._send('styles', { styles, activeTheme });