From 26dcb051ed3ed211ff0f65d38df073a8d137c8eb Mon Sep 17 00:00:00 2001
From: hiaux0 <30693990+hiaux0@users.noreply.github.com>
Date: Sat, 17 Aug 2019 20:58:25 +0200
Subject: [PATCH] feat(smartAutocomplete): View data update on file change
(#103)
* fix(viewData): update on file change
With the new WebView Api, seems like we have to manually update the
WebView's html
* fix(aureliaViewData): Don't update webview panel on close
---
src/client/Preview/Register.ts | 69 ++++++++++++++-----
.../Preview/TextDocumentContentProvider.ts | 1 +
2 files changed, 51 insertions(+), 19 deletions(-)
diff --git a/src/client/Preview/Register.ts b/src/client/Preview/Register.ts
index c1eb82cd..08334f9b 100644
--- a/src/client/Preview/Register.ts
+++ b/src/client/Preview/Register.ts
@@ -3,29 +3,55 @@ import {TextDocumentContentProvider} from './TextDocumentContentProvider';
export function registerPreview(context, window, client) {
+ const aureliaViewDataPanelType = 'aureliaViewData';
+
let previewUri = vscode.Uri.parse('aurelia-preview://authority/aurelia-preview');
let provider = new TextDocumentContentProvider(client);
let registration = vscode.workspace.registerTextDocumentContentProvider('aurelia-preview', provider);
+ let isPanelVisible: boolean = false;
+ let panel: vscode.WebviewPanel;
+
+ function fillWebViewHtml(bodyContent: string): string {
+ return `
+
+
+
+
+
+ Cat Coding
+
+ ${bodyContent}
+
+ `;
+ }
vscode.workspace.onDidChangeTextDocument((e: vscode.TextDocumentChangeEvent) => {
+ if (!isPanelVisible) return;
if (e.document === vscode.window.activeTextEditor.document) {
- provider.update(previewUri);
+ provider.update(previewUri).then(success => {
+ panel.webview.html = fillWebViewHtml(success);
+ });
}
});
- vscode.window.onDidChangeTextEditorSelection((e: vscode.TextEditorSelectionChangeEvent) => {
- if (e.textEditor === vscode.window.activeTextEditor) {
- provider.update(previewUri);
- }
+ vscode.window.onDidChangeActiveTextEditor((editor: vscode.TextEditor) => {
+ setTimeout(() => {
+ if (!isPanelVisible) return;
+ if (editor === vscode.window.activeTextEditor) {
+ provider.update(previewUri).then(success => {
+ panel.webview.html = fillWebViewHtml(success);
+ });
+ }
+ }, 0);
});
context.subscriptions.push(vscode.commands.registerCommand('aurelia.showViewProperties', () => {
const smartAutocomplete = vscode.workspace.getConfiguration().get('aurelia.featureToggles.smartAutocomplete');
if (smartAutocomplete) {
- const panel = vscode.window.createWebviewPanel(
- 'aureliaViewData',
+ panel = vscode.window.createWebviewPanel(
+ aureliaViewDataPanelType,
'Aurelia view data',
vscode.ViewColumn.Two,
);
@@ -33,17 +59,7 @@ export function registerPreview(context, window, client) {
provider.provideTextDocumentContent(previewUri)
.then(
(success) => {
- panel.webview.html = `
-
-
-
-
-
- Cat Coding
-
- ${success}
-
- `
+ panel.webview.html = fillWebViewHtml(success);
},
(reason) => {
window.showErrorMessage(reason);
@@ -52,8 +68,23 @@ export function registerPreview(context, window, client) {
return vscode.window.showWarningMessage('This command requires the experimental feature "smartAutocomplete" to be enabled');
}
+ /**
+ * Set panel visible flag to true, if
+ * - we have the correct WebView type (multiple WebView types possible)
+ * - and panel itself is not active
+ */
+ panel.onDidChangeViewState(event => {
+ const correctPanelType = (event.webviewPanel.viewType === aureliaViewDataPanelType);
+ /** Don't update panel if the panel itself is 'active' */
+ const panelNotActive = !event.webviewPanel.active
+ isPanelVisible = correctPanelType && panelNotActive;
+ });
+
+ panel.onDidDispose(event => {
+ isPanelVisible = false;
+ });
- }));
+ }));
}
diff --git a/src/client/Preview/TextDocumentContentProvider.ts b/src/client/Preview/TextDocumentContentProvider.ts
index 2e92c524..03a71bb2 100644
--- a/src/client/Preview/TextDocumentContentProvider.ts
+++ b/src/client/Preview/TextDocumentContentProvider.ts
@@ -119,5 +119,6 @@
public update(uri: vscode.Uri) {
this._onDidChange.fire(uri);
+ return this.provideTextDocumentContent(uri);
}
}