Does javascript template work with webviewView ?
minesunny opened this issue · comments
I learn that panel.webview.html = this.getWebviewContent(), and I want to use webviewView.webview.html = this.getWebviewContent(),but javascript doesn't work with webviewView;
class OutputProvider implements WebviewViewProvider{
public resolveWebviewView(webviewView: WebviewView,
context: WebviewViewResolveContext, token: CancellationToken): Thenable<void> | void {
webviewView.webview.html = this.getHtmlForWebview(webviewView.webview);
// Handle messages from the webview
webviewView.webview.onDidReceiveMessage(
message => {
switch (message.command) {
case 'alert':
vscode.window.showErrorMessage(message.text);
return;
}
},
undefined
);
}
private getHtmlForWebview(webview: vscode.Webview): string {
return `<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cat Coding</title>
</head>
<body>
<img src="https://media.giphy.com/media/JIX9t2j0ZTN9S/giphy.gif" width="300" />
<h1 id="lines-of-code-counter">0</h1>
<script>
(function() {
const vscode = acquireVsCodeApi();
const counter = document.getElementById('lines-of-code-counter');
let count = 0;
setInterval(() => {
counter.textContent = count++;
// Alert the extension when our cat introduces a bug
if (Math.random() < 0.001 * count) {
vscode.postMessage({
command: 'alert',
text: '🐛 on line ' + count
})
}
}, 100);
}())
</script>
</body>
</html>`;
}
}
@minesunny Have you already tried inspecting and debugging? See the instructions here: https://code.visualstudio.com/api/extension-guides/webview#inspecting-and-debugging-webviews
@minesunny Have you already tried inspecting and debugging? See the instructions here: https://code.visualstudio.com/api/extension-guides/webview#inspecting-and-debugging-webviews
Thanks, it work after I enableScripts