Add API for storing state in webviews contents themselves

mjbvz · mjbvz · commit 6cea14125454 · 2018-05-01T16:14:54.000-07:00
diff --git a/src/vs/workbench/parts/webview/electron-browser/webview-pre.js b/src/vs/workbench/parts/webview/electron-browser/webview-pre.js
@@ -179,6 +179,8 @@
 						const originalPostMessage = window.parent.postMessage.bind(window.parent);
 						let acquired = false;
 
+						let state = ${data.state ? `JSON.parse(${JSON.stringify(data.state)})` : undefined};
+
 						return () => {
 							if (acquired) {
 								throw new Error('An instance of the VS Code API has already been acquired');
@@ -187,6 +189,12 @@
 							return Object.freeze({
 								postMessage: function(msg) {
 									return originalPostMessage({ command: 'onmessage', data: msg }, '*');
+								},
+								setState: function(state) {
+									return originalPostMessage({ command: 'do-update-state', data: JSON.stringify(state) }, '*');
+								},
+								getState: function() {
+									return state;
 								}
 							});
 						};
diff --git a/src/vs/workbench/parts/webview/electron-browser/webviewEditor.ts b/src/vs/workbench/parts/webview/electron-browser/webviewEditor.ts
@@ -219,6 +219,8 @@ export class WebviewEditor extends BaseWebviewEditor {
 			this._webview.initialScrollProgress = input.scrollYPercentage;
 		}
 
+		this._webview.state = input.webviewState;
+
 		this.content.setAttribute('aria-flowto', this.webviewContent.id);
 
 		this.doUpdateContainer();
diff --git a/src/vs/workbench/parts/webview/electron-browser/webviewEditorInput.ts b/src/vs/workbench/parts/webview/electron-browser/webviewEditorInput.ts
@@ -30,6 +30,7 @@ export class WebviewEditorInput extends EditorInput {
 	private _position?: Position;
 	private _scrollYPercentage: number = 0;
 	private _state: any;
+	private _webviewState: string | undefined;
 
 	private _revived: boolean = false;
 
@@ -130,6 +131,10 @@ export class WebviewEditorInput extends EditorInput {
 		this._state = value;
 	}
 
+	public get webviewState() {
+		return this._webviewState;
+	}
+
 	public get options(): WebviewInputOptions {
 		return this._options;
 	}
@@ -185,6 +190,10 @@ export class WebviewEditorInput extends EditorInput {
 		this._webview.onDidScroll(message => {
 			this._scrollYPercentage = message.scrollYPercentage;
 		}, null, this._webviewDisposables);
+
+		this._webview.onDidUpdateState(newState => {
+			this._webviewState = newState;
+		}, null, this._webviewDisposables);
 	}
 
 	public get scrollYPercentage() {
diff --git a/src/vs/workbench/parts/webview/electron-browser/webviewElement.ts b/src/vs/workbench/parts/webview/electron-browser/webviewElement.ts
@@ -33,6 +33,7 @@ export class WebviewElement {
 	private _webviewFindWidget: WebviewFindWidget;
 	private _findStarted: boolean = false;
 	private _contents: string = '';
+	private _state: string | undefined = undefined;
 
 	constructor(
 		private readonly _styleElement: Element,
@@ -162,6 +163,11 @@ export class WebviewElement {
 					case 'do-reload':
 						this.reload();
 						return;
+
+					case 'do-update-state':
+						this._state = event.args[0];
+						this._onDidUpdateState.fire(this._state);
+						return;
 				}
 			}),
 			addDisposableListener(this._webview, 'focus', () => {
@@ -220,6 +226,9 @@ export class WebviewElement {
 	private readonly _onDidScroll = new Emitter<{ scrollYPercentage: number }>();
 	public readonly onDidScroll: Event<{ scrollYPercentage: number }> = this._onDidScroll.event;
 
+	private readonly _onDidUpdateState = new Emitter<string | undefined>();
+	public readonly onDidUpdateState: Event<string | undefined> = this._onDidUpdateState.event;
+
 	private readonly _onMessage = new Emitter<any>();
 	public readonly onMessage: Event<any> = this._onMessage.event;
 
@@ -233,6 +242,10 @@ export class WebviewElement {
 		this._send('initial-scroll-position', value);
 	}
 
+	public set state(value: string | undefined) {
+		this._state = value;
+	}
+
 	public set options(value: WebviewOptions) {
 		this._options = value;
 	}
@@ -241,7 +254,8 @@ export class WebviewElement {
 		this._contents = value;
 		this._send('content', {
 			contents: value,
-			options: this._options
+			options: this._options,
+			state: this._state
 		});
 	}
 

Original file line number	Diff line number	Diff line change
`@@ -219,6 +219,8 @@ export class WebviewEditor extends BaseWebviewEditor {`
`219`	`219`	`this._webview.initialScrollProgress = input.scrollYPercentage;`
`220`	`220`	`}`
`221`	`221`
	`222`	`+ this._webview.state = input.webviewState;`
	`223`	`+`
`222`	`224`	`this.content.setAttribute('aria-flowto', this.webviewContent.id);`
`223`	`225`
`224`	`226`	`this.doUpdateContainer();`