chore(trace-viewer): add CSP to trace viewer webview

microsoft · May 22, 2024 · 6501ee1 · 6501ee1
1 parent 3861db0
commit 6501ee1
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 10 deletions.
diff --git a/src/settingsView.ts b/src/settingsView.ts
@@ -18,6 +18,7 @@ import { DisposableBase } from './disposableBase';
 import type { ReusedBrowser } from './reusedBrowser';
 import type { SettingsModel } from './settingsModel';
 import type { TestModelCollection } from './testModel';
+import { getNonce } from './utils';
 import * as vscodeTypes from './vscodeTypes';
 import path from 'path';
 
@@ -387,11 +388,3 @@ function htmlForWebview(vscode: vscodeTypes.VSCode, extensionUri: vscodeTypes.Ur
     </script>
     </html>`;
 }
-
-function getNonce() {
-  let text = '';
-  const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
-  for (let i = 0; i < 32; i++)
-    text += possible.charAt(Math.floor(Math.random() * possible.length));
-  return text;
-}
diff --git a/src/traceViewer.ts b/src/traceViewer.ts
@@ -17,7 +17,7 @@
 import { ChildProcess, spawn } from 'child_process';
 import type { TestConfig } from './playwrightTestTypes';
 import { SettingsModel } from './settingsModel';
-import { findNode } from './utils';
+import { findNode, getNonce } from './utils';
 import * as vscodeTypes from './vscodeTypes';
 
 function getPath(uriOrPath: string | vscodeTypes.Uri) {
@@ -72,11 +72,18 @@ class TraceViewerView implements vscodeTypes.Disposable {
   }
 
   private getHtml(url: string) {
+    const nonce = getNonce();
+
     return /* html */ `<!DOCTYPE html>
 			<html>
 			<head>
 				<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
-        <style>
+        <meta http-equiv="Content-Security-Policy" content="
+          default-src 'none';
+          style-src 'nonce-${nonce}';
+          frame-src *;
+          ">
+        <style nonce="${nonce}">
           html, body { height: 100%; min-height: 100%; padding: 0; margin: 0; }
           iframe { width: 100%; height: 100%; border: none; }
         </style>

diff --git a/src/utils.ts b/src/utils.ts
@@ -209,3 +209,11 @@ export async function getPlaywrightInfo(vscode: vscodeTypes.VSCode, workspaceFol
     cliOverride = path.join(workspaceFolder, 'tests/playwright-test/stable-test-runner/node_modules/@playwright/test/cli.js');
   return { cli: cliOverride, version };
 }
+
+export function getNonce() {
+  let text = '';
+  const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+  for (let i = 0; i < 32; i++)
+    text += possible.charAt(Math.floor(Math.random() * possible.length));
+  return text;
+}