Adds support for dark themes.

extension/src/ConnectionHandler.ts

@@ -69,6 +69,7 @@ export class ConnectionHandler {
 					throwIfNotAuthenticated();
 
 					const url = server.getIndexUrl({
+						mode: "standalone",
 						expression: this.watcher
 							? this.watcher.expression
 							: undefined,

extension/src/Server.ts

@@ -34,13 +34,18 @@ export class Server {
 		});
 	}
 
-	public getIndexUrl(args: { expression?: string } = {}): string {
+	public getIndexUrl(args: {
+		expression?: string;
+		mode: "standalone" | "webViewIFrame";
+	}): string {
 		const port = process.env.USE_DEV_UI ? 8080 : this.port;
 		const expr =
 			args.expression !== undefined
 				? `&expression=${encodeURIComponent(args.expression)}`
 				: "";
-		return `http://localhost:${port}/index.html?serverPort=${this.port}&serverSecret=${this.secret}${expr}`;
+		const inWebView =
+			args.mode === "standalone" ? "" : "&mode=webViewIFrame";
+		return `http://localhost:${port}/index.html?serverPort=${this.port}&serverSecret=${this.secret}${inWebView}${expr}`;
 	}
 
 	public get mainBundleUrl(): string {

extension/src/WebViews.ts

@@ -71,8 +71,10 @@ export function getHtml(server: Server) {
             </head>
 			<body>
 				<script>
-					window.serverPort = ${server.port};
-					window.serverSecret = ${JSON.stringify(server.secret)};
+					window.webViewData = ${JSON.stringify({
+						serverSecret: server.secret,
+						serverPort: server.port,
+					})};
 					const api = window.VsCodeApi = acquireVsCodeApi();
 					window.addEventListener('message', event => {
 						if (event.source === window.frames[0]) {
@@ -89,7 +91,9 @@ export function getHtml(server: Server) {
 				</script>
 				${
 					isDev
-						? `<iframe sandbox="allow-top-navigation allow-scripts allow-same-origin allow-popups allow-pointer-lock allow-forms" src="${server.getIndexUrl()}"></iframe>`
+						? `<iframe sandbox="allow-top-navigation allow-scripts allow-same-origin allow-popups allow-pointer-lock allow-forms" src="${server.getIndexUrl(
+								{ mode: "webViewIFrame" }
+						  )}"></iframe>`
 						: `<script type="text/javascript" src="${server.mainBundleUrl}"></script>`
 				}
             </body>