rechrome 1.12.2 → 1.12.3

package/extension/lib/background.mjs

@@ -1,83 +1,249 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+class ProtocolV1Handler {
+  constructor(context) {
+    __publicField(this, "_context");
+    __publicField(this, "_selectedTabPromise");
+    __publicField(this, "_selectedTabResolve");
+    this._context = context;
+    this._selectedTabPromise = new Promise((resolve) => this._selectedTabResolve = resolve);
+  }
+  async handleCommand(message) {
+    if (message.method === "attachToTab") {
+      const tabId = await this._selectedTabPromise;
+      const debuggee = { tabId };
+      await chrome.debugger.attach(debuggee, "1.3");
+      this._context.notifyTabAttached(tabId);
+      const result = await chrome.debugger.sendCommand(debuggee, "Target.getTargetInfo");
+      return { targetInfo: result == null ? void 0 : result.targetInfo };
+    }
+    if (message.method === "forwardCDPCommand") {
+      const { sessionId, method, params } = message.params;
+      if (method === "Target.createTarget")
+        throw new Error("Tab creation is not supported yet. Update Playwright MCP or CLI to the latest version.");
+      const tabId = [...this._context.attachedTabs][0];
+      if (tabId === void 0)
+        throw new Error("No tab is connected");
+      const debuggerSession = { tabId, sessionId };
+      return await chrome.debugger.sendCommand(debuggerSession, method, params);
+    }
+    throw new Error(`Unknown method: ${message.method}`);
+  }
+  forwardChromeEvent(fullMethod, args) {
+    if (fullMethod !== "chrome.debugger.onEvent")
+      return;
+    const [source, method, params] = args;
+    this._context.sendMessage({
+      method: "forwardCDPEvent",
+      params: { sessionId: source.sessionId, method, params }
+    });
+  }
+  onUserAttachRequest(tab) {
+    if (tab.id !== void 0)
+      this._selectedTabResolve(tab.id);
+  }
+  onUserDetachRequest(_tabId) {
+  }
+  didInitialize() {
+  }
+}
+const ALLOWED_CHROME_COMMANDS = /* @__PURE__ */ new Set([
+  "chrome.debugger.attach",
+  "chrome.debugger.detach",
+  "chrome.debugger.sendCommand",
+  "chrome.tabs.create",
+  "chrome.tabs.remove"
+]);
+class ProtocolV2Handler {
+  constructor(context) {
+    __publicField(this, "_context");
+    this._context = context;
+  }
+  async handleCommand(message) {
+    if (ALLOWED_CHROME_COMMANDS.has(message.method)) {
+      const args = message.params ?? [];
+      const result = await invokeChromeMethod(message.method, args);
+      if (message.method === "chrome.debugger.attach") {
+        const target = args[0];
+        if ((target == null ? void 0 : target.tabId) !== void 0)
+          this._context.notifyTabAttached(target.tabId);
+      }
+      return result ?? {};
+    }
+    throw new Error(`Unknown method: ${message.method}`);
+  }
+  forwardChromeEvent(fullMethod, args) {
+    this._context.sendMessage({ method: fullMethod, params: args });
+  }
+  onUserAttachRequest(tab) {
+    this._context.sendMessage({ method: "chrome.tabs.onCreated", params: [tab] });
+  }
+  didInitialize() {
+    this._context.sendMessage({ method: "extension.initialized", params: [] });
+  }
+  onUserDetachRequest(tabId) {
+    this._context.sendMessage({
+      method: "chrome.debugger.onDetach",
+      params: [{ tabId }, "target_closed"]
+    });
+  }
+}
+function resolveChromeMember(fullMethod) {
+  const parts = fullMethod.split(".");
+  if (parts[0] !== "chrome" || parts.length < 3)
+    throw new Error(`Invalid chrome method: ${fullMethod}`);
+  let obj = chrome;
+  for (let i = 1; i < parts.length - 1; i++) {
+    obj = obj == null ? void 0 : obj[parts[i]];
+    if (obj === void 0)
+      throw new Error(`Unknown chrome path: ${parts.slice(0, i + 1).join(".")}, calling ${fullMethod}`);
+  }
+  return { obj, name: parts[parts.length - 1] };
+}
+async function invokeChromeMethod(fullMethod, args) {
+  const { obj, name } = resolveChromeMember(fullMethod);
+  const fn = obj[name];
+  if (typeof fn !== "function")
+    throw new Error(`Not a function: ${fullMethod}`);
+  return await fn.apply(obj, args);
+}
 function debugLog(...args) {
   {
     console.log("[Extension]", ...args);
   }
 }
+const CHROME_EVENT_METHODS = [
+  "chrome.debugger.onEvent",
+  "chrome.debugger.onDetach",
+  "chrome.tabs.onCreated",
+  "chrome.tabs.onRemoved"
+];
 class RelayConnection {
-  _debuggee;
-  _ws;
-  _eventListener;
-  _detachListener;
-  _tabPromise;
-  _tabPromiseResolve;
-  _closed = false;
-  _playwrightTabIds = /* @__PURE__ */ new Set();
-  onclose;
-  onPlaywrightTabCreated;
-  onPlaywrightTabRemoved;
-  constructor(ws) {
-    this._debuggee = {};
-    this._tabPromise = new Promise((resolve) => this._tabPromiseResolve = resolve);
+  constructor(ws, protocolVersion) {
+    __publicField(this, "_ws");
+    __publicField(this, "_handler");
+    // Tabs whose debugger we have explicitly attached for this connection.
+    __publicField(this, "_attachedTabs", /* @__PURE__ */ new Set());
+    // Once we've attached at least one tab, detaching the last one closes the connection.
+    __publicField(this, "_hasEverAttached", false);
+    __publicField(this, "_eventListeners", []);
+    __publicField(this, "_closed", false);
+    __publicField(this, "onclose");
+    __publicField(this, "ontabattached");
+    __publicField(this, "ontabdetached");
     this._ws = ws;
+    const context = {
+      attachedTabs: this._attachedTabs,
+      sendMessage: (msg) => this._sendMessage(msg),
+      notifyTabAttached: (tabId) => this._notifyTabAttached(tabId),
+      notifyTabDetached: (tabId) => this._notifyTabDetached(tabId)
+    };
+    this._handler = protocolVersion === 1 ? new ProtocolV1Handler(context) : new ProtocolV2Handler(context);
+    this._installEventForwarders();
     this._ws.onmessage = this._onMessage.bind(this);
     this._ws.onclose = () => this._onClose();
-    this._eventListener = this._onDebuggerEvent.bind(this);
-    this._detachListener = this._onDebuggerDetach.bind(this);
-    chrome.debugger.onEvent.addListener(this._eventListener);
-    chrome.debugger.onDetach.addListener(this._detachListener);
   }
-  // Either setTabId or close is called after creating the connection.
-  setTabId(tabId) {
-    this._debuggee = { tabId };
-    this._tabPromiseResolve();
+  get attachedTabs() {
+    return this._attachedTabs;
+  }
+  // Signals the end of the initial-tab handshake — call after the initial
+  // round of `attachTab` invocations. For v2 this sends `extension.initialized`
+  // so the relay can unblock Playwright CDP traffic; v1 has no handshake.
+  didInitialize() {
+    this._handler.didInitialize();
   }
   close(message) {
     this._ws.close(1e3, message);
     this._onClose();
   }
+  // Called when the UI adds a tab to the Playwright group. The handler asks
+  // the relay to attach; the normal command path fires ontabattached.
+  attachTab(tab) {
+    if (this._closed || this._attachedTabs.has(tab.id))
+      return;
+    this._handler.onUserAttachRequest(tab);
+  }
+  // Called when the UI removes a tab from the Playwright group. We detach the
+  // debugger and update bookkeeping; the handler emits the wire-level detach
+  // notification for protocols that have one.
+  detachTab(tabId) {
+    if (this._closed || !this._attachedTabs.has(tabId))
+      return;
+    chrome.debugger.detach({ tabId }).catch((error) => {
+      debugLog("Error detaching tab:", error);
+    });
+    this._notifyTabDetached(tabId);
+    this._handler.onUserDetachRequest(tabId);
+    this._checkLastTabDetached();
+  }
+  _notifyTabAttached(tabId) {
+    var _a;
+    this._attachedTabs.add(tabId);
+    this._hasEverAttached = true;
+    (_a = this.ontabattached) == null ? void 0 : _a.call(this, tabId);
+  }
+  _notifyTabDetached(tabId) {
+    var _a;
+    this._attachedTabs.delete(tabId);
+    (_a = this.ontabdetached) == null ? void 0 : _a.call(this, tabId);
+  }
+  _installEventForwarders() {
+    for (const fullMethod of CHROME_EVENT_METHODS) {
+      const target = resolveChromeMember(fullMethod);
+      const listener = (...args) => this._onChromeEvent(fullMethod, args);
+      target.obj[target.name].addListener(listener);
+      this._eventListeners.push({
+        remove: () => target.obj[target.name].removeListener(listener)
+      });
+    }
+  }
   _onClose() {
+    var _a;
     if (this._closed)
       return;
     this._closed = true;
-    chrome.debugger.onEvent.removeListener(this._eventListener);
-    chrome.debugger.onDetach.removeListener(this._detachListener);
-    chrome.debugger.detach(this._debuggee).catch(() => {
-    });
-    for (const tabId of this._playwrightTabIds)
+    for (const l of this._eventListeners)
+      l.remove();
+    this._eventListeners = [];
+    for (const tabId of [...this._attachedTabs]) {
       chrome.debugger.detach({ tabId }).catch(() => {
       });
-    this._playwrightTabIds.clear();
-    this.onclose?.();
+      this._notifyTabDetached(tabId);
+    }
+    (_a = this.onclose) == null ? void 0 : _a.call(this);
   }
-  _onDebuggerEvent(source, method, params) {
-    const isInitialTab = source.tabId === this._debuggee.tabId;
-    const isPlaywrightTab = source.tabId !== void 0 && this._playwrightTabIds.has(source.tabId);
-    if (!isInitialTab && !isPlaywrightTab)
-      return;
-    debugLog("Forwarding CDP event:", method, params);
-    const sessionId = source.sessionId;
-    const tabId = isPlaywrightTab ? source.tabId : void 0;
-    this._sendMessage({
-      method: "forwardCDPEvent",
-      params: {
-        sessionId,
-        method,
-        params,
-        tabId
-      }
-    });
+  _checkLastTabDetached() {
+    if (this._hasEverAttached && this._attachedTabs.size === 0)
+      this.close("All controlled tabs detached");
   }
-  _onDebuggerDetach(source, reason) {
-    if (source.tabId !== void 0 && this._playwrightTabIds.has(source.tabId)) {
-      debugLog("Playwright tab detached:", source.tabId, reason);
-      this._playwrightTabIds.delete(source.tabId);
-      this.onPlaywrightTabRemoved?.(source.tabId);
+  // Filters chrome.* events to attached tabs, delegates wire formatting to the
+  // handler, then runs shared detach bookkeeping.
+  _onChromeEvent(fullMethod, args) {
+    const tabId = this._tabIdForEventArgs(fullMethod, args);
+    if (tabId === void 0 || !this._attachedTabs.has(tabId))
       return;
+    this._handler.forwardChromeEvent(fullMethod, args);
+    if (fullMethod === "chrome.debugger.onDetach") {
+      this._notifyTabDetached(tabId);
+      this._checkLastTabDetached();
     }
-    if (source.tabId !== this._debuggee.tabId)
-      return;
-    this.close(`Debugger detached: ${reason}`);
-    this._debuggee = {};
+  }
+  // Returns the tabId an event refers to, for filtering by _attachedTabs.
+  _tabIdForEventArgs(fullMethod, args) {
+    var _a;
+    switch (fullMethod) {
+      case "chrome.debugger.onEvent":
+      case "chrome.debugger.onDetach":
+        return (_a = args[0]) == null ? void 0 : _a.tabId;
+      case "chrome.tabs.onCreated": {
+        const tab = args[0];
+        return tab.openerTabId;
+      }
+      case "chrome.tabs.onRemoved":
+        return args[0];
+    }
+    return void 0;
   }
   _onMessage(event) {
     this._onMessageAsync(event).catch((e) => debugLog("Error handling message:", e));
@@ -87,64 +253,21 @@ class RelayConnection {
     try {
       message = JSON.parse(event.data);
     } catch (error) {
-      debugLog("Error parsing message:", error);
+      debugLog(`Error parsing message ${event.data}:`, error);
       this._sendError(-32700, `Error parsing message: ${error.message}`);
       return;
     }
-    debugLog("Received message:", message);
     const response = {
       id: message.id
     };
     try {
-      response.result = await this._handleCommand(message);
+      response.result = await this._handler.handleCommand(message);
     } catch (error) {
-      debugLog("Error handling command:", error);
+      debugLog(`Error handling command ${JSON.stringify(message)}:`, error);
       response.error = error.message;
     }
-    debugLog("Sending response:", response);
     this._sendMessage(response);
   }
-  async _handleCommand(message) {
-    if (message.method === "attachToTab") {
-      await this._tabPromise;
-      debugLog("Attaching debugger to tab:", this._debuggee);
-      await chrome.debugger.attach(this._debuggee, "1.3");
-      const result = await chrome.debugger.sendCommand(this._debuggee, "Target.getTargetInfo");
-      return {
-        targetInfo: result?.targetInfo,
-        tabId: this._debuggee.tabId
-      };
-    }
-    if (message.method === "createTab") {
-      const url = message.params?.url ?? "about:blank";
-      debugLog("Creating new tab:", url);
-      const tab = await chrome.tabs.create({ url, active: true });
-      const tabId = tab.id;
-      await new Promise((resolve) => setTimeout(resolve, 300));
-      await chrome.debugger.attach({ tabId }, "1.3");
-      const result = await chrome.debugger.sendCommand({ tabId }, "Target.getTargetInfo");
-      const targetInfo = result?.targetInfo || {
-        targetId: String(tabId),
-        type: "page",
-        title: "",
-        url: tab.url || url,
-        attached: false,
-        canAccessOpener: false
-      };
-      this._playwrightTabIds.add(tabId);
-      this.onPlaywrightTabCreated?.(tabId);
-      debugLog("Created playwright tab:", tabId, targetInfo);
-      return { tabId, targetInfo };
-    }
-    if (!this._debuggee.tabId)
-      throw new Error("No tab is connected. Please go to the Playwright MCP extension and select the tab you want to connect to.");
-    if (message.method === "forwardCDPCommand") {
-      const { sessionId, method, params, tabId } = message.params;
-      debugLog("CDP command:", method, params, "tabId:", tabId);
-      const debuggee = tabId !== void 0 ? { tabId, sessionId } : { ...this._debuggee, sessionId };
-      return await chrome.debugger.sendCommand(debuggee, method, params);
-    }
-  }
   _sendError(code, message) {
     this._sendMessage({
       error: {
@@ -158,192 +281,330 @@ class RelayConnection {
       this._ws.send(JSON.stringify(message));
   }
 }
-class TabShareExtension {
-  _connections = /* @__PURE__ */ new Map();
-  _pendingTabSelection = /* @__PURE__ */ new Map();
+class EagerPending {
+  constructor(connection) {
+    __publicField(this, "_connection");
+    __publicField(this, "onclose");
+    this._connection = connection;
+    this._connection.onclose = () => {
+      var _a;
+      return (_a = this.onclose) == null ? void 0 : _a.call(this);
+    };
+  }
+  static async create(mcpRelayUrl, protocolVersion) {
+    const connection = await openRelayConnection(mcpRelayUrl, protocolVersion);
+    return new EagerPending(connection);
+  }
+  async connect() {
+    return this._connection;
+  }
+  close(reason) {
+    this._connection.close(reason);
+  }
+}
+class DeferredPending {
+  constructor(_mcpRelayUrl, _protocolVersion) {
+    this._mcpRelayUrl = _mcpRelayUrl;
+    this._protocolVersion = _protocolVersion;
+  }
+  async connect() {
+    return openRelayConnection(this._mcpRelayUrl, this._protocolVersion);
+  }
+  close(_reason) {
+  }
+}
+class PendingConnections {
   constructor() {
+    __publicField(this, "_map", /* @__PURE__ */ new Map());
     chrome.tabs.onRemoved.addListener(this._onTabRemoved.bind(this));
-    chrome.tabs.onUpdated.addListener(this._onTabUpdated.bind(this));
-    chrome.tabs.onActivated.addListener(this._onTabActivated.bind(this));
+  }
+  // v1 opens the relay WS eagerly — the daemon expects a prompt connection.
+  // v2 records only the descriptor; the WS opens lazily in `take` once the
+  // user clicks Allow.
+  async create(selectorTabId, mcpRelayUrl, protocolVersion) {
+    if (protocolVersion !== 1) {
+      this._map.set(selectorTabId, new DeferredPending(mcpRelayUrl, protocolVersion));
+      return;
+    }
+    const entry = await EagerPending.create(mcpRelayUrl, protocolVersion);
+    entry.onclose = () => {
+      if (this._map.get(selectorTabId) !== entry)
+        return;
+      this._map.delete(selectorTabId);
+      chrome.tabs.sendMessage(selectorTabId, { type: "pendingConnectionClosed" }).catch(() => {
+      });
+    };
+    this._map.set(selectorTabId, entry);
+  }
+  async take(selectorTabId) {
+    const entry = this._map.get(selectorTabId);
+    if (!entry)
+      return void 0;
+    this._map.delete(selectorTabId);
+    return entry.connect();
+  }
+  _onTabRemoved(tabId) {
+    const entry = this._map.get(tabId);
+    if (!entry)
+      return;
+    this._map.delete(tabId);
+    entry.close("Browser tab closed");
+  }
+}
+async function openRelayConnection(mcpRelayUrl, protocolVersion) {
+  try {
+    const socket = new WebSocket(mcpRelayUrl);
+    await new Promise((resolve, reject) => {
+      socket.onopen = () => resolve();
+      socket.onerror = () => reject(new Error("WebSocket error"));
+      setTimeout(() => reject(new Error("Connection timeout")), 5e3);
+    });
+    return new RelayConnection(socket, protocolVersion);
+  } catch (error) {
+    const message = `Failed to connect to MCP relay: ${error.message}`;
+    debugLog(message);
+    throw new Error(message);
+  }
+}
+const PLAYWRIGHT_GROUP_TITLE = "Playwright";
+const PLAYWRIGHT_GROUP_COLOR = "green";
+const NON_DEBUGGABLE_SCHEMES = ["chrome:", "edge:", "devtools:"];
+const CONNECTED_BADGE = { text: "✓", color: "#4CAF50", title: "Connected to Playwright client" };
+function isNonDebuggableUrl(url) {
+  return !!url && NON_DEBUGGABLE_SCHEMES.some((s) => url.startsWith(s));
+}
+async function cleanupStalePlaywrightGroups() {
+  try {
+    const groups = await chrome.tabGroups.query({ title: PLAYWRIGHT_GROUP_TITLE });
+    const tabsPerGroup = await Promise.all(groups.map((g) => chrome.tabs.query({ groupId: g.id })));
+    const tabIds = tabsPerGroup.flat().map((t) => t.id).filter((id) => id !== void 0);
+    if (tabIds.length)
+      await chrome.tabs.ungroup(tabIds);
+  } catch (error) {
+    debugLog("Error cleaning up stale groups:", error);
+  }
+}
+class ConnectedTabGroup {
+  constructor(connection, selectedTab) {
+    __publicField(this, "_connection");
+    __publicField(this, "_groupId", null);
+    __publicField(this, "_groupTabIds", /* @__PURE__ */ new Set());
+    __publicField(this, "_onTabUpdatedListener");
+    __publicField(this, "_onTabRemovedListener");
+    __publicField(this, "onclose");
+    this._connection = connection;
+    this._connection.onclose = () => this._onConnectionClose();
+    this._connection.ontabattached = (tabId) => this._onTabAttached(tabId);
+    this._connection.ontabdetached = (tabId) => this._onTabDetached(tabId);
+    this._onTabUpdatedListener = this._onTabUpdated.bind(this);
+    this._onTabRemovedListener = this._onTabRemoved.bind(this);
+    chrome.tabs.onUpdated.addListener(this._onTabUpdatedListener);
+    chrome.tabs.onRemoved.addListener(this._onTabRemovedListener);
+    this._connection.attachTab(selectedTab);
+    this._connection.didInitialize();
+  }
+  connectedTabIds() {
+    return [...this._groupTabIds];
+  }
+  close(reason) {
+    this._connection.close(reason);
+  }
+  _onTabUpdated(tabId, changeInfo, tab) {
+    if (changeInfo.groupId !== void 0)
+      this._onTabGroupChanged(tabId, tab);
+    if (changeInfo.url === void 0)
+      return;
+    if (this._connection.attachedTabs.has(tabId))
+      void this._updateBadge(tabId, CONNECTED_BADGE);
+    else if (this._groupTabIds.has(tabId) && !isNonDebuggableUrl(changeInfo.url))
+      this._connection.attachTab(tab);
+  }
+  // Single entry point for group membership changes, whether the user dragged
+  // or we grouped the tab ourselves. Attaches on entry (if debuggable) and
+  // detaches on exit; a chrome:// tab stays in the group until it navigates
+  // (handled in _onTabUpdated).
+  _onTabGroupChanged(tabId, tab) {
+    const inOurGroup = this._groupId !== null && tab.groupId === this._groupId;
+    const wasInGroup = this._groupTabIds.has(tabId);
+    if (inOurGroup === wasInGroup)
+      return;
+    if (inOurGroup) {
+      this._groupTabIds.add(tabId);
+      if (!isNonDebuggableUrl(tab.url))
+        this._connection.attachTab(tab);
+    } else {
+      this._groupTabIds.delete(tabId);
+      if (this._connection.attachedTabs.has(tabId))
+        this._connection.detachTab(tabId);
+    }
+  }
+  _onTabRemoved(tabId) {
+    this._groupTabIds.delete(tabId);
+  }
+  _onTabAttached(tabId) {
+    void this._updateBadge(tabId, CONNECTED_BADGE);
+    void this._addTabToGroup(tabId);
+  }
+  // The debugger detached (drag-out, tab close, or external action). Clear the
+  // badge but leave the tab in the group — the user's intent is still there,
+  // and a subsequent navigation will re-attach via _onTabUpdated.
+  _onTabDetached(tabId) {
+    void this._updateBadge(tabId, { text: "" });
+  }
+  _onConnectionClose() {
+    var _a;
+    chrome.tabs.onUpdated.removeListener(this._onTabUpdatedListener);
+    chrome.tabs.onRemoved.removeListener(this._onTabRemovedListener);
+    const groupTabs = [...this._groupTabIds];
+    this._groupTabIds.clear();
+    if (groupTabs.length) {
+      this._retryOnDrag(() => chrome.tabs.ungroup(groupTabs)).catch((error) => {
+        debugLog("Error ungrouping tabs on close:", error);
+      });
+    }
+    (_a = this.onclose) == null ? void 0 : _a.call(this);
+  }
+  async _updateBadge(tabId, { text, color, title }) {
+    try {
+      await Promise.all([
+        chrome.action.setBadgeText({ tabId, text }),
+        chrome.action.setTitle({ tabId, title: title || "" }),
+        color ? chrome.action.setBadgeBackgroundColor({ tabId, color }) : Promise.resolve()
+      ]);
+    } catch (error) {
+    }
+  }
+  // Moves an already-attached tab into our Chrome tab group, creating it on
+  // first use. `_groupTabIds` is updated after the await so an onUpdated event
+  // that arrives concurrently (`_groupId` still null, wasInGroup still false)
+  // becomes a harmless no-op rather than taking the drag-out branch.
+  async _addTabToGroup(tabId) {
+    if (this._groupTabIds.has(tabId))
+      return;
+    try {
+      await this._retryOnDrag(async () => {
+        if (this._groupId === null) {
+          this._groupId = await chrome.tabs.group({ tabIds: [tabId] });
+          await chrome.tabGroups.update(this._groupId, { color: PLAYWRIGHT_GROUP_COLOR, title: PLAYWRIGHT_GROUP_TITLE });
+        } else {
+          await chrome.tabs.group({ groupId: this._groupId, tabIds: [tabId] });
+        }
+      });
+      this._groupTabIds.add(tabId);
+    } catch (error) {
+      debugLog("Error adding tab to group:", error);
+    }
+  }
+  // Chrome throws "user may be dragging a tab" while a drag is in progress.
+  // Retry with backoff until it clears (or we give up).
+  async _retryOnDrag(fn) {
+    var _a;
+    const delays = [0, 100, 200, 400, 800];
+    let lastError;
+    for (const delay of delays) {
+      if (delay)
+        await new Promise((resolve) => setTimeout(resolve, delay));
+      try {
+        await fn();
+        return;
+      } catch (error) {
+        if (!((_a = error == null ? void 0 : error.message) == null ? void 0 : _a.includes("user may be dragging a tab")))
+          throw error;
+        lastError = error;
+      }
+    }
+    throw lastError;
+  }
+}
+class PlaywrightExtension {
+  constructor() {
+    __publicField(this, "_activeGroup");
+    __publicField(this, "_activeClientName");
+    __publicField(this, "_pendingConnections", new PendingConnections());
+    // Service worker restarts lose all connection state, so any existing
+    // Playwright groups are stale. Connections wait on this before reconciling.
+    __publicField(this, "_cleanupPromise");
     chrome.runtime.onMessage.addListener(this._onMessage.bind(this));
     chrome.action.onClicked.addListener(this._onActionClicked.bind(this));
+    this._cleanupPromise = cleanupStalePlaywrightGroups();
   }
   // Promise-based message handling is not supported in Chrome: https://issues.chromium.org/issues/40753031
   _onMessage(message, sender, sendResponse) {
+    var _a;
     switch (message.type) {
-      case "connectToMCPRelay":
-        this._connectToRelay(sender.tab.id, message.mcpRelayUrl).then(
+      case "connectionRequested":
+        this._pendingConnections.create(sender.tab.id, message.mcpRelayUrl, message.protocolVersion).then(
           () => sendResponse({ success: true }),
           (error) => sendResponse({ success: false, error: error.message })
         );
         return true;
       case "getTabs":
         this._getTabs().then(
-          (tabs) => sendResponse({ success: true, tabs, currentTabId: sender.tab?.id }),
+          (tabs) => {
+            var _a2;
+            return sendResponse({ success: true, tabs, currentTabId: (_a2 = sender.tab) == null ? void 0 : _a2.id });
+          },
           (error) => sendResponse({ success: false, error: error.message })
         );
         return true;
-      case "connectToTab":
-        const tabId = message.tabId || sender.tab?.id;
-        const windowId = message.windowId || sender.tab?.windowId;
-        this._connectTab(sender.tab.id, tabId, windowId, message.mcpRelayUrl).then(
+      case "connectToTab": {
+        const selectedTab = message.tab ?? sender.tab;
+        this._connectTab(sender.tab.id, selectedTab, message.clientName).then(
           () => sendResponse({ success: true }),
           (error) => sendResponse({ success: false, error: error.message })
         );
         return true;
-      // Return true to indicate that the response will be sent asynchronously
+      }
       case "getConnectionStatus":
         sendResponse({
-          connections: [...this._connections.values()].map((s) => ({
-            mcpRelayUrl: s.mcpRelayUrl,
-            connectedTabId: s.connectedTabId,
-            playwrightTabIds: [...s.playwrightTabIds]
-          })),
-          // Legacy fields for backward compat: first connection's tabId
-          connectedTabId: [...this._connections.values()][0]?.connectedTabId ?? null,
-          playwrightTabIds: [...this._connections.values()].flatMap((s) => [...s.playwrightTabIds])
+          connectedTabIds: ((_a = this._activeGroup) == null ? void 0 : _a.connectedTabIds()) ?? [],
+          clientName: this._activeClientName
         });
         return false;
       case "disconnect":
-        this._disconnect(message.mcpRelayUrl).then(
-          () => sendResponse({ success: true }),
-          (error) => sendResponse({ success: false, error: error.message })
-        );
+        try {
+          this._disconnect("User disconnected");
+          sendResponse({ success: true });
+        } catch (error) {
+          sendResponse({ success: false, error: error.message });
+        }
         return true;
-    }
-    return false;
-  }
-  async _connectToRelay(selectorTabId, mcpRelayUrl) {
-    try {
-      debugLog(`Connecting to relay at ${mcpRelayUrl}`);
-      const socket = new WebSocket(mcpRelayUrl);
-      await new Promise((resolve, reject) => {
-        socket.onopen = () => resolve();
-        socket.onerror = () => reject(new Error("WebSocket error"));
-        setTimeout(() => reject(new Error("Connection timeout")), 5e3);
-      });
-      const connection = new RelayConnection(socket);
-      connection.onclose = () => {
-        debugLog("Connection closed");
-        this._pendingTabSelection.delete(selectorTabId);
-      };
-      this._pendingTabSelection.set(selectorTabId, { connection, mcpRelayUrl });
-      debugLog(`Connected to MCP relay`);
-    } catch (error) {
-      const message = `Failed to connect to MCP relay: ${error.message}`;
-      debugLog(message);
-      throw new Error(message);
+      case "keepalive":
+        return false;
     }
   }
-  async _connectTab(selectorTabId, tabId, windowId, mcpRelayUrl) {
+  async _connectTab(selectorTabId, tab, clientName) {
     try {
-      debugLog(`Connecting tab ${tabId} to relay at ${mcpRelayUrl}`);
-      const pending = this._pendingTabSelection.get(selectorTabId);
-      if (!pending)
-        throw new Error("No active MCP relay connection");
-      this._pendingTabSelection.delete(selectorTabId);
-      const connection = pending.connection;
-      const relayUrl = pending.mcpRelayUrl;
-      const existing = this._connections.get(relayUrl);
-      if (existing) {
-        existing.connection.close("Another connection is requested");
-        this._connections.delete(relayUrl);
-      }
-      const state = {
-        connection,
-        connectedTabId: tabId,
-        playwrightTabIds: /* @__PURE__ */ new Set(),
-        mcpRelayUrl: relayUrl
-      };
-      this._connections.set(relayUrl, state);
-      connection.setTabId(tabId);
-      connection.onclose = () => {
-        debugLog("MCP connection closed");
-        if (this._connections.get(relayUrl)?.connection === connection)
-          this._connections.delete(relayUrl);
-        void this._updateBadge(state.connectedTabId, { text: "" });
-        for (const pwTabId of state.playwrightTabIds)
-          void this._updateBadge(pwTabId, { text: "" });
-        state.playwrightTabIds.clear();
-      };
-      connection.onPlaywrightTabCreated = (pwTabId) => {
-        state.playwrightTabIds.add(pwTabId);
-        void this._updateBadge(pwTabId, { text: "✓", color: "#1976D2", title: "Playwright managed tab" });
-      };
-      connection.onPlaywrightTabRemoved = (pwTabId) => {
-        state.playwrightTabIds.delete(pwTabId);
-        void this._updateBadge(pwTabId, { text: "" });
+      await this._cleanupPromise;
+      this._disconnect("Another connection is requested");
+      const connection = await this._pendingConnections.take(selectorTabId);
+      if (!connection)
+        throw new Error("Pending client connection closed");
+      const group = new ConnectedTabGroup(connection, tab);
+      group.onclose = () => {
+        if (this._activeGroup === group) {
+          this._activeGroup = void 0;
+          this._activeClientName = void 0;
+        }
       };
+      this._activeGroup = group;
+      this._activeClientName = clientName;
       await Promise.all([
-        this._updateBadge(tabId, { text: "✓", color: "#4CAF50", title: "Connected to MCP client" }),
-        chrome.tabs.update(tabId, { active: true }),
-        chrome.windows.update(windowId, { focused: true })
-      ]);
-      debugLog(`Connected to MCP bridge`);
+        chrome.tabs.update(tab.id, { active: true }),
+        chrome.windows.update(tab.windowId, { focused: true })
+      ]).catch(() => {
+      });
+      if (tab.id !== selectorTabId)
+        await chrome.tabs.remove(selectorTabId).catch(() => {
+        });
     } catch (error) {
-      debugLog(`Failed to connect tab ${tabId}:`, error.message);
+      debugLog(`Failed to connect tab ${tab.id}:`, error.message);
       throw error;
     }
   }
-  async _updateBadge(tabId, { text, color, title }) {
-    try {
-      await chrome.action.setBadgeText({ tabId, text });
-      await chrome.action.setTitle({ tabId, title: title || "" });
-      if (color)
-        await chrome.action.setBadgeBackgroundColor({ tabId, color });
-    } catch (error) {
-    }
-  }
-  async _onTabRemoved(tabId) {
-    const pendingConnection = [...this._pendingTabSelection.entries()].find(([k]) => k === tabId)?.[1];
-    if (pendingConnection) {
-      this._pendingTabSelection.delete(tabId);
-      pendingConnection.connection.close("Browser tab closed");
-      return;
-    }
-    for (const [relayUrl, state] of this._connections) {
-      if (state.playwrightTabIds.has(tabId)) {
-        state.playwrightTabIds.delete(tabId);
-        return;
-      }
-      if (state.connectedTabId === tabId) {
-        state.connection.close("Browser tab closed");
-        this._connections.delete(relayUrl);
-        return;
-      }
-    }
-  }
-  _onTabActivated(activeInfo) {
-    for (const [tabId, pending] of this._pendingTabSelection) {
-      if (tabId === activeInfo.tabId) {
-        if (pending.timerId) {
-          clearTimeout(pending.timerId);
-          pending.timerId = void 0;
-        }
-        continue;
-      }
-      if (!pending.timerId) {
-        pending.timerId = setTimeout(() => {
-          const existed = this._pendingTabSelection.delete(tabId);
-          if (existed) {
-            pending.connection.close("Tab has been inactive for 5 seconds");
-            chrome.tabs.sendMessage(tabId, { type: "connectionTimeout" });
-          }
-        }, 5e3);
-      }
-    }
-  }
-  _onTabUpdated(tabId, changeInfo, tab) {
-    for (const state of this._connections.values()) {
-      if (state.connectedTabId === tabId)
-        void this._updateBadge(tabId, { text: "✓", color: "#4CAF50", title: "Connected to MCP client" });
-      if (state.playwrightTabIds.has(tabId))
-        void this._updateBadge(tabId, { text: "✓", color: "#1976D2", title: "Playwright managed tab" });
-    }
-  }
   async _getTabs() {
     const tabs = await chrome.tabs.query({});
-    return tabs.filter((tab) => tab.url && !["chrome:", "edge:", "devtools:"].some((scheme) => tab.url.startsWith(scheme)));
+    return tabs.filter((tab) => !isNonDebuggableUrl(tab.url));
   }
   async _onActionClicked() {
     await chrome.tabs.create({
@@ -351,18 +612,13 @@ class TabShareExtension {
       active: true
     });
   }
-  async _disconnect(mcpRelayUrl) {
-    if (mcpRelayUrl) {
-      const state = this._connections.get(mcpRelayUrl);
-      if (state) {
-        state.connection.close("User disconnected");
-        this._connections.delete(mcpRelayUrl);
-      }
-    } else {
-      for (const state of this._connections.values())
-        state.connection.close("User disconnected");
-      this._connections.clear();
-    }
+  // Closes the active group's connection if any. ConnectedTabGroup's onclose
+  // handles state cleanup (connectedTabIds, badges, reconcile).
+  _disconnect(reason) {
+    var _a;
+    (_a = this._activeGroup) == null ? void 0 : _a.close(reason);
+    this._activeGroup = void 0;
+    this._activeClientName = void 0;
   }
 }
-new TabShareExtension();
+new PlaywrightExtension();