@btraut/browser-bridge 0.12.0 → 0.13.0

package/extension/assets/ui.css

@@ -68,111 +68,35 @@ body.bb-page.bb-page--popup {
   padding: 2px;
 }
 
-.bb-health {
+.bb-connection {
   border: 1px solid var(--bb-border-2);
   border-radius: var(--bb-radius-sm);
   background: var(--bb-bg);
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06);
   padding: 10px 12px;
   margin: 0 0 10px;
-}
-
-.bb-health-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  margin-bottom: 8px;
-}
-
-.bb-health-label {
-  font-size: 12px;
-  font-weight: 700;
-  letter-spacing: 0.04em;
-  color: var(--bb-ink-2);
-  text-transform: uppercase;
-}
-
-.bb-health-state {
-  border: 1px solid var(--bb-border);
-  border-radius: 999px;
-  padding: 2px 8px;
-  font-size: 11px;
-  font-weight: 700;
-  text-transform: capitalize;
-  color: var(--bb-ink);
-  background: rgba(0, 0, 0, 0.04);
-}
-
-.bb-health-state[data-state='connected'] {
-  color: #1f6f3f;
-  border-color: rgba(31, 111, 63, 0.35);
-  background: rgba(31, 111, 63, 0.12);
 }
 
-.bb-health-state[data-state='connecting'],
-.bb-health-state[data-state='backoff'] {
-  color: #8a5200;
-  border-color: rgba(138, 82, 0, 0.35);
-  background: rgba(138, 82, 0, 0.12);
-}
-
-.bb-health-state[data-state='disconnected'] {
-  color: #a22b2b;
-  border-color: rgba(162, 43, 43, 0.35);
-  background: rgba(162, 43, 43, 0.12);
-}
-
-.bb-health-grid {
-  display: grid;
-  grid-template-columns: auto 1fr;
-  gap: 6px 8px;
-  margin: 0;
-}
-
-.bb-health-grid dt {
-  margin: 0;
-  font-size: 11px;
-  color: var(--bb-ink-2);
-}
-
-.bb-health-grid dd {
-  margin: 0;
-  font-size: 12px;
-  color: var(--bb-ink);
-  overflow-wrap: anywhere;
-}
-
-.bb-health-error {
-  min-height: 14px;
-  margin: 8px 0 0;
-  font-size: 11px;
-  color: #a22b2b;
-}
-
-.bb-health-actions {
-  margin-top: 6px;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.bb-health-copy {
-  border: 1px solid var(--bb-border);
-  border-radius: 8px;
-  background: var(--bb-bg);
+.bb-connection-label {
+  font-size: 14px;
+  font-weight: 600;
   color: var(--bb-ink);
-  padding: 5px 8px;
-  font-size: 12px;
-  cursor: pointer;
 }
 
-.bb-health-copy:hover {
-  background: var(--bb-hover);
+.bb-connection-dot {
+  width: 11px;
+  height: 11px;
+  border-radius: 999px;
+  border: 1px solid rgba(162, 43, 43, 0.35);
+  background: #c93939;
 }
 
-.bb-health-copy-status {
-  font-size: 11px;
-  color: var(--bb-ink-2);
+.bb-connection-dot[data-connected='true'] {
+  border-color: rgba(31, 111, 63, 0.4);
+  background: #2b9a52;
 }
 
 .bb-popup-head {

package/extension/dist/background.js

@@ -1,3 +1,57 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+
+// packages/shared/dist/contract-version.js
+var require_contract_version = __commonJS({
+  "packages/shared/dist/contract-version.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.resolveContractVersionMismatch = exports.DRIVE_WS_PROTOCOL_VERSION = exports.HTTP_CONTRACT_VERSION = exports.HTTP_CONTRACT_VERSION_HEADER = void 0;
+    exports.HTTP_CONTRACT_VERSION_HEADER = "x-browser-bridge-contract-version";
+    exports.HTTP_CONTRACT_VERSION = "2026-02-17.1";
+    exports.DRIVE_WS_PROTOCOL_VERSION = "2026-02-17.1";
+    var resolveContractVersionMismatch = (receivedVersion) => {
+      if (!receivedVersion || receivedVersion.trim().length === 0) {
+        return void 0;
+      }
+      if (receivedVersion === exports.HTTP_CONTRACT_VERSION) {
+        return void 0;
+      }
+      return {
+        expected: exports.HTTP_CONTRACT_VERSION,
+        received: receivedVersion
+      };
+    };
+    exports.resolveContractVersionMismatch = resolveContractVersionMismatch;
+  }
+});
+
+// packages/extension/src/background.ts
+var import_contract_version = __toESM(require_contract_version());
+
 // packages/extension/src/error-sanitizer.ts
 var TRAILING_PUNCTUATION_RE = /[.,;:!?]+$/;
 var stripTrailingPunctuation = (value) => {
@@ -97,7 +151,9 @@ var SITE_ALLOWLIST_KEY = "siteAllowlist";
 var PERMISSION_PROMPT_WAIT_MS_KEY = "permissionPromptWaitMs";
 var DEFAULT_PERMISSION_PROMPT_WAIT_MS = 3e4;
 var SITE_PERMISSIONS_MODE_KEY = "sitePermissionsMode";
+var DEBUGGER_CAPABILITY_ENABLED_KEY = "debuggerCapabilityEnabled";
 var DEFAULT_SITE_PERMISSIONS_MODE = "granular";
+var DEFAULT_DEBUGGER_CAPABILITY_ENABLED = false;
 var siteKeyFromUrl = (rawUrl) => {
   if (!rawUrl || typeof rawUrl !== "string") {
     return null;
@@ -199,6 +255,27 @@ var readPermissionPromptWaitMs = async () => {
     );
   });
 };
+var readDebuggerCapabilityEnabled = async () => {
+  return await new Promise((resolve) => {
+    chrome.storage.local.get(
+      [DEBUGGER_CAPABILITY_ENABLED_KEY],
+      (result) => {
+        const raw = result?.[DEBUGGER_CAPABILITY_ENABLED_KEY];
+        if (typeof raw === "boolean") {
+          resolve(raw);
+          return;
+        }
+        try {
+          chrome.storage.local.set({
+            [DEBUGGER_CAPABILITY_ENABLED_KEY]: DEFAULT_DEBUGGER_CAPABILITY_ENABLED
+          });
+        } catch {
+        }
+        resolve(DEFAULT_DEBUGGER_CAPABILITY_ENABLED);
+      }
+    );
+  });
+};
 var isSiteAllowed = async (siteKey) => {
   const key = normalizeSiteKey(siteKey);
   const allowlist = await readAllowlistRaw();
@@ -488,6 +565,8 @@ var ConnectionStateTracker = class {
 var DEFAULT_CORE_PORT = 3210;
 var CORE_PORT_KEY = "corePort";
 var CORE_WS_PATH = "/drive";
+var CORE_HEALTH_PATH = "/health";
+var CORE_HEALTH_TIMEOUT_MS = 1200;
 var DEBUGGER_PROTOCOL_VERSION = "1.3";
 var DEBUGGER_IDLE_TIMEOUT_KEY = "debuggerIdleTimeoutMs";
 var DEFAULT_DEBUGGER_IDLE_TIMEOUT_MS = 15e3;
@@ -499,9 +578,62 @@ var HISTORY_POST_NAV_DOM_GRACE_TIMEOUT_MS = 2e3;
 var AGENT_TAB_ID_KEY = "agentTabId";
 var AGENT_TAB_GROUP_TITLE = "Browser Bridge";
 var AGENT_TAB_BOOTSTRAP_PATH = "agent-tab.html";
+var AGENT_TAB_FAVICON_ASSET_PATH = "assets/icons/icon-32.png";
+var AGENT_TAB_BRANDING_ACTION = "drive.agent_tab_branding";
+var AGENT_TAB_GROUP_RETRY_DELAYS_MS = [0, 120, 300];
+var AGENT_TAB_BRANDING_TIMEOUT_MS = 1500;
+var BASE_NEGOTIATED_CAPABILITIES = Object.freeze({
+  "drive.navigate": true,
+  "drive.go_back": true,
+  "drive.go_forward": true,
+  "drive.click": true,
+  "drive.hover": true,
+  "drive.select": true,
+  "drive.type": true,
+  "drive.fill_form": true,
+  "drive.drag": true,
+  "drive.handle_dialog": true,
+  "drive.key": true,
+  "drive.key_press": true,
+  "drive.scroll": true,
+  "drive.screenshot": true,
+  "drive.wait_for": true,
+  "drive.tab_list": true,
+  "drive.tab_activate": true,
+  "drive.tab_close": true,
+  "drive.ping": true
+});
+var DEBUGGER_CAPABILITY_ACTIONS = [
+  "debugger.attach",
+  "debugger.detach",
+  "debugger.command"
+];
+var buildNegotiatedCapabilities = (debuggerCapabilityEnabled) => {
+  const capabilities = {
+    ...BASE_NEGOTIATED_CAPABILITIES
+  };
+  for (const action of DEBUGGER_CAPABILITY_ACTIONS) {
+    capabilities[action] = debuggerCapabilityEnabled;
+  }
+  return capabilities;
+};
+var debuggerCapabilityDisabledError = () => {
+  return {
+    code: "ATTACH_DENIED",
+    message: "Debugger capability is disabled. Enable debugger-based inspect in extension options and retry.",
+    retryable: false,
+    details: {
+      reason: "debugger_capability_disabled",
+      next_step: "Open Browser Bridge extension options, enable debugger-based inspect, then retry."
+    }
+  };
+};
 var getAgentTabBootstrapUrl = () => {
   return typeof chrome.runtime?.getURL === "function" ? chrome.runtime.getURL(AGENT_TAB_BOOTSTRAP_PATH) : AGENT_TAB_BOOTSTRAP_PATH;
 };
+var getAgentTabFaviconUrl = () => {
+  return typeof chrome.runtime?.getURL === "function" ? chrome.runtime.getURL(AGENT_TAB_FAVICON_ASSET_PATH) : AGENT_TAB_FAVICON_ASSET_PATH;
+};
 var nowIso = () => (/* @__PURE__ */ new Date()).toISOString();
 var makeEventId = /* @__PURE__ */ (() => {
   let counter = 0;
@@ -870,23 +1002,38 @@ var ensureAgentTabGroup = async (tabId, windowId) => {
   if (!chrome.tabGroups || typeof chrome.tabGroups.update !== "function") {
     return;
   }
-  try {
-    const groupId = await wrapChromeCallback(
-      (callback) => chrome.tabs.group(
-        { tabIds: tabId, createProperties: { windowId } },
-        callback
-      )
-    );
-    await wrapChromeVoid(
-      (callback) => chrome.tabGroups.update(
-        groupId,
-        { title: AGENT_TAB_GROUP_TITLE },
-        () => callback()
-      )
-    );
-  } catch (error) {
-    console.debug("Failed to create/update agent tab group.", error);
+  let lastError;
+  for (const retryDelayMs of AGENT_TAB_GROUP_RETRY_DELAYS_MS) {
+    if (retryDelayMs > 0) {
+      await delayMs(retryDelayMs);
+    }
+    try {
+      const groupId = await wrapChromeCallback(
+        (callback) => chrome.tabs.group(
+          { tabIds: tabId, createProperties: { windowId } },
+          callback
+        )
+      );
+      await wrapChromeVoid(
+        (callback) => chrome.tabGroups.update(
+          groupId,
+          { title: AGENT_TAB_GROUP_TITLE },
+          () => callback()
+        )
+      );
+      return;
+    } catch (error) {
+      lastError = error;
+    }
+  }
+  console.debug("Failed to create/update agent tab group.", lastError);
+};
+var ensureAgentTabGroupForTab = async (tabId, tab) => {
+  const windowId = tab.windowId;
+  if (typeof windowId !== "number") {
+    return;
   }
+  await ensureAgentTabGroup(tabId, windowId);
 };
 var createAgentWindow = async () => {
   const created = await wrapChromeCallback(
@@ -941,6 +1088,8 @@ var getOrCreateAgentTabId = async () => {
       if (typeof url === "string" && isRestrictedUrl(url)) {
         throw new Error(`Agent tab points at restricted URL: ${url}`);
       }
+      await ensureAgentTabGroupForTab(agentTabId, tab);
+      void refreshAgentTabBranding(agentTabId);
       return agentTabId;
     } catch {
       clearAgentTarget();
@@ -957,6 +1106,8 @@ var getOrCreateAgentTabId = async () => {
       agentTabId = stored;
       ensureLastActiveAt(stored);
       markTabActive(stored);
+      await ensureAgentTabGroupForTab(stored, tab);
+      void refreshAgentTabBranding(stored);
       return stored;
     } catch {
       await writeAgentTabId(null);
@@ -1062,6 +1213,17 @@ var sendToTab = async (tabId, action, params, options) => {
     }
   };
 };
+var refreshAgentTabBranding = async (tabId) => {
+  const result = await sendToTab(
+    tabId,
+    AGENT_TAB_BRANDING_ACTION,
+    { favicon_url: getAgentTabFaviconUrl() },
+    { timeoutMs: AGENT_TAB_BRANDING_TIMEOUT_MS }
+  );
+  if (!result.ok) {
+    return;
+  }
+};
 var waitForHistoryNavigationSignal = async (tabId, timeoutMs) => {
   return await new Promise((resolve, reject) => {
     let timeout;
@@ -1153,6 +1315,7 @@ var getWsEndpoint = async () => {
     url: `ws://${endpoint.host}:${endpoint.port}${CORE_WS_PATH}`
   };
 };
+var getHealthEndpoint = (endpoint) => `http://${endpoint.host}:${endpoint.port}${CORE_HEALTH_PATH}`;
 var DriveSocket = class {
   constructor() {
     this.socket = null;
@@ -1209,6 +1372,16 @@ var DriveSocket = class {
   async connect() {
     const { endpoint, url } = await getWsEndpoint();
     this.connection.setEndpoint(endpoint);
+    const health = await this.checkCoreHealth(endpoint);
+    if (!health.ok) {
+      this.connection.markDisconnected();
+      this.recordConnectionFailure(
+        "core unavailable",
+        new Error(health.detail)
+      );
+      this.scheduleReconnect();
+      return;
+    }
     try {
       const socket2 = new WebSocket(url);
       this.socket = socket2;
@@ -1241,9 +1414,47 @@ var DriveSocket = class {
       this.scheduleReconnect();
     }
   }
+  async checkCoreHealth(endpoint) {
+    const controller = new AbortController();
+    const timeoutId = self.setTimeout(() => {
+      controller.abort();
+    }, CORE_HEALTH_TIMEOUT_MS);
+    try {
+      const response = await fetch(getHealthEndpoint(endpoint), {
+        method: "GET",
+        cache: "no-store",
+        signal: controller.signal
+      });
+      if (!response.ok) {
+        return {
+          ok: false,
+          detail: `health returned HTTP ${response.status}`
+        };
+      }
+      return { ok: true, detail: "ok" };
+    } catch (error) {
+      if (error instanceof DOMException && error.name === "AbortError") {
+        return {
+          ok: false,
+          detail: `health timed out after ${CORE_HEALTH_TIMEOUT_MS}ms`
+        };
+      }
+      return {
+        ok: false,
+        detail: error instanceof Error && error.message.length > 0 ? error.message : "health check failed"
+      };
+    } finally {
+      clearTimeout(timeoutId);
+    }
+  }
   getConnectionStatus() {
     return this.connection.getStatus();
   }
+  refreshCapabilities() {
+    void this.sendHello().catch((error) => {
+      console.error("DriveSocket refreshCapabilities failed:", error);
+    });
+  }
   handleSocketUnavailable(socket2, reason) {
     if (this.socket !== socket2) {
       return;
@@ -1273,6 +1484,7 @@ var DriveSocket = class {
   async sendHello() {
     const manifest = chrome.runtime.getManifest();
     const endpoint = await readCoreEndpointConfig();
+    const debuggerCapabilityEnabled = await readDebuggerCapabilityEnabled();
     let tabs = [];
     try {
       tabs = await queryTabs();
@@ -1282,6 +1494,8 @@ var DriveSocket = class {
     }
     const params = {
       version: manifest.version,
+      protocol_version: import_contract_version.DRIVE_WS_PROTOCOL_VERSION,
+      capabilities: buildNegotiatedCapabilities(debuggerCapabilityEnabled),
       core_host: endpoint.host,
       core_port: endpoint.port,
       core_port_source: endpoint.portSource,
@@ -1356,6 +1570,19 @@ var DriveSocket = class {
       });
     }
   }
+  async refreshDebuggerCapabilityState() {
+    const enabled = await readDebuggerCapabilityEnabled();
+    if (!enabled) {
+      await this.detachAllDebuggerSessions();
+    }
+    this.refreshCapabilities();
+  }
+  async handleDebuggerCapabilityChange(enabled) {
+    if (!enabled) {
+      await this.detachAllDebuggerSessions();
+    }
+    this.refreshCapabilities();
+  }
   async handleRequest(message) {
     let driveMessage = null;
     let gatedSiteKey = null;
@@ -1394,6 +1621,15 @@ var DriveSocket = class {
         return;
       }
       if (message.action.startsWith("debugger.")) {
+        if (!await readDebuggerCapabilityEnabled()) {
+          this.sendMessage({
+            id: message.id,
+            action: message.action,
+            status: "error",
+            error: sanitizeDriveErrorInfo(debuggerCapabilityDisabledError())
+          });
+          return;
+        }
         await this.handleDebuggerRequest(message);
         return;
       }
@@ -1405,8 +1641,6 @@ var DriveSocket = class {
         "drive.navigate",
         "drive.go_back",
         "drive.go_forward",
-        "drive.back",
-        "drive.forward",
         "drive.click",
         "drive.hover",
         "drive.select",
@@ -1599,13 +1833,14 @@ var DriveSocket = class {
               return;
             }
           }
+          if (tabId === agentTabId) {
+            void refreshAgentTabBranding(tabId);
+          }
           respondOk({ ok: true });
           return;
         }
         case "drive.go_back":
-        case "drive.back":
-        case "drive.go_forward":
-        case "drive.forward": {
+        case "drive.go_forward": {
           const params = message.params ?? {};
           let tabId = params.tab_id;
           if (tabId !== void 0 && typeof tabId !== "number") {
@@ -1651,6 +1886,9 @@ var DriveSocket = class {
               return;
             }
           }
+          if (tabId === agentTabId) {
+            void refreshAgentTabBranding(tabId);
+          }
           respondOk({ ok: true });
           return;
         }
@@ -3036,6 +3274,9 @@ var DriveSocket = class {
     }
   }
   async handleDebuggerEvent(source, method, params) {
+    if (!await readDebuggerCapabilityEnabled()) {
+      return;
+    }
     const tabId = source.tabId;
     if (typeof tabId !== "number") {
       return;
@@ -3054,6 +3295,9 @@ var DriveSocket = class {
       return;
     }
     this.clearDebuggerSession(tabId);
+    if (!await readDebuggerCapabilityEnabled()) {
+      return;
+    }
     this.sendDebuggerEvent({
       tab_id: tabId,
       method: "Debugger.detached",
@@ -3192,6 +3436,15 @@ var DriveSocket = class {
     }
     return null;
   }
+  async detachAllDebuggerSessions() {
+    const tabIds = Array.from(this.debuggerSessions.keys());
+    for (const tabId of tabIds) {
+      const error = await this.detachDebugger(tabId);
+      if (error) {
+        console.warn("DriveSocket detachDebugger failed:", tabId, error);
+      }
+    }
+  }
   async sendDebuggerCommand(tabId, method, params, timeoutMs) {
     return await new Promise((resolve, reject) => {
       let finished = false;
@@ -3322,14 +3575,53 @@ chrome.debugger.onDetach.addListener(
 );
 chrome.runtime.onMessage.addListener(
   (message, _sender, sendResponse) => {
-    if (!message || typeof message !== "object" || message.action !== "drive.connection_status") {
+    if (!message || typeof message !== "object") {
       return void 0;
     }
-    sendResponse({
-      ok: true,
-      result: socket.getConnectionStatus()
+    const action = message.action;
+    if (action === "drive.connection_status") {
+      sendResponse({
+        ok: true,
+        result: socket.getConnectionStatus()
+      });
+      return true;
+    }
+    if (action === "drive.refresh_capabilities") {
+      void socket.refreshDebuggerCapabilityState().then(() => {
+        sendResponse({ ok: true, result: { refreshed: true } });
+      }).catch((error) => {
+        const message2 = error instanceof Error ? error.message : "Failed to refresh capabilities.";
+        sendResponse({ ok: false, error: { message: message2 } });
+      });
+      return true;
+    }
+    return void 0;
+  }
+);
+chrome.storage.onChanged.addListener(
+  (changes, areaName) => {
+    if (areaName !== "local") {
+      return;
+    }
+    const debuggerChange = changes[DEBUGGER_CAPABILITY_ENABLED_KEY];
+    if (!debuggerChange) {
+      return;
+    }
+    if (typeof debuggerChange.newValue === "boolean") {
+      void socket.handleDebuggerCapabilityChange(debuggerChange.newValue).catch((error) => {
+        console.error(
+          "DriveSocket handleDebuggerCapabilityChange failed:",
+          error
+        );
+      });
+      return;
+    }
+    void socket.refreshDebuggerCapabilityState().catch((error) => {
+      console.error(
+        "DriveSocket refreshDebuggerCapabilityState failed:",
+        error
+      );
     });
-    return true;
   }
 );
 socket.start();