@hasna/browser 0.0.3 → 0.0.5

package/dist/server/index.js

@@ -273,6 +273,40 @@ function runMigrations(db) {
 var _db = null, _dbPath = null;
 var init_schema = () => {};
 
+// src/db/console-log.ts
+var exports_console_log = {};
+__export(exports_console_log, {
+  logConsoleMessage: () => logConsoleMessage,
+  getConsoleMessage: () => getConsoleMessage,
+  getConsoleLog: () => getConsoleLog,
+  clearConsoleLog: () => clearConsoleLog
+});
+import { randomUUID as randomUUID3 } from "crypto";
+function logConsoleMessage(data) {
+  const db = getDatabase();
+  const id = randomUUID3();
+  db.prepare("INSERT INTO console_log (id, session_id, level, message, source, line_number) VALUES (?, ?, ?, ?, ?, ?)").run(id, data.session_id, data.level, data.message, data.source ?? null, data.line_number ?? null);
+  return getConsoleMessage(id);
+}
+function getConsoleMessage(id) {
+  const db = getDatabase();
+  return db.query("SELECT * FROM console_log WHERE id = ?").get(id) ?? null;
+}
+function getConsoleLog(sessionId, level) {
+  const db = getDatabase();
+  if (level) {
+    return db.query("SELECT * FROM console_log WHERE session_id = ? AND level = ? ORDER BY timestamp ASC").all(sessionId, level);
+  }
+  return db.query("SELECT * FROM console_log WHERE session_id = ? ORDER BY timestamp ASC").all(sessionId);
+}
+function clearConsoleLog(sessionId) {
+  const db = getDatabase();
+  db.prepare("DELETE FROM console_log WHERE session_id = ?").run(sessionId);
+}
+var init_console_log = __esm(() => {
+  init_schema();
+});
+
 // node_modules/sharp/lib/is.js
 var require_is = __commonJS((exports, module) => {
   /*!
@@ -6867,7 +6901,7 @@ var init_snapshots = __esm(() => {
 });
 
 // src/server/index.ts
-import { join as join5 } from "path";
+import { join as join6 } from "path";
 import { existsSync as existsSync3 } from "fs";
 
 // src/lib/session.ts
@@ -6881,7 +6915,14 @@ import { randomUUID } from "crypto";
 function createSession(data) {
   const db = getDatabase();
   const id = randomUUID();
-  db.prepare("INSERT INTO sessions (id, engine, project_id, agent_id, start_url, name) VALUES (?, ?, ?, ?, ?, ?)").run(id, data.engine, data.projectId ?? null, data.agentId ?? null, data.startUrl ?? null, data.name ?? null);
+  let name = data.name ?? null;
+  if (name) {
+    const existing = db.query("SELECT id FROM sessions WHERE name = ?").get(name);
+    if (existing) {
+      name = `${name}-${id.slice(0, 6)}`;
+    }
+  }
+  db.prepare("INSERT INTO sessions (id, engine, project_id, agent_id, start_url, name) VALUES (?, ?, ?, ?, ?, ?)").run(id, data.engine, data.projectId ?? null, data.agentId ?? null, data.startUrl ?? null, name);
   return getSession(id);
 }
 function getSession(id) {
@@ -7044,15 +7085,414 @@ async function connectLightpanda(port) {
   }
 }
 
+// src/engines/bun-webview.ts
+import { join as join2 } from "path";
+import { mkdirSync as mkdirSync2 } from "fs";
+import { homedir as homedir2 } from "os";
+function isBunWebViewAvailable() {
+  return typeof globalThis.Bun !== "undefined" && typeof globalThis.Bun.WebView !== "undefined";
+}
+function getProfileDir(profileName) {
+  const base = process.env["BROWSER_DATA_DIR"] ?? join2(homedir2(), ".browser");
+  const dir = join2(base, "profiles", profileName);
+  mkdirSync2(dir, { recursive: true });
+  return dir;
+}
+
+class BunWebViewSession {
+  view;
+  _sessionId;
+  _eventListeners = new Map;
+  constructor(opts = {}) {
+    if (!isBunWebViewAvailable()) {
+      throw new Error("Bun.WebView is not available. Install Bun canary: bun upgrade --canary");
+    }
+    const BunWebView = globalThis.Bun.WebView;
+    const constructorOpts = {
+      width: opts.width ?? 1280,
+      height: opts.height ?? 720
+    };
+    if (opts.profile) {
+      constructorOpts.dataStore = { directory: getProfileDir(opts.profile) };
+    } else {
+      constructorOpts.dataStore = "ephemeral";
+    }
+    if (opts.onConsole) {
+      constructorOpts.console = opts.onConsole;
+    }
+    this.view = new BunWebView(constructorOpts);
+    this.view.onNavigated = (url) => {
+      this._emit("navigated", url);
+    };
+    this.view.onNavigationFailed = (error) => {
+      this._emit("navigationfailed", error);
+    };
+  }
+  async goto(url, opts) {
+    await this.view.navigate(url);
+    await new Promise((r) => setTimeout(r, 200));
+  }
+  async goBack() {
+    await this.view.goBack();
+  }
+  async goForward() {
+    await this.view.goForward();
+  }
+  async reload() {
+    await this.view.reload();
+  }
+  async evaluate(fnOrExpr, ...args) {
+    let expr;
+    if (typeof fnOrExpr === "function") {
+      const serializedArgs = args.map((a) => JSON.stringify(a)).join(", ");
+      expr = `(${fnOrExpr.toString()})(${serializedArgs})`;
+    } else {
+      expr = fnOrExpr;
+    }
+    return this.view.evaluate(expr);
+  }
+  async screenshot(opts) {
+    const uint8 = await this.view.screenshot();
+    return Buffer.from(uint8);
+  }
+  async click(selector, opts) {
+    await this.view.click(selector, opts ? { button: opts.button } : undefined);
+  }
+  async type(selector, text, opts) {
+    try {
+      await this.view.click(selector);
+    } catch {}
+    await this.view.type(text);
+  }
+  async fill(selector, value) {
+    await this.view.evaluate(`
+      (() => {
+        const el = document.querySelector(${JSON.stringify(selector)});
+        if (el) { el.value = ''; el.dispatchEvent(new Event('input')); }
+      })()
+    `);
+    await this.type(selector, value);
+  }
+  async press(key, opts) {
+    await this.view.press(key, opts);
+  }
+  async scroll(direction, amount) {
+    const dx = direction === "left" ? -amount : direction === "right" ? amount : 0;
+    const dy = direction === "up" ? -amount : direction === "down" ? amount : 0;
+    await this.view.scroll(dx, dy);
+  }
+  async scrollIntoView(selector) {
+    await this.view.scrollTo(selector);
+  }
+  async hover(selector) {
+    try {
+      await this.view.scrollTo(selector);
+    } catch {}
+  }
+  async resize(width, height) {
+    await this.view.resize(width, height);
+  }
+  async $(selector) {
+    const exists = await this.view.evaluate(`!!document.querySelector(${JSON.stringify(selector)})`);
+    if (!exists)
+      return null;
+    return {
+      textContent: async () => this.view.evaluate(`document.querySelector(${JSON.stringify(selector)})?.textContent ?? null`)
+    };
+  }
+  async $$(selector) {
+    const count = await this.view.evaluate(`document.querySelectorAll(${JSON.stringify(selector)}).length`);
+    return Array.from({ length: count }, (_, i) => ({
+      textContent: async () => this.view.evaluate(`document.querySelectorAll(${JSON.stringify(selector)})[${i}]?.textContent ?? null`)
+    }));
+  }
+  async inputValue(selector) {
+    return this.view.evaluate(`document.querySelector(${JSON.stringify(selector)})?.value ?? ''`);
+  }
+  async isChecked(selector) {
+    return this.view.evaluate(`!!(document.querySelector(${JSON.stringify(selector)})?.checked)`);
+  }
+  async isVisible(selector) {
+    return this.view.evaluate(`
+      (() => {
+        const el = document.querySelector(${JSON.stringify(selector)});
+        if (!el) return false;
+        const style = window.getComputedStyle(el);
+        return style.display !== 'none' && style.visibility !== 'hidden' && el.offsetWidth > 0;
+      })()
+    `);
+  }
+  async isEnabled(selector) {
+    return this.view.evaluate(`!(document.querySelector(${JSON.stringify(selector)})?.disabled)`);
+  }
+  async selectOption(selector, value) {
+    await this.view.evaluate(`
+      (() => {
+        const el = document.querySelector(${JSON.stringify(selector)});
+        if (el) {
+          el.value = ${JSON.stringify(value)};
+          el.dispatchEvent(new Event('change'));
+        }
+      })()
+    `);
+    return [value];
+  }
+  async check(selector) {
+    await this.view.evaluate(`
+      (() => {
+        const el = document.querySelector(${JSON.stringify(selector)});
+        if (el && !el.checked) { el.checked = true; el.dispatchEvent(new Event('change')); }
+      })()
+    `);
+  }
+  async uncheck(selector) {
+    await this.view.evaluate(`
+      (() => {
+        const el = document.querySelector(${JSON.stringify(selector)});
+        if (el && el.checked) { el.checked = false; el.dispatchEvent(new Event('change')); }
+      })()
+    `);
+  }
+  async setInputFiles(selector, files) {
+    throw new Error("File upload not supported in Bun.WebView engine. Use engine: 'playwright' instead.");
+  }
+  getByRole(role, opts) {
+    const name = opts?.name?.toString() ?? "";
+    const selector = name ? `[role="${role}"][aria-label*="${name}"], ${role}[aria-label*="${name}"]` : `[role="${role}"], ${role}`;
+    return {
+      click: (clickOpts) => this.click(selector, clickOpts),
+      fill: (value) => this.fill(selector, value),
+      check: () => this.check(selector),
+      uncheck: () => this.uncheck(selector),
+      isVisible: () => this.isVisible(selector),
+      textContent: () => this.view.evaluate(`document.querySelector(${JSON.stringify(selector)})?.textContent ?? null`),
+      inputValue: () => this.inputValue(selector),
+      first: () => ({
+        click: (clickOpts) => this.click(selector, clickOpts),
+        fill: (value) => this.fill(selector, value),
+        textContent: () => this.view.evaluate(`document.querySelector(${JSON.stringify(selector)})?.textContent ?? null`),
+        isVisible: () => this.isVisible(selector),
+        hover: () => this.hover(selector),
+        boundingBox: async () => null,
+        scrollIntoViewIfNeeded: () => this.scrollIntoView(selector),
+        evaluate: (fn) => this.view.evaluate(`(${fn.toString()})(document.querySelector(${JSON.stringify(selector)}))`),
+        waitFor: (opts2) => {
+          return new Promise((resolve, reject) => {
+            const timeout = opts2?.timeout ?? 1e4;
+            const start = Date.now();
+            const check = async () => {
+              const visible = await this.isVisible(selector);
+              if (visible)
+                return resolve();
+              if (Date.now() - start > timeout)
+                return reject(new Error(`Timeout waiting for ${selector}`));
+              setTimeout(check, 100);
+            };
+            check();
+          });
+        }
+      }),
+      count: async () => {
+        const count = await this.view.evaluate(`document.querySelectorAll(${JSON.stringify(selector)}).length`);
+        return count;
+      },
+      nth: (n) => ({
+        click: (clickOpts) => this.click(selector, clickOpts),
+        textContent: () => this.view.evaluate(`document.querySelectorAll(${JSON.stringify(selector)})[${n}]?.textContent ?? null`),
+        isVisible: () => this.isVisible(selector)
+      })
+    };
+  }
+  getByText(text, opts) {
+    const selector = opts?.exact ? `*:is(button, a, span, div, p, h1, h2, h3, h4, label)` : "*";
+    return {
+      first: () => ({
+        click: async (clickOpts) => {
+          await this.view.evaluate(`
+            (() => {
+              const text = ${JSON.stringify(text)};
+              const all = document.querySelectorAll('*');
+              for (const el of all) {
+                if (el.children.length === 0 && el.textContent?.trim() === text) {
+                  el.click(); return;
+                }
+              }
+              for (const el of all) {
+                if (el.textContent?.includes(text)) { el.click(); return; }
+              }
+            })()
+          `);
+        },
+        waitFor: (waitOpts) => {
+          const timeout = waitOpts?.timeout ?? 1e4;
+          return new Promise((resolve, reject) => {
+            const start = Date.now();
+            const check = async () => {
+              const found = await this.view.evaluate(`document.body?.textContent?.includes(${JSON.stringify(text)})`);
+              if (found)
+                return resolve();
+              if (Date.now() - start > timeout)
+                return reject(new Error(`Timeout: text "${text}" not found`));
+              setTimeout(check, 100);
+            };
+            check();
+          });
+        }
+      })
+    };
+  }
+  locator(selector) {
+    return {
+      click: (opts) => this.click(selector, opts),
+      fill: (value) => this.fill(selector, value),
+      scrollIntoViewIfNeeded: () => this.scrollIntoView(selector),
+      first: () => this.getByRole("*").first(),
+      evaluate: (fn) => this.view.evaluate(`(${fn.toString()})(document.querySelector(${JSON.stringify(selector)}))`),
+      waitFor: (opts) => {
+        const timeout = opts?.timeout ?? 1e4;
+        return new Promise((resolve, reject) => {
+          const start = Date.now();
+          const check = async () => {
+            const exists = await this.view.evaluate(`!!document.querySelector(${JSON.stringify(selector)})`);
+            if (exists)
+              return resolve();
+            if (Date.now() - start > timeout)
+              return reject(new Error(`Timeout: ${selector}`));
+            setTimeout(check, 100);
+          };
+          check();
+        });
+      }
+    };
+  }
+  url() {
+    return this.view.url;
+  }
+  async title() {
+    return this.view.title || await this.evaluate("document.title");
+  }
+  viewportSize() {
+    return { width: 1280, height: 720 };
+  }
+  async waitForLoadState(state, opts) {
+    await new Promise((r) => setTimeout(r, 200));
+  }
+  async waitForURL(pattern, opts) {
+    const timeout = opts?.timeout ?? 30000;
+    const start = Date.now();
+    while (Date.now() - start < timeout) {
+      const url = this.view.url;
+      const matches = pattern instanceof RegExp ? pattern.test(url) : url.includes(pattern);
+      if (matches)
+        return;
+      await new Promise((r) => setTimeout(r, 100));
+    }
+    throw new Error(`Timeout waiting for URL to match ${pattern}`);
+  }
+  async waitForSelector(selector, opts) {
+    const timeout = opts?.timeout ?? 1e4;
+    const start = Date.now();
+    while (Date.now() - start < timeout) {
+      const exists = await this.view.evaluate(`!!document.querySelector(${JSON.stringify(selector)})`);
+      if (exists)
+        return;
+      await new Promise((r) => setTimeout(r, 100));
+    }
+    throw new Error(`Timeout waiting for ${selector}`);
+  }
+  async setContent(html) {
+    await this.view.navigate(`data:text/html,${encodeURIComponent(html)}`);
+    await new Promise((r) => setTimeout(r, 100));
+  }
+  async content() {
+    return this.view.evaluate("document.documentElement.outerHTML");
+  }
+  async addInitScript(script) {
+    const expr = typeof script === "function" ? `(${script.toString()})()` : script;
+    await this.view.evaluate(expr);
+  }
+  keyboard = {
+    press: (key) => this.view.press(key)
+  };
+  context() {
+    return {
+      close: async () => {
+        await this.close();
+      },
+      newPage: async () => {
+        throw new Error("Multi-tab not supported in Bun.WebView. Use engine: 'playwright'");
+      },
+      cookies: async () => [],
+      addCookies: async (_) => {},
+      clearCookies: async () => {},
+      newCDPSession: async () => {
+        throw new Error("CDP session via context not available in Bun.WebView. Use view.cdp() when shipped.");
+      },
+      route: async (_pattern, _handler) => {
+        throw new Error("Network interception not supported in Bun.WebView. Use engine: 'cdp' or 'playwright'.");
+      },
+      unrouteAll: async () => {},
+      pages: () => [],
+      addInitScript: async (script) => {
+        await this.addInitScript(script);
+      }
+    };
+  }
+  on(event, handler) {
+    if (!this._eventListeners.has(event))
+      this._eventListeners.set(event, []);
+    this._eventListeners.get(event).push(handler);
+    return this;
+  }
+  off(event, handler) {
+    const listeners = this._eventListeners.get(event) ?? [];
+    this._eventListeners.set(event, listeners.filter((l) => l !== handler));
+    return this;
+  }
+  _emit(event, ...args) {
+    for (const handler of this._eventListeners.get(event) ?? []) {
+      try {
+        handler(...args);
+      } catch {}
+    }
+  }
+  async pdf(_opts) {
+    throw new Error("PDF generation not supported in Bun.WebView. Use engine: 'playwright'.");
+  }
+  coverage = {
+    startJSCoverage: async () => {},
+    stopJSCoverage: async () => [],
+    startCSSCoverage: async () => {},
+    stopCSSCoverage: async () => []
+  };
+  setSessionId(id) {
+    this._sessionId = id;
+  }
+  getSessionId() {
+    return this._sessionId;
+  }
+  getNativeView() {
+    return this.view;
+  }
+  async close() {
+    try {
+      await this.view.close();
+    } catch {}
+  }
+  [Symbol.asyncDispose]() {
+    return this.close();
+  }
+}
+
 // src/engines/selector.ts
 init_types();
 var ENGINE_MAP = {
-  ["scrape" /* SCRAPE */]: "lightpanda",
-  ["extract_links" /* EXTRACT_LINKS */]: "lightpanda",
-  ["status_check" /* STATUS_CHECK */]: "lightpanda",
+  ["scrape" /* SCRAPE */]: "bun",
+  ["extract_links" /* EXTRACT_LINKS */]: "bun",
+  ["status_check" /* STATUS_CHECK */]: "bun",
+  ["screenshot" /* SCREENSHOT */]: "bun",
+  ["spa_navigate" /* SPA_NAVIGATE */]: "bun",
   ["form_fill" /* FORM_FILL */]: "playwright",
-  ["spa_navigate" /* SPA_NAVIGATE */]: "playwright",
-  ["screenshot" /* SCREENSHOT */]: "playwright",
   ["auth_flow" /* AUTH_FLOW */]: "playwright",
   ["multi_tab" /* MULTI_TAB */]: "playwright",
   ["record_replay" /* RECORD_REPLAY */]: "playwright",
@@ -7066,6 +7506,14 @@ function selectEngine(useCase, explicit) {
   if (explicit && explicit !== "auto")
     return explicit;
   const preferred = ENGINE_MAP[useCase];
+  if (preferred === "bun") {
+    if (isBunWebViewAvailable())
+      return "bun";
+    if (useCase === "scrape" /* SCRAPE */ || useCase === "extract_links" /* EXTRACT_LINKS */ || useCase === "status_check" /* STATUS_CHECK */) {
+      return isLightpandaAvailable() ? "lightpanda" : "playwright";
+    }
+    return "playwright";
+  }
   if (preferred === "lightpanda" && !isLightpandaAvailable()) {
     return "playwright";
   }
@@ -7185,28 +7633,8 @@ function startHAR(page) {
   };
 }
 
-// src/db/console-log.ts
-init_schema();
-import { randomUUID as randomUUID3 } from "crypto";
-function logConsoleMessage(data) {
-  const db = getDatabase();
-  const id = randomUUID3();
-  db.prepare("INSERT INTO console_log (id, session_id, level, message, source, line_number) VALUES (?, ?, ?, ?, ?, ?)").run(id, data.session_id, data.level, data.message, data.source ?? null, data.line_number ?? null);
-  return getConsoleMessage(id);
-}
-function getConsoleMessage(id) {
-  const db = getDatabase();
-  return db.query("SELECT * FROM console_log WHERE id = ?").get(id) ?? null;
-}
-function getConsoleLog(sessionId, level) {
-  const db = getDatabase();
-  if (level) {
-    return db.query("SELECT * FROM console_log WHERE session_id = ? AND level = ? ORDER BY timestamp ASC").all(sessionId, level);
-  }
-  return db.query("SELECT * FROM console_log WHERE session_id = ? ORDER BY timestamp ASC").all(sessionId);
-}
-
 // src/lib/console.ts
+init_console_log();
 function enableConsoleCapture(page, sessionId) {
   const onConsole = (msg) => {
     const levelMap = {
@@ -7341,12 +7769,30 @@ function setupDialogHandler(page, sessionId) {
 
 // src/lib/session.ts
 var handles = new Map;
+function createBunProxy(view) {
+  return view;
+}
 async function createSession2(opts = {}) {
   const engine = opts.engine === "auto" || !opts.engine ? selectEngine(opts.useCase ?? "spa_navigate" /* SPA_NAVIGATE */, opts.engine) : opts.engine;
   const resolvedEngine = engine === "auto" ? "playwright" : engine;
-  let browser;
+  let browser = null;
+  let bunView = null;
   let page;
-  if (resolvedEngine === "lightpanda") {
+  if (resolvedEngine === "bun") {
+    if (!isBunWebViewAvailable()) {
+      console.warn("[browser] Bun.WebView requested but not available \u2014 falling back to playwright. Run: bun upgrade --canary");
+      browser = await launchPlaywright({ headless: opts.headless ?? true, viewport: opts.viewport, userAgent: opts.userAgent });
+      page = await getPage(browser, { viewport: opts.viewport, userAgent: opts.userAgent });
+    } else {
+      bunView = new BunWebViewSession({
+        width: opts.viewport?.width ?? 1280,
+        height: opts.viewport?.height ?? 720,
+        profile: opts.name ?? undefined
+      });
+      if (opts.stealth) {}
+      page = createBunProxy(bunView);
+    }
+  } else if (resolvedEngine === "lightpanda") {
     browser = await connectLightpanda();
     const context = await browser.newContext({ viewport: opts.viewport ?? { width: 1280, height: 720 } });
     page = await context.newPage();
@@ -7356,41 +7802,67 @@ async function createSession2(opts = {}) {
       viewport: opts.viewport,
       userAgent: opts.userAgent
     });
-    page = await getPage(browser, {
-      viewport: opts.viewport,
-      userAgent: opts.userAgent
-    });
+    page = await getPage(browser, { viewport: opts.viewport, userAgent: opts.userAgent });
   }
+  const sessionName = opts.name ?? (opts.startUrl ? (() => {
+    try {
+      return new URL(opts.startUrl).hostname;
+    } catch {
+      return;
+    }
+  })() : undefined);
   const session = createSession({
-    engine: resolvedEngine,
+    engine: bunView ? "bun" : browser ? resolvedEngine : resolvedEngine,
     projectId: opts.projectId,
     agentId: opts.agentId,
     startUrl: opts.startUrl,
-    name: opts.name ?? (opts.startUrl ? new URL(opts.startUrl).hostname : undefined)
+    name: sessionName
   });
-  if (opts.stealth) {
+  if (opts.stealth && !bunView) {
     try {
       await applyStealthPatches(page);
     } catch {}
   }
   const cleanups = [];
-  if (opts.captureNetwork !== false) {
-    try {
-      cleanups.push(enableNetworkLogging(page, session.id));
-    } catch {}
-  }
-  if (opts.captureConsole !== false) {
+  if (!bunView) {
+    if (opts.captureNetwork !== false) {
+      try {
+        cleanups.push(enableNetworkLogging(page, session.id));
+      } catch {}
+    }
+    if (opts.captureConsole !== false) {
+      try {
+        cleanups.push(enableConsoleCapture(page, session.id));
+      } catch {}
+    }
     try {
-      cleanups.push(enableConsoleCapture(page, session.id));
+      cleanups.push(setupDialogHandler(page, session.id));
     } catch {}
+  } else {
+    if (opts.captureConsole !== false) {
+      try {
+        const { logConsoleMessage: logConsoleMessage2 } = await Promise.resolve().then(() => (init_console_log(), exports_console_log));
+        await bunView.addInitScript(`
+          (() => {
+            const orig = { log: console.log, warn: console.warn, error: console.error, debug: console.debug, info: console.info };
+            ['log','warn','error','debug','info'].forEach(level => {
+              console[level] = (...args) => {
+                orig[level](...args);
+              };
+            });
+          })()
+        `);
+      } catch {}
+    }
   }
-  try {
-    cleanups.push(setupDialogHandler(page, session.id));
-  } catch {}
-  handles.set(session.id, { browser, page, engine: resolvedEngine, cleanups, tokenBudget: { total: 0, used: 0 } });
+  handles.set(session.id, { browser, bunView, page, engine: bunView ? "bun" : resolvedEngine, cleanups, tokenBudget: { total: 0, used: 0 } });
   if (opts.startUrl) {
     try {
-      await page.goto(opts.startUrl, { waitUntil: "domcontentloaded" });
+      if (bunView) {
+        await bunView.goto(opts.startUrl);
+      } else {
+        await page.goto(opts.startUrl, { waitUntil: "domcontentloaded" });
+      }
     } catch {}
   }
   return { session, page };
@@ -7400,7 +7872,11 @@ function getSessionPage(sessionId) {
   if (!handle)
     throw new SessionNotFoundError(sessionId);
   try {
-    handle.page.url();
+    if (handle.bunView) {
+      handle.bunView.url();
+    } else {
+      handle.page.url();
+    }
   } catch {
     handles.delete(sessionId);
     throw new SessionNotFoundError(sessionId);
@@ -7415,12 +7891,19 @@ async function closeSession2(sessionId) {
         cleanup();
       } catch {}
     }
-    try {
-      await handle.page.context().close();
-    } catch {}
-    try {
-      await closeBrowser(handle.browser);
-    } catch {}
+    if (handle.bunView) {
+      try {
+        await handle.bunView.close();
+      } catch {}
+    } else {
+      try {
+        await handle.page.context().close();
+      } catch {}
+      try {
+        if (handle.browser)
+          await closeBrowser(handle.browser);
+      } catch {}
+    }
     handles.delete(sessionId);
   }
   return closeSession(sessionId);
@@ -7562,9 +8045,9 @@ async function extract(page, opts = {}) {
 // src/lib/screenshot.ts
 init_types();
 var import_sharp = __toESM(require_lib(), 1);
-import { join as join2 } from "path";
-import { mkdirSync as mkdirSync2 } from "fs";
-import { homedir as homedir2 } from "os";
+import { join as join3 } from "path";
+import { mkdirSync as mkdirSync3 } from "fs";
+import { homedir as homedir3 } from "os";
 
 // src/db/gallery.ts
 init_schema();
@@ -7694,13 +8177,13 @@ function getGalleryStats(projectId) {
 
 // src/lib/screenshot.ts
 function getDataDir2() {
-  return process.env["BROWSER_DATA_DIR"] ?? join2(homedir2(), ".browser");
+  return process.env["BROWSER_DATA_DIR"] ?? join3(homedir3(), ".browser");
 }
 function getScreenshotDir(projectId) {
-  const base = join2(getDataDir2(), "screenshots");
+  const base = join3(getDataDir2(), "screenshots");
   const date = new Date().toISOString().split("T")[0];
-  const dir = projectId ? join2(base, projectId, date) : join2(base, date);
-  mkdirSync2(dir, { recursive: true });
+  const dir = projectId ? join3(base, projectId, date) : join3(base, date);
+  mkdirSync3(dir, { recursive: true });
   return dir;
 }
 async function compressBuffer(raw, format, quality, maxWidth) {
@@ -7715,7 +8198,7 @@ async function compressBuffer(raw, format, quality, maxWidth) {
   }
 }
 async function generateThumbnail(raw, dir, stem) {
-  const thumbPath = join2(dir, `${stem}.thumb.webp`);
+  const thumbPath = join3(dir, `${stem}.thumb.webp`);
   const thumbBuffer = await import_sharp.default(raw).resize({ width: 200, withoutEnlargement: true }).webp({ quality: 70, effort: 3 }).toBuffer();
   await Bun.write(thumbPath, thumbBuffer);
   return { path: thumbPath, base64: thumbBuffer.toString("base64") };
@@ -7734,27 +8217,45 @@ async function takeScreenshot(page, opts) {
       type: "png"
     };
     let rawBuffer;
+    const isBunView = typeof page.getNativeView === "function";
     if (opts?.selector) {
-      const el = await page.$(opts.selector);
-      if (!el)
-        throw new BrowserError(`Element not found: ${opts.selector}`, "ELEMENT_NOT_FOUND");
-      rawBuffer = await el.screenshot(rawOpts);
+      if (isBunView) {
+        const uint8 = await page.screenshot();
+        rawBuffer = Buffer.from(uint8 instanceof Uint8Array ? uint8 : await uint8);
+      } else {
+        const el = await page.$(opts.selector);
+        if (!el)
+          throw new BrowserError(`Element not found: ${opts.selector}`, "ELEMENT_NOT_FOUND");
+        rawBuffer = await el.screenshot(rawOpts);
+      }
+    } else if (isBunView) {
+      const uint8 = await page.screenshot();
+      rawBuffer = Buffer.from(uint8 instanceof Uint8Array ? uint8 : await uint8);
     } else {
       rawBuffer = await page.screenshot(rawOpts);
     }
     const originalSizeBytes = rawBuffer.length;
     let finalBuffer;
-    if (compress && format !== "png") {
-      finalBuffer = await compressBuffer(rawBuffer, format, quality ?? 82, maxWidth);
-    } else if (compress && format === "png") {
-      finalBuffer = await compressBuffer(rawBuffer, "png", quality ?? 9, maxWidth);
-    } else {
+    let compressed = true;
+    let fallback = false;
+    try {
+      if (compress && format !== "png") {
+        finalBuffer = await compressBuffer(rawBuffer, format, quality ?? 82, maxWidth);
+      } else if (compress && format === "png") {
+        finalBuffer = await compressBuffer(rawBuffer, "png", quality ?? 9, maxWidth);
+      } else {
+        finalBuffer = rawBuffer;
+        compressed = false;
+      }
+    } catch (sharpErr) {
+      fallback = true;
+      compressed = false;
       finalBuffer = rawBuffer;
     }
     const compressedSizeBytes = finalBuffer.length;
     const compressionRatio = originalSizeBytes > 0 ? compressedSizeBytes / originalSizeBytes : 1;
     const ext = format;
-    const screenshotPath = opts?.path ?? join2(dir, `${stem}.${ext}`);
+    const screenshotPath = opts?.path ?? join3(dir, `${stem}.${ext}`);
     await Bun.write(screenshotPath, finalBuffer);
     let thumbnailPath;
     let thumbnailBase64;
@@ -7776,7 +8277,8 @@ async function takeScreenshot(page, opts) {
       compressed_size_bytes: compressedSizeBytes,
       compression_ratio: compressionRatio,
       thumbnail_path: thumbnailPath,
-      thumbnail_base64: thumbnailBase64
+      thumbnail_base64: thumbnailBase64,
+      ...fallback ? { fallback: true, compressed: false } : {}
     };
     if (opts?.track !== false) {
       try {
@@ -8152,19 +8654,20 @@ function listProjects() {
 }
 
 // src/server/index.ts
+init_console_log();
 init_recordings();
 
 // src/lib/downloads.ts
-import { join as join3, basename, extname } from "path";
-import { mkdirSync as mkdirSync3, existsSync, readdirSync, statSync, unlinkSync, copyFileSync, writeFileSync, readFileSync } from "fs";
-import { homedir as homedir3 } from "os";
+import { join as join4, basename, extname } from "path";
+import { mkdirSync as mkdirSync4, existsSync, readdirSync, statSync, unlinkSync, copyFileSync, writeFileSync, readFileSync } from "fs";
+import { homedir as homedir4 } from "os";
 function getDataDir3() {
-  return process.env["BROWSER_DATA_DIR"] ?? join3(homedir3(), ".browser");
+  return process.env["BROWSER_DATA_DIR"] ?? join4(homedir4(), ".browser");
 }
 function getDownloadsDir(sessionId) {
-  const base = join3(getDataDir3(), "downloads");
-  const dir = sessionId ? join3(base, sessionId) : base;
-  mkdirSync3(dir, { recursive: true });
+  const base = join4(getDataDir3(), "downloads");
+  const dir = sessionId ? join4(base, sessionId) : base;
+  mkdirSync4(dir, { recursive: true });
   return dir;
 }
 function metaPath(filePath) {
@@ -8180,7 +8683,7 @@ function listDownloads(sessionId) {
     for (const entry of entries) {
       if (entry.endsWith(".meta.json"))
         continue;
-      const full = join3(d, entry);
+      const full = join4(d, entry);
       const stat = statSync(full);
       if (stat.isDirectory()) {
         scanDir(full);
@@ -8241,9 +8744,9 @@ function cleanStaleDownloads(olderThanDays = 7) {
 
 // src/lib/gallery-diff.ts
 var import_sharp2 = __toESM(require_lib(), 1);
-import { join as join4 } from "path";
-import { mkdirSync as mkdirSync4 } from "fs";
-import { homedir as homedir4 } from "os";
+import { join as join5 } from "path";
+import { mkdirSync as mkdirSync5 } from "fs";
+import { homedir as homedir5 } from "os";
 async function diffImages(path1, path2) {
   const img1 = import_sharp2.default(path1);
   const img2 = import_sharp2.default(path2);
@@ -8274,10 +8777,10 @@ async function diffImages(path1, path2) {
       diffBuffer[i + 2] = Math.round(raw1[i + 2] * 0.4);
     }
   }
-  const dataDir = process.env["BROWSER_DATA_DIR"] ?? join4(homedir4(), ".browser");
-  const diffDir = join4(dataDir, "diffs");
-  mkdirSync4(diffDir, { recursive: true });
-  const diffPath = join4(diffDir, `diff-${Date.now()}.webp`);
+  const dataDir = process.env["BROWSER_DATA_DIR"] ?? join5(homedir5(), ".browser");
+  const diffDir = join5(dataDir, "diffs");
+  mkdirSync5(diffDir, { recursive: true });
+  const diffPath = join5(diffDir, `diff-${Date.now()}.webp`);
   const diffImageBuffer = await import_sharp2.default(diffBuffer, { raw: { width: w, height: h, channels } }).webp({ quality: 85 }).toBuffer();
   await Bun.write(diffPath, diffImageBuffer);
   return {
@@ -8564,13 +9067,13 @@ var server = Bun.serve({
         const id = path.split("/")[3];
         return ok({ deleted: deleteDownload(id) });
       }
-      const dashboardDist = join5(import.meta.dir, "../../dashboard/dist");
+      const dashboardDist = join6(import.meta.dir, "../../dashboard/dist");
       if (existsSync3(dashboardDist)) {
-        const filePath = path === "/" ? join5(dashboardDist, "index.html") : join5(dashboardDist, path);
+        const filePath = path === "/" ? join6(dashboardDist, "index.html") : join6(dashboardDist, path);
         if (existsSync3(filePath)) {
           return new Response(Bun.file(filePath), { headers: CORS_HEADERS });
         }
-        return new Response(Bun.file(join5(dashboardDist, "index.html")), { headers: CORS_HEADERS });
+        return new Response(Bun.file(join6(dashboardDist, "index.html")), { headers: CORS_HEADERS });
       }
       if (path === "/" || path === "") {
         return new Response("@hasna/browser REST API running. Dashboard not built.", {