@vforsh/argus 0.1.18 → 0.1.20

package/dist/extension/dist/popup/popup.js

@@ -0,0 +1,730 @@
+// src/popup/classify-target.ts
+var LOW_INTEREST_URL_RULES = [
+  { host: "accounts.google.com", pathPrefix: "/RotateCookiesPage" },
+  { host: "clients6.google.com", pathPrefix: "/static/proxy.html" },
+  { host: "contacts.google.com", pathPrefix: "/u/2/widget/hovercard/" },
+  { host: "docs.google.com", pathPrefix: "/_/og/bscframe" },
+  { host: "docs.google.com", pathPrefix: "/offline/iframeapi" },
+  { host: "doubleclick.net" },
+  { host: "googlesyndication.com" },
+  { host: "google.com", pathPrefix: "/recaptcha" },
+  { host: "googletagmanager.com" },
+  { host: "google-analytics.com" },
+  { host: "googleadservices.com" },
+  { host: "connect.facebook.net" },
+  { host: "facebook.com", pathPrefix: "/tr" },
+  { host: "ozone-project.com" },
+  { host: "amazon-adsystem.com" },
+  { host: "adnxs.com" },
+  { host: "adsrvr.org" },
+  { host: "criteo.com" },
+  { host: "inmobi.com" },
+  { host: "rubiconproject.com" },
+  { host: "pubmatic.com" }
+];
+var LOW_INTEREST_TITLE_PATTERNS = [
+  /^__\w+__$/,
+  // __pb_locator__, __tcfapiLocator
+  /^googlefc/i
+  // googlefcPresent, googlefcInactive, googlefcLoaded
+];
+function isLowInterestTarget(target) {
+  if (target.type === "page") return false;
+  const url = target.url;
+  if (!url || url === "about:blank" || url === "about:srcdoc") return true;
+  if (matchesLowInterestUrl(url)) return true;
+  const title = target.title;
+  if (title && LOW_INTEREST_TITLE_PATTERNS.some((pattern) => pattern.test(title))) return true;
+  return false;
+}
+function matchesLowInterestUrl(url) {
+  try {
+    const parsed = new URL(url);
+    return LOW_INTEREST_URL_RULES.some((rule) => matchesUrlRule(parsed, rule));
+  } catch {
+    return false;
+  }
+}
+function matchesUrlRule(url, rule) {
+  if (!matchesHost(url.hostname, rule.host)) return false;
+  if (!rule.pathPrefix) return true;
+  return url.pathname.startsWith(rule.pathPrefix);
+}
+function matchesHost(hostname, host) {
+  return hostname === host || hostname.endsWith(`.${host}`);
+}
+
+// src/popup/target-list.ts
+var HIDE_TARGET_ICON = `
+	<svg viewBox="0 0 24 24" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+		<path d="M10.7 5.1A10.7 10.7 0 0 1 12 5c5 0 8.5 4.5 9.5 6a13.4 13.4 0 0 1-2.7 3.2"></path>
+		<path d="M6.6 6.7A13.4 13.4 0 0 0 2.5 11c1 1.5 4.5 6 9.5 6a8.7 8.7 0 0 0 4.2-1.1"></path>
+		<path d="M14.1 14.1a3 3 0 0 1-4.2-4.2"></path>
+		<path d="M3 3l18 18"></path>
+	</svg>
+`;
+var SHOW_TARGET_ICON = `
+	<svg viewBox="0 0 24 24" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+		<path d="M2.5 12s3.5-6 9.5-6 9.5 6 9.5 6-3.5 6-9.5 6-9.5-6-9.5-6z"></path>
+		<circle cx="12" cy="12" r="3"></circle>
+	</svg>
+`;
+function renderTargetList(tab) {
+  const targets = tab.targets ?? [];
+  const hiddenTargets = tab.hiddenTargets ?? [];
+  if (targets.length <= 1 && hiddenTargets.length === 0) return "";
+  const primaryTargets = [];
+  const autoHiddenTargets = [];
+  for (const target of targets) {
+    if (isLowInterestTarget(target)) {
+      autoHiddenTargets.push(target);
+    } else {
+      primaryTargets.push(target);
+    }
+  }
+  const primaryHtml = renderTargetItems(tab, primaryTargets, "visible");
+  const hiddenFramesHtml = renderHiddenFramesSection(tab, autoHiddenTargets, hiddenTargets);
+  return `
+		<div class="target-list">
+			${primaryHtml}
+			${hiddenFramesHtml}
+		</div>
+	`;
+}
+function renderHiddenFramesSection(tab, autoHiddenTargets, manuallyHiddenTargets) {
+  const count = autoHiddenTargets.length + manuallyHiddenTargets.length;
+  if (count === 0) {
+    return "";
+  }
+  const hasSelectedAutoHiddenTarget = autoHiddenTargets.some((target) => isTargetSelected(tab.selectedFrameId, target.frameId));
+  const autoHiddenHtml = renderTargetItems(tab, autoHiddenTargets, "visible");
+  const manuallyHiddenHtml = renderTargetItems(tab, manuallyHiddenTargets, "hidden");
+  const expanded = hasSelectedAutoHiddenTarget ? "open" : "";
+  return `
+      <details class="target-collapsed target-hidden-list" ${expanded}>
+        <summary class="target-collapsed-toggle">
+          ${count} hidden frame${count === 1 ? "" : "s"}
+        </summary>
+        <div class="target-collapsed-list">
+          ${autoHiddenHtml}
+          ${manuallyHiddenHtml}
+        </div>
+      </details>
+  `;
+}
+function renderTargetItems(tab, targets, visibility) {
+  return targets.map((target) => renderTargetItem(tab, target, visibility)).join("");
+}
+function renderTargetItem(tab, target, visibility) {
+  const isSelected = isTargetSelected(tab.selectedFrameId, target.frameId);
+  const kindLabel = target.type === "page" ? "Page" : "Iframe";
+  const title = target.title || kindLabel;
+  const url = target.url || "(no url)";
+  const visibilityAction = renderTargetVisibilityAction(tab.tabId, target, visibility);
+  return `
+    <div class="target-item ${isSelected ? "selected" : ""} ${visibility === "hidden" ? "hidden-target" : ""}">
+      <button
+        class="target-select-action"
+        data-action="select-target"
+        data-tab-id="${tab.tabId}"
+        data-frame-id="${escapeHtml(target.frameId ?? "")}"
+        type="button"
+        ${visibility === "hidden" ? "disabled" : ""}
+      >
+        <span class="target-kind">${kindLabel}</span>
+        <span class="target-meta">
+          <span class="target-title" title="${escapeHtml(title)}">${escapeHtml(title)}</span>
+          <span class="target-url" title="${escapeHtml(url)}">${escapeHtml(url)}</span>
+        </span>
+      </button>
+      ${visibilityAction}
+    </div>
+  `;
+}
+function renderTargetVisibilityAction(tabId, target, visibility) {
+  if (target.type !== "iframe" || !target.frameId) {
+    return "";
+  }
+  const action = visibility === "hidden" ? "show-target" : "hide-target";
+  const label = visibility === "hidden" ? "Show iframe target" : "Hide iframe target";
+  const icon = visibility === "hidden" ? SHOW_TARGET_ICON : HIDE_TARGET_ICON;
+  return `
+		<button
+			class="target-visibility-action"
+			data-action="${action}"
+			data-tab-id="${tabId}"
+			data-frame-id="${escapeHtml(target.frameId)}"
+			type="button"
+			title="${label}"
+			aria-label="${label}"
+		>
+			${icon}
+		</button>
+	`;
+}
+function isTargetSelected(selectedFrameId, targetFrameId) {
+  return selectedFrameId !== void 0 && (selectedFrameId ?? null) === (targetFrameId ?? null);
+}
+function escapeHtml(text) {
+  const div = document.createElement("div");
+  div.textContent = text;
+  return div.innerHTML;
+}
+
+// src/popup/popup.ts
+var COPY_ICON = `
+	<svg viewBox="0 0 24 24" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+		<rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect>
+		<path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path>
+	</svg>
+`;
+var CHECK_ICON = `
+	<svg viewBox="0 0 16 16" fill="none" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+		<path d="M3 8.5l3.1 3.1L13 4.75"></path>
+	</svg>
+`;
+var DETACH_ICON = `
+	<svg viewBox="0 0 16 16" fill="none" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+		<path d="M5.4 1.75h5.2l3.65 3.65v5.2l-3.65 3.65H5.4l-3.65-3.65V5.4z"></path>
+		<path d="M6 6l4 4"></path>
+		<path d="M10 6l-4 4"></path>
+	</svg>
+`;
+var statusIndicator = document.getElementById("statusIndicator");
+var statusText = document.getElementById("statusText");
+var attachedSection = document.getElementById("attachedSection");
+var attachedContent = document.getElementById("attachedContent");
+var availableSection = document.getElementById("availableSection");
+var availableContent = document.getElementById("availableContent");
+var attachedCount = document.getElementById("attachedCount");
+var errorBanner = document.getElementById("errorBanner");
+var healthSummary = document.getElementById("healthSummary");
+var healthNativeHost = document.getElementById("healthNativeHost");
+var healthWatcherReady = document.getElementById("healthWatcherReady");
+var healthWatcherId = document.getElementById("healthWatcherId");
+var healthAttachedCount = document.getElementById("healthAttachedCount");
+var healthSelectedTarget = document.getElementById("healthSelectedTarget");
+var healthLastMessage = document.getElementById("healthLastMessage");
+var healthPid = document.getElementById("healthPid");
+var copyAllButton = document.getElementById("copyAllButton");
+var detachAllButton = document.getElementById("detachAllButton");
+var prevStateHash = "";
+var currentError = null;
+var latestCurrentWatcher = null;
+var latestWatchers = [];
+copyAllButton.addEventListener("click", () => {
+  void copyAllWatchersInfo().catch((error) => {
+    showError(error instanceof Error ? error.message : "Copy failed");
+  });
+});
+detachAllButton.addEventListener("click", () => {
+  void detachAllWatchers();
+});
+document.querySelector(".health-summary-actions")?.addEventListener("click", (event) => {
+  event.stopPropagation();
+});
+async function sendMessage(message) {
+  return new Promise((resolve) => {
+    chrome.runtime.sendMessage(message, resolve);
+  });
+}
+function setEmptyState(icon, message) {
+  availableSection.classList.remove("hidden");
+  attachedSection.classList.add("hidden");
+  availableContent.innerHTML = `
+      <div class="empty-state">
+        <div class="icon">${escapeHtml2(icon)}</div>
+        <div>${escapeHtml2(message)}</div>
+      </div>
+    `;
+}
+function updateStatus(connected, tabCount) {
+  statusIndicator.classList.toggle("connected", connected);
+  statusText.textContent = connected ? "Bridge connected" : "Bridge disconnected";
+  attachedCount.textContent = `${tabCount} attached`;
+}
+function showError(message) {
+  currentError = message;
+  errorBanner.textContent = message ?? "";
+  errorBanner.classList.toggle("hidden", !message);
+}
+function updateHealth(status, watcher) {
+  const target = watcher?.currentTarget ?? null;
+  const tabCount = status?.attachedTabs.length ?? 0;
+  const nativeHostConnected = watcher?.nativeHostConnected ?? status?.bridgeConnected ?? false;
+  const watcherReady = watcher?.watcherReady ?? false;
+  const targetState = watcher?.targetState ?? "not-selected";
+  healthSummary.textContent = buildHealthSummaryText({
+    nativeHostConnected,
+    watcherReady,
+    targetState,
+    watcherId: watcher?.watcherId ?? null,
+    tabCount
+  });
+  setHealthValueState(healthNativeHost, nativeHostConnected ? "Connected" : "Disconnected", nativeHostConnected ? "connected" : "disconnected");
+  setHealthValueState(healthWatcherReady, watcherReady ? "Ready" : "Not ready", watcherReady ? "connected" : "disconnected");
+  healthWatcherId.textContent = watcher?.watcherId ?? "-";
+  healthAttachedCount.textContent = String(tabCount);
+  setHealthValueState(healthSelectedTarget, formatTargetState(target, targetState), getTargetStateClass(targetState));
+  healthLastMessage.textContent = formatRelativeTimestamp(watcher?.lastMessageAt ?? null);
+  healthPid.textContent = watcher?.nativeHostPid ? String(watcher.nativeHostPid) : "-";
+  const hasWatchers = latestWatchers.length > 0;
+  copyAllButton.disabled = !hasWatchers;
+  detachAllButton.disabled = !hasWatchers;
+}
+function buildHealthSummaryText(input) {
+  const parts = [];
+  if (input.watcherId) parts.push(input.watcherId);
+  parts.push(input.nativeHostConnected ? "Host connected" : "Host disconnected");
+  parts.push(input.watcherReady ? "Watcher ready" : "Watcher not ready");
+  if (input.targetState === "rebinding") parts.push("Target rebinding");
+  if (input.tabCount > 0) parts.push(`${input.tabCount} tab${input.tabCount === 1 ? "" : "s"}`);
+  return parts.join(" \xB7 ");
+}
+function setHealthValueState(element, text, stateClass) {
+  element.textContent = text;
+  element.classList.toggle("connected", stateClass === "connected");
+  element.classList.toggle("disconnected", stateClass === "disconnected");
+  element.classList.toggle("warning", stateClass === "warning");
+}
+function formatTargetState(target, state) {
+  if (!target || state === "not-selected") {
+    return "-";
+  }
+  const label = target.type === "page" ? "Page" : "Iframe";
+  return state === "ready" ? `${label} ready` : `${label} rebinding`;
+}
+function getTargetStateClass(state) {
+  if (state === "ready") {
+    return "connected";
+  }
+  if (state === "rebinding") {
+    return "warning";
+  }
+  return null;
+}
+function renderTabs(tabs, currentTabId) {
+  if (tabs.length === 0) {
+    setEmptyState("\u{1F50D}", "No tabs available");
+    return;
+  }
+  const attachedTabs = tabs.filter((tab) => tab.attached);
+  let availableTabs = tabs.filter((tab) => !tab.attached);
+  if (currentTabId !== void 0) {
+    const currentTabIndex = availableTabs.findIndex((tab) => tab.tabId === currentTabId);
+    if (currentTabIndex > 0) {
+      const [currentTab] = availableTabs.splice(currentTabIndex, 1);
+      availableTabs.unshift(currentTab);
+    }
+  }
+  renderTabGroup(attachedSection, attachedContent, attachedTabs, true);
+  renderTabGroup(availableSection, availableContent, availableTabs, false);
+}
+function renderTabItem(tab, showTargets) {
+  const favicon = tab.faviconUrl ? `<img class="tab-favicon" src="${escapeHtml2(tab.faviconUrl)}" alt="">` : `<div class="tab-favicon" style="background: #e0e0e0"></div>`;
+  const watcherSuffix = tab.attached && tab.watcher?.watcherId ? ` (${tab.watcher.watcherId})` : "";
+  const actions = tab.attached ? renderAttachedTabActions(tab.tabId) : renderAttachButton(tab.tabId);
+  const fullTitle = (tab.title || "Untitled") + watcherSuffix;
+  return `
+    <div class="tab-item ${tab.attached ? "attached" : ""}" data-tab-id="${tab.tabId}">
+      ${favicon}
+      <div class="tab-info">
+        <div class="tab-title" title="${escapeHtml2(fullTitle)}">${escapeHtml2(fullTitle)}</div>
+        <div class="tab-url" title="${escapeHtml2(tab.url)}">${escapeHtml2(tab.url)}</div>
+      </div>
+      ${actions}
+    </div>
+    ${showTargets ? renderTargetList(tab) : ""}
+  `;
+}
+function renderTabGroup(section, content, tabs, showTargets) {
+  if (tabs.length === 0) {
+    section.classList.add("hidden");
+    content.innerHTML = "";
+    return;
+  }
+  section.classList.remove("hidden");
+  content.innerHTML = `<div class="tab-list">${tabs.map((tab) => renderTabItem(tab, showTargets)).join("")}</div>`;
+  bindTabInteractions(content);
+}
+function bindTabInteractions(root) {
+  root.querySelectorAll(".tab-action").forEach((button) => {
+    button.addEventListener("click", handleTabAction);
+  });
+  root.querySelectorAll('[data-action="select-target"]').forEach((button) => {
+    button.addEventListener("click", handleTargetSelection);
+  });
+  root.querySelectorAll('[data-action="hide-target"], [data-action="show-target"]').forEach((button) => {
+    button.addEventListener("click", handleTargetVisibility);
+  });
+  root.querySelectorAll(".tab-item").forEach((item) => {
+    item.addEventListener("click", handleTabItemClick);
+  });
+}
+function renderAttachedTabActions(tabId) {
+  return `
+		<div class="tab-actions">
+			${renderIconActionButton(tabId, "copy-info", "copy", "Copy watcher info", COPY_ICON)}
+			${renderIconActionButton(tabId, "detach", "detach", "Detach", DETACH_ICON)}
+		</div>
+	`;
+}
+function renderAttachButton(tabId) {
+  return `<button class="tab-action attach" data-tab-id="${tabId}" data-action="attach" type="button">Attach</button>`;
+}
+function renderIconActionButton(tabId, action, variant, label, icon) {
+  return `
+		<button
+			class="tab-action icon-only ${variant}"
+			data-tab-id="${tabId}"
+			data-action="${action}"
+			type="button"
+			title="${label}"
+			aria-label="${label}"
+		>
+			<span class="tab-action-icon" aria-hidden="true">${icon}</span>
+		</button>
+	`;
+}
+async function handleTabItemClick(event) {
+  const target = event.target;
+  if (target.closest(".tab-action")) {
+    return;
+  }
+  const tabItem = event.currentTarget;
+  const tabId = getTabId(tabItem);
+  const action = getTabItemAction(tabItem);
+  tabItem.style.opacity = "0.6";
+  tabItem.style.pointerEvents = "none";
+  try {
+    await runPopupAction(action, { tabId });
+    if (action === "attach") {
+      await refreshTabs(true);
+    }
+  } catch (error) {
+    showError(error instanceof Error ? error.message : `${capitalize(action)} failed`);
+    tabItem.style.opacity = "1";
+    tabItem.style.pointerEvents = "auto";
+  }
+}
+function getTabItemAction(tabItem) {
+  return tabItem.classList.contains("attached") ? "focusTab" : "attach";
+}
+async function handleTabAction(event) {
+  const button = event.target.closest(".tab-action");
+  if (!button) {
+    return;
+  }
+  const tabId = getTabId(button);
+  const action = button.dataset.action;
+  if (action === "copy-info") {
+    try {
+      await copyWatcherInfo(tabId, button);
+    } catch (error) {
+      showError(error instanceof Error ? error.message : "Copy failed");
+    }
+    return;
+  }
+  const restoreButton = setBusyButtonState(button, action);
+  try {
+    await runPopupAction(action, { tabId });
+    await refreshTabs(true);
+  } catch (error) {
+    showError(error instanceof Error ? error.message : `${capitalize(action)} failed`);
+    restoreButton();
+  }
+}
+async function handleTargetSelection(event) {
+  const button = event.currentTarget;
+  const tabId = getTabId(button);
+  const frameId = button.dataset.frameId || null;
+  button.disabled = true;
+  try {
+    await runPopupAction("selectTarget", { tabId, frameId });
+    await refreshTabs(true);
+  } catch (error) {
+    showError(error instanceof Error ? error.message : "Target selection failed");
+    button.disabled = false;
+  }
+}
+async function handleTargetVisibility(event) {
+  event.stopPropagation();
+  const button = event.currentTarget;
+  const tabId = getTabId(button);
+  const frameId = button.dataset.frameId || null;
+  const action = button.dataset.action === "show-target" ? "showTarget" : "hideTarget";
+  button.disabled = true;
+  try {
+    await runPopupAction(action, { tabId, frameId });
+    await refreshTabs(true);
+  } catch (error) {
+    showError(error instanceof Error ? error.message : action === "hideTarget" ? "Target hide failed" : "Target restore failed");
+    button.disabled = false;
+  }
+}
+async function runPopupAction(action, args) {
+  const response = await sendMessage({ action, ...args });
+  if (!response.success) {
+    throw new Error(response.error ?? `${capitalize(action)} failed`);
+  }
+  showError(null);
+}
+async function refreshTabs(forceRender = false) {
+  try {
+    const [statusResponse, tabsResponse, activeTab] = await Promise.all([
+      sendMessage({ action: "getStatus" }),
+      sendMessage({ action: "getTargets" }),
+      getCurrentTab()
+    ]);
+    if (!statusResponse.success) {
+      throw new Error(statusResponse.error ?? "Failed to load bridge status");
+    }
+    const status = statusResponse.status;
+    latestWatchers = status?.watchers ?? [];
+    latestCurrentWatcher = selectCurrentWatcher(status ?? null, tabsResponse.tabs ?? [], activeTab?.id);
+    const stateHash = JSON.stringify({
+      status,
+      tabs: tabsResponse.tabs,
+      currentTabId: activeTab?.id,
+      error: currentError ?? tabsResponse.error ?? null
+    });
+    if (!forceRender && stateHash === prevStateHash) {
+      return;
+    }
+    prevStateHash = stateHash;
+    updateStatus(status?.bridgeConnected ?? false, status?.attachedTabs.length ?? 0);
+    updateHealth(status, latestCurrentWatcher);
+    if (tabsResponse.success && tabsResponse.tabs) {
+      renderTabs(tabsResponse.tabs, activeTab?.id);
+      showError(currentError);
+      return;
+    }
+    showError(tabsResponse.error ?? "Failed to load tabs");
+    setEmptyState("\u26A0\uFE0F", tabsResponse.error ?? "Failed to load tabs");
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Failed to refresh popup";
+    showError(message);
+    updateStatus(false, 0);
+    latestWatchers = [];
+    latestCurrentWatcher = null;
+    updateHealth(void 0, null);
+    setEmptyState("\u26A0\uFE0F", message);
+  }
+}
+function formatRelativeTimestamp(timestamp) {
+  if (!timestamp) {
+    return "-";
+  }
+  const elapsedMs = Math.max(0, Date.now() - timestamp);
+  if (elapsedMs < 1e3) {
+    return "Just now";
+  }
+  const elapsedSeconds = Math.floor(elapsedMs / 1e3);
+  if (elapsedSeconds < 60) {
+    return `${elapsedSeconds}s ago`;
+  }
+  const elapsedMinutes = Math.floor(elapsedSeconds / 60);
+  if (elapsedMinutes < 60) {
+    return `${elapsedMinutes}m ago`;
+  }
+  const elapsedHours = Math.floor(elapsedMinutes / 60);
+  return `${elapsedHours}h ago`;
+}
+async function copyWatcherInfo(tabId, button) {
+  const watcher = findWatcherByTabId(latestWatchers, tabId);
+  const text = buildWatcherInfoText(watcher);
+  if (!text) {
+    return;
+  }
+  await copyTextToClipboard(text);
+  showError(null);
+  restoreButtonFeedback(button, "Copied!", 1500, CHECK_ICON);
+}
+async function copyAllWatchersInfo() {
+  const text = buildAllWatchersInfoText(latestWatchers);
+  if (!text) {
+    return;
+  }
+  await copyTextToClipboard(text);
+  showError(null);
+  restoreButtonFeedback(copyAllButton, "Copied!");
+}
+async function copyTextToClipboard(text) {
+  try {
+    await navigator.clipboard.writeText(text);
+    return;
+  } catch {
+  }
+  const textarea = document.createElement("textarea");
+  textarea.value = text;
+  textarea.setAttribute("readonly", "true");
+  textarea.style.position = "fixed";
+  textarea.style.opacity = "0";
+  textarea.style.pointerEvents = "none";
+  document.body.appendChild(textarea);
+  textarea.select();
+  textarea.setSelectionRange(0, textarea.value.length);
+  try {
+    const copied = document.execCommand("copy");
+    if (!copied) {
+      throw new Error("Browser denied clipboard write");
+    }
+  } finally {
+    textarea.remove();
+  }
+}
+async function detachAllWatchers() {
+  if (latestWatchers.length === 0) {
+    return;
+  }
+  const restoreBusyState = setButtonFeedback(detachAllButton, "Detaching...");
+  const failures = await detachWatchers(latestWatchers.map((watcher) => watcher.tabId));
+  restoreBusyState();
+  await refreshTabs(true);
+  if (failures.length > 0) {
+    showError(buildDetachAllError(failures.length));
+    return;
+  }
+  showError(null);
+  restoreButtonFeedback(detachAllButton, "Detached!");
+}
+async function detachWatchers(tabIds) {
+  const failures = [];
+  for (const tabId of tabIds) {
+    try {
+      await runPopupAction("detach", { tabId });
+    } catch {
+      failures.push(tabId);
+    }
+  }
+  return failures;
+}
+function setBusyButtonState(button, action) {
+  const previousMarkup = button.innerHTML;
+  const restoreFeedback = setButtonFeedback(button, action === "attach" ? "Attaching..." : "Detaching...");
+  if (action === "attach") {
+    button.textContent = "Attaching...";
+  }
+  return () => {
+    button.innerHTML = previousMarkup;
+    restoreFeedback();
+  };
+}
+function restoreButtonFeedback(button, label, timeoutMs = 1500, iconMarkup) {
+  const restore = setButtonFeedback(button, label, iconMarkup);
+  setTimeout(restore, timeoutMs);
+}
+function setButtonFeedback(button, label, iconMarkup) {
+  const previousTitle = button.title;
+  const previousLabel = button.getAttribute("aria-label");
+  const previousText = getButtonLabel(button);
+  const previousIcon = getButtonIconMarkup(button);
+  const previousDisabled = button.disabled;
+  button.disabled = true;
+  button.title = label;
+  button.setAttribute("aria-label", label);
+  setButtonLabel(button, label);
+  if (iconMarkup) {
+    setButtonIconMarkup(button, iconMarkup);
+  }
+  return () => {
+    button.disabled = previousDisabled;
+    button.title = previousTitle;
+    button.setAttribute("aria-label", previousLabel ?? previousTitle);
+    setButtonLabel(button, previousText);
+    setButtonIconMarkup(button, previousIcon);
+  };
+}
+function buildWatcherInfoText(watcher) {
+  if (!canCopyWatcherInfo(watcher)) {
+    return null;
+  }
+  const readyWatcher = watcher;
+  const target = readyWatcher.currentTarget;
+  const attached = target.attachedAt ? new Date(target.attachedAt).toISOString() : (/* @__PURE__ */ new Date()).toISOString();
+  const fields = [
+    ["ID", readyWatcher.watcherId],
+    ["Host", `${readyWatcher.watcherHost}:${readyWatcher.watcherPort}`],
+    ["PID", String(readyWatcher.nativeHostPid)],
+    ["Target", target.title || "(no title)"],
+    ["URL", target.url || "(no url)"],
+    ["Attached", attached]
+  ];
+  return `Argus Watcher Info
+${fields.map(([label, value]) => `${label}: ${value}`).join("\n")}`;
+}
+function buildAllWatchersInfoText(watchers) {
+  const watcherInfo = watchers.map((watcher) => buildWatcherInfoText(watcher)).filter((text) => Boolean(text));
+  if (watcherInfo.length === 0) {
+    return null;
+  }
+  return watcherInfo.join("\n\n");
+}
+function buildDetachAllError(failureCount) {
+  return failureCount === 1 ? "Failed to detach 1 watcher" : `Failed to detach ${failureCount} watchers`;
+}
+function capitalize(text) {
+  return text.charAt(0).toUpperCase() + text.slice(1);
+}
+function selectCurrentWatcher(status, tabs, activeTabId) {
+  if (!status) {
+    return null;
+  }
+  if (activeTabId !== void 0) {
+    const activeWatcher = findWatcherByTabId(status.watchers, activeTabId);
+    if (activeWatcher) {
+      return activeWatcher;
+    }
+  }
+  for (const tab of tabs) {
+    if (!tab.attached) {
+      continue;
+    }
+    const watcher = findWatcherByTabId(status.watchers, tab.tabId);
+    if (watcher) {
+      return watcher;
+    }
+  }
+  return status.watchers[0] ?? null;
+}
+function canCopyWatcherInfo(watcher) {
+  return Boolean(watcher?.watcherId && watcher?.watcherHost && watcher?.watcherPort != null && watcher?.nativeHostPid && watcher?.currentTarget);
+}
+function findWatcherByTabId(watchers, tabId) {
+  return watchers.find((watcher) => watcher.tabId === tabId) ?? null;
+}
+function getTabId(element) {
+  return parseInt(element.dataset.tabId ?? "0", 10);
+}
+function getButtonLabel(button) {
+  return button.querySelector("[data-button-label]")?.textContent ?? "";
+}
+function setButtonLabel(button, label) {
+  const labelNode = button.querySelector("[data-button-label]");
+  if (labelNode) {
+    labelNode.textContent = label;
+  }
+}
+function getButtonIconMarkup(button) {
+  return button.querySelector(".tab-action-icon")?.innerHTML ?? "";
+}
+function setButtonIconMarkup(button, iconMarkup) {
+  const iconNode = button.querySelector(".tab-action-icon");
+  if (iconNode) {
+    iconNode.innerHTML = iconMarkup;
+  }
+}
+function escapeHtml2(text) {
+  const div = document.createElement("div");
+  div.textContent = text;
+  return div.innerHTML;
+}
+async function getCurrentTab() {
+  const tabs = await chrome.tabs.query({ active: true, currentWindow: true });
+  return tabs[0];
+}
+void refreshTabs();
+setInterval(() => {
+  void refreshTabs();
+}, 2e3);
+//# sourceMappingURL=popup.js.map