Feat support existing ws endpoint

src/browser.ts

@@ -70,10 +70,14 @@ export interface BrowserOptions {
 export class Browser {
   #options: BrowserOptions;
   #celestial: Celestial;
-  #process: Deno.ChildProcess;
+  #process: Deno.ChildProcess | null;
   readonly pages: Page[] = [];
 
-  constructor(ws: WebSocket, process: Deno.ChildProcess, opts: BrowserOptions) {
+  constructor(
+    ws: WebSocket,
+    process: Deno.ChildProcess | null,
+    opts: BrowserOptions,
+  ) {
     this.#celestial = new Celestial(ws);
     this.#process = process;
     this.#options = opts;
@@ -84,8 +88,12 @@ export class Browser {
    */
   async close() {
     await this.#celestial.close();
-    this.#process.kill();
-    await this.#process.status;
+    this.#process?.kill();
+    await this.#process?.status;
+    // If we use a remote connection, then close all pages websockets
+    if (!this.#process) {
+      await Promise.allSettled(this.pages.map((page) => page.close()));
+    }
   }
 
   /**
@@ -96,7 +104,8 @@ export class Browser {
       url: "",
     });
     const browserWsUrl = new URL(this.#celestial.ws.url);
-    const wsUrl = `${browserWsUrl.origin}/devtools/page/${targetId}`;
+    const wsUrl =
+      `${browserWsUrl.origin}/devtools/page/${targetId}${browserWsUrl.search}`;
     const websocket = new WebSocket(wsUrl);
     await websocketReady(websocket);
 
@@ -143,13 +152,21 @@ export class Browser {
   wsEndpoint() {
     return this.#celestial.ws.url;
   }
+
+  /**
+   * The browser's websocket ready state
+   */
+  wsReadyState() {
+    return this.#celestial.ws.readyState;
+  }
 }
 
 export interface LaunchOptions {
   headless?: boolean;
   path?: string;
   product?: "chrome" | "firefox";
   args?: string[];
+  browserWSEndpoint?: string;
 }
 
 /**
@@ -159,6 +176,7 @@ export async function launch(opts?: LaunchOptions) {
   const headless = opts?.headless ?? true;
   const product = opts?.product ?? "chrome";
   const args = opts?.args ?? [];
+  const browserWSEndpoint = opts?.browserWSEndpoint;
   let path = opts?.path;
 
   if (!path) {
@@ -170,6 +188,13 @@ export async function launch(opts?: LaunchOptions) {
     product,
   };
 
+  // Connect to endpoint directly if one was specified
+  if (browserWSEndpoint) {
+    const ws = new WebSocket(browserWSEndpoint);
+    await websocketReady(ws);
+    return new Browser(ws, null, options);
+  }
+
   // Launch child process
   const launch = new Deno.Command(path, {
     args: [

tests/existing_ws_endpoint_test.ts

@@ -0,0 +1,33 @@
+import { assertEquals } from "https://deno.land/[email protected]/assert/assert_equals.ts";
+import { launch } from "../mod.ts";
+import { assertThrows } from "https://deno.land/[email protected]/assert/assert_throws.ts";
+
+Deno.test("Test existing ws endpoint", async () => {
+  // Spawn one browser instance and spawn another one connecting to the first one
+  const a = await launch();
+  const b = await launch({ browserWSEndpoint: a.wsEndpoint() });
+
+  // Test that second instance works without any process attached
+  const page = await b.newPage("http://example.com");
+  await page.waitForSelector("h1");
+
+  // Close first instance and ensure that b instance is inactive too
+  await a.close();
+  assertEquals(a.wsReadyState(), WebSocket.CLOSED);
+  assertEquals(b.wsReadyState(), WebSocket.CLOSED);
+});
+
+Deno.test("Ensure pages are properly closed when closing existing endpoint", async () => {
+  // Spawn one browser instance and spawn another one connecting to the first one
+  const a = await launch();
+  const b = await launch({ browserWSEndpoint: a.wsEndpoint() });
+
+  // Ensure closing existing endpoint properly clean resources
+  await b.newPage("http://example.com");
+  await b.newPage("http://example.com");
+  await b.close();
+  assertThrows(() => b.pages[0].close(), "Page has already been closed");
+  assertThrows(() => b.pages[1].close(), "Page has already been closed");
+  assertEquals(b.wsReadyState(), WebSocket.CLOSED);
+  await a.close();
+});