Improved typescript visualizer. Opens browser window in chrome appmode by default.

extension/src/ConnectionHandler.ts

@@ -43,7 +43,11 @@ export class ConnectionHandler {
 					);
 				},
 				openInBrowser: async ({}) => {
-					open(server.indexUrl);
+					try {
+						await launchChrome(server.indexUrl);
+					} catch (e) {
+						open(server.indexUrl);
+					}
 				},
 				setPreferredDataExtractor: async ({ dataExtractorId }) => {
 					if (this.watcher) {
@@ -70,3 +74,13 @@ export class ConnectionHandler {
 		});
 	}
 }
+
+import chromeLauncher = require("chrome-launcher");
+
+async function launchChrome(url: string): Promise<void> {
+	const chrome = await chromeLauncher.launch({
+		startingUrl: url,
+		// `--window-size=${width},${height}`
+		chromeFlags: ["--app=" + url],
+	});
+}

extension/src/Server.ts

@@ -26,12 +26,11 @@ export class Server {
 	}
 
 	public get indexUrl(): string {
-		return `http://localhost:${this.port}/index.html?serverPort=${
-			this.port
-		}`;
+		const port = process.env.USE_DEV_UI ? 8080 : this.port;
+		return `http://localhost:${port}/index.html?serverPort=${this.port}`;
 	}
 
-	public get mainBundle(): string {
+	public get mainBundleUrl(): string {
 		return `http://localhost:${this.port}/main.js`;
 	}
 

extension/src/WebViews.ts

@@ -53,9 +53,6 @@ export class WebViews {
 }
 
 export class WebView {
-	private expression: string | null = null;
-	private lastFrameId: number | null = null;
-
 	constructor(private readonly webviewPanel: WebviewPanel) {}
 }
 
@@ -89,11 +86,9 @@ export function getHtml(server: Server) {
 				</script>
 				${
 					isDev
-						? `<iframe src="http://localhost:8080/?serverPort=${
-								server.port
-						  }" tabindex="0"></iframe>`
+						? `<iframe src="${server.indexUrl}"></iframe>`
 						: `<script type="text/javascript" src="${
-								server.mainBundle
+								server.mainBundleUrl
 						  }"></script>`
 				}
             </body>

extension/src/extension.ts

@@ -5,7 +5,11 @@ import {
 	registerUpdateReconciler,
 	getReloadCount,
 } from "@hediet/node-reload";
-enableHotReload({ entryModule: module, loggingEnabled: true });
+
+if (process.env.USE_DEV_UI) {
+	enableHotReload({ entryModule: module, loggingEnabled: true });
+}
+
 import { Disposable } from "@hediet/std/disposable";
 
 import { createJsDebuggerSource } from "./DataSource/JsDebuggerSource";
@@ -27,9 +31,11 @@ export class Extension {
 	private readonly views = this.dispose.track(new WebViews(this.server));
 
 	constructor() {
-		const i = this.dispose.track(window.createStatusBarItem());
-		i.text = "reload" + getReloadCount(module);
-		i.show();
+		if (getReloadCount(module) > 0) {
+			const i = this.dispose.track(window.createStatusBarItem());
+			i.text = "reload" + getReloadCount(module);
+			i.show();
+		}
 		this.views.createNew();
 	}
 }

extension/src/types.d.ts

@@ -0,0 +1,5 @@
+declare namespace NodeJS {
+	declare interface ProcessEnv {
+		USE_DEV_UI?: "true";
+	}
+}