feat: Inspect CDP messages with DEBUG env

bindings/_tools/generate/mod.ts

@@ -15,6 +15,7 @@ let types =
   "// These bindings are auto-generated by ./_tools/generate/mod.ts\n";
 types += `// Last generated at ${new Date().toISOString()}\n`;
 types += "// deno-lint-ignore-file no-explicit-any\n\n";
+types += `import { attachWs, DEBUG } from "../src/debug.ts";\n`;
 types +=
   `export const PROTOCOL_VERSION = "${protocol.version.major}.${protocol.version.minor}";\n\n`;
 
@@ -165,6 +166,10 @@ export class Celestial extends EventTarget {
 
     this.ws = ws;
 
+    if (DEBUG) {
+      attachWs(ws)
+    }
+
     this.ws.onmessage = (e) => {
       const data = JSON.parse(e.data);
 

bindings/celestial.ts

@@ -1,7 +1,8 @@
 // These bindings are auto-generated by ./_tools/generate/mod.ts
-// Last generated at 2024-04-18T22:50:44.596Z
+// Last generated at 2024-05-23T09:19:58.586Z
 // deno-lint-ignore-file no-explicit-any
 
+import { attachWs, DEBUG } from "../src/debug.ts";
 export const PROTOCOL_VERSION = "1.3";
 
 // ----------------- Accessibility Types -----------------
@@ -13201,6 +13202,10 @@ export class Celestial extends EventTarget {
 
     this.ws = ws;
 
+    if (DEBUG) {
+      attachWs(ws);
+    }
+
     this.ws.onmessage = (e) => {
       const data = JSON.parse(e.data);
 

src/browser.ts

@@ -5,6 +5,7 @@ import { Celestial, PROTOCOL_VERSION } from "../bindings/celestial.ts";
 import { getBinary } from "./cache.ts";
 import { Page, type SandboxOptions, type WaitForOptions } from "./page.ts";
 import { WEBSOCKET_ENDPOINT_REGEX, websocketReady } from "./util.ts";
+import { DEBUG } from "./debug.ts";
 
 async function runCommand(
   command: Deno.Command,
@@ -234,22 +235,28 @@ export async function launch(opts?: LaunchOptions): Promise<Browser> {
   const tempDir = Deno.makeTempDirSync();
 
   // Launch child process
+  const binArgs = [
+    "--remote-debugging-port=0",
+    "--no-first-run",
+    "--password-store=basic",
+    "--use-mock-keychain",
+    `--user-data-dir=${tempDir}`,
+    // "--no-startup-window",
+    ...(headless
+      ? [
+        product === "chrome" ? "--headless=new" : "--headless",
+        "--hide-scrollbars",
+      ]
+      : []),
+    ...args,
+  ];
+
+  if (DEBUG) {
+    console.log(`Launching: ${path} ${binArgs.join(" ")}`);
+  }
+
   const launch = new Deno.Command(path, {
-    args: [
-      "--remote-debugging-port=0",
-      "--no-first-run",
-      "--password-store=basic",
-      "--use-mock-keychain",
-      `--user-data-dir=${tempDir}`,
-      // "--no-startup-window",
-      ...(headless
-        ? [
-          product === "chrome" ? "--headless=new" : "--headless",
-          "--hide-scrollbars",
-        ]
-        : []),
-      ...args,
-    ],
+    args: binArgs,
     stderr: "piped",
   });
   const { process, endpoint } = await runCommand(launch);

src/debug.ts

@@ -0,0 +1,13 @@
+export const DEBUG = !!Deno.env.get("DEBUG");
+
+export function attachWs(ws: WebSocket) {
+  ws.addEventListener("message", (ev) => {
+    console.log(`<--`, ev.data);
+  });
+
+  const send = ws.send.bind(ws);
+  ws.send = (data) => {
+    console.log(`-->`, data);
+    return send(data);
+  };
+}