@flrande/bak-extension 0.6.3 → 0.6.5

package/src/background.ts

@@ -59,11 +59,47 @@ interface ExtensionConfig {
   debugRichText: boolean;
 }
 
-interface RuntimeErrorDetails {
-  message: string;
-  context: 'config' | 'socket' | 'request' | 'parse';
-  at: number;
-}
+interface RuntimeErrorDetails {
+  message: string;
+  context: 'config' | 'socket' | 'request' | 'parse';
+  at: number;
+}
+
+interface PopupSessionBindingSummary {
+  id: string;
+  label: string;
+  tabCount: number;
+  activeTabId: number | null;
+  windowId: number | null;
+  groupId: number | null;
+  detached: boolean;
+}
+
+interface PopupState {
+  ok: true;
+  connected: boolean;
+  connectionState: 'connected' | 'connecting' | 'reconnecting' | 'disconnected' | 'manual' | 'missing-token';
+  hasToken: boolean;
+  port: number;
+  wsUrl: string;
+  debugRichText: boolean;
+  lastError: string | null;
+  lastErrorAt: number | null;
+  lastErrorContext: RuntimeErrorDetails['context'] | null;
+  reconnectAttempt: number;
+  nextReconnectInMs: number | null;
+  manualDisconnect: boolean;
+  extensionVersion: string;
+  lastBindingUpdateAt: number | null;
+  lastBindingUpdateReason: string | null;
+  sessionBindings: {
+    count: number;
+    attachedCount: number;
+    detachedCount: number;
+    tabCount: number;
+    items: PopupSessionBindingSummary[];
+  };
+}
 
 const DEFAULT_PORT = 17373;
 const STORAGE_KEY_TOKEN = 'pairToken';
@@ -112,10 +148,14 @@ const REPLAY_FORBIDDEN_HEADER_NAMES = new Set([
 let ws: WebSocket | null = null;
 let reconnectTimer: number | null = null;
 let nextReconnectInMs: number | null = null;
+let nextReconnectAt: number | null = null;
 let reconnectAttempt = 0;
 let lastError: RuntimeErrorDetails | null = null;
 let manualDisconnect = false;
 let sessionBindingStateMutationQueue: Promise<void> = Promise.resolve();
+let preserveHumanFocusDepth = 0;
+let lastBindingUpdateAt: number | null = null;
+let lastBindingUpdateReason: string | null = null;
 
 async function getConfig(): Promise<ExtensionConfig> {
   const stored = await chrome.storage.local.get([STORAGE_KEY_TOKEN, STORAGE_KEY_PORT, STORAGE_KEY_DEBUG_RICH_TEXT]);
@@ -150,19 +190,33 @@ function setRuntimeError(message: string, context: RuntimeErrorDetails['context'
   };
 }
 
-function clearReconnectTimer(): void {
-  if (reconnectTimer !== null) {
-    clearTimeout(reconnectTimer);
-    reconnectTimer = null;
-  }
-  nextReconnectInMs = null;
-}
+function clearReconnectTimer(): void {
+  if (reconnectTimer !== null) {
+    clearTimeout(reconnectTimer);
+    reconnectTimer = null;
+  }
+  nextReconnectInMs = null;
+  nextReconnectAt = null;
+}
 
-function sendResponse(payload: CliResponse): void {
-  if (ws && ws.readyState === WebSocket.OPEN) {
-    ws.send(JSON.stringify(payload));
-  }
-}
+function sendResponse(payload: CliResponse): void {
+  if (ws && ws.readyState === WebSocket.OPEN) {
+    ws.send(JSON.stringify(payload));
+  }
+}
+
+function sendEvent(event: string, data: Record<string, unknown>): void {
+  if (ws && ws.readyState === WebSocket.OPEN) {
+    ws.send(
+      JSON.stringify({
+        type: 'event',
+        event,
+        data,
+        ts: Date.now()
+      })
+    );
+  }
+}
 
 function toError(code: string, message: string, data?: Record<string, unknown>): CliResponse['error'] {
   return { code, message, data };
@@ -250,9 +304,71 @@ async function loadSessionBindingState(bindingId: string): Promise<SessionBindin
   return stateMap[bindingId] ?? null;
 }
 
-async function listSessionBindingStates(): Promise<SessionBindingRecord[]> {
-  return Object.values(await loadSessionBindingStateMap());
-}
+async function listSessionBindingStates(): Promise<SessionBindingRecord[]> {
+  return Object.values(await loadSessionBindingStateMap());
+}
+
+function summarizeSessionBindings(states: SessionBindingRecord[]): PopupState['sessionBindings'] {
+  const items = states.map((state) => {
+    const detached = state.windowId === null || state.tabIds.length === 0;
+    return {
+      id: state.id,
+      label: state.label,
+      tabCount: state.tabIds.length,
+      activeTabId: state.activeTabId,
+      windowId: state.windowId,
+      groupId: state.groupId,
+      detached
+    } satisfies PopupSessionBindingSummary;
+  });
+  return {
+    count: items.length,
+    attachedCount: items.filter((item) => !item.detached).length,
+    detachedCount: items.filter((item) => item.detached).length,
+    tabCount: items.reduce((sum, item) => sum + item.tabCount, 0),
+    items
+  };
+}
+
+async function buildPopupState(): Promise<PopupState> {
+  const config = await getConfig();
+  const sessionBindings = summarizeSessionBindings(await listSessionBindingStates());
+  const reconnectRemainingMs = nextReconnectAt === null ? null : Math.max(0, nextReconnectAt - Date.now());
+  let connectionState: PopupState['connectionState'];
+  if (!config.token) {
+    connectionState = 'missing-token';
+  } else if (ws?.readyState === WebSocket.OPEN) {
+    connectionState = 'connected';
+  } else if (ws?.readyState === WebSocket.CONNECTING) {
+    connectionState = 'connecting';
+  } else if (manualDisconnect) {
+    connectionState = 'manual';
+  } else if (nextReconnectInMs !== null) {
+    connectionState = 'reconnecting';
+  } else {
+    connectionState = 'disconnected';
+  }
+
+  return {
+    ok: true,
+    connected: ws?.readyState === WebSocket.OPEN,
+    connectionState,
+    hasToken: Boolean(config.token),
+    port: config.port,
+    wsUrl: `ws://127.0.0.1:${config.port}/extension`,
+    debugRichText: config.debugRichText,
+    lastError: lastError?.message ?? null,
+    lastErrorAt: lastError?.at ?? null,
+    lastErrorContext: lastError?.context ?? null,
+    reconnectAttempt,
+    nextReconnectInMs: reconnectRemainingMs,
+    manualDisconnect,
+    extensionVersion: EXTENSION_VERSION,
+    lastBindingUpdateAt,
+    lastBindingUpdateReason,
+    sessionBindings
+  };
+}
 
 async function saveSessionBindingState(state: SessionBindingRecord): Promise<void> {
   await mutateSessionBindingStateMap((stateMap) => {
@@ -265,6 +381,35 @@ async function deleteSessionBindingState(bindingId: string): Promise<void> {
     delete stateMap[bindingId];
   });
 }
+
+function toSessionBindingEventBrowser(state: SessionBindingRecord | null): Record<string, unknown> | null {
+  if (!state) {
+    return null;
+  }
+  return {
+    windowId: state.windowId,
+    groupId: state.groupId,
+    tabIds: [...state.tabIds],
+    activeTabId: state.activeTabId,
+    primaryTabId: state.primaryTabId
+  };
+}
+
+function emitSessionBindingUpdated(
+  bindingId: string,
+  reason: string,
+  state: SessionBindingRecord | null,
+  extras: Record<string, unknown> = {}
+): void {
+  lastBindingUpdateAt = Date.now();
+  lastBindingUpdateReason = reason;
+  sendEvent('sessionBinding.updated', {
+    bindingId,
+    reason,
+    browser: toSessionBindingEventBrowser(state),
+    ...extras
+  });
+}
 
 const sessionBindingBrowser: SessionBindingBrowser = {
   async getTab(tabId) {
@@ -673,18 +818,23 @@ async function restoreFocusContext(context: FocusContext): Promise<void> {
   }
 }
 
-async function preserveHumanFocus<T>(enabled: boolean, action: () => Promise<T>): Promise<T> {
-  if (!enabled) {
-    return action();
-  }
-
-  const focusContext = await captureFocusContext();
-  try {
-    return await action();
-  } finally {
-    await restoreFocusContext(focusContext);
-  }
-}
+async function preserveHumanFocus<T>(enabled: boolean, action: () => Promise<T>): Promise<T> {
+  if (!enabled) {
+    return action();
+  }
+
+  const focusContext = await captureFocusContext();
+  preserveHumanFocusDepth += 1;
+  try {
+    return await action();
+  } finally {
+    try {
+      await restoreFocusContext(focusContext);
+    } finally {
+      preserveHumanFocusDepth = Math.max(0, preserveHumanFocusDepth - 1);
+    }
+  }
+}
 
 function requireRpcEnvelope(
   method: string,
@@ -1686,11 +1836,13 @@ async function handleRequest(request: CliRequest): Promise<unknown> {
         const result = await bindingManager.ensureBinding({
           bindingId: String(params.bindingId ?? ''),
           focus: params.focus === true,
-          initialUrl: typeof params.url === 'string' ? params.url : undefined
+          initialUrl: typeof params.url === 'string' ? params.url : undefined,
+          label: typeof params.label === 'string' ? params.label : undefined
         });
         for (const tab of result.binding.tabs) {
           void ensureNetworkDebugger(tab.id).catch(() => undefined);
         }
+        emitSessionBindingUpdated(result.binding.id, 'ensure', result.binding);
         return {
           browser: result.binding,
           created: result.created,
@@ -1711,11 +1863,13 @@ async function handleRequest(request: CliRequest): Promise<unknown> {
           bindingId: String(params.bindingId ?? ''),
           url: expectedUrl,
           active: params.active === true,
-          focus: params.focus === true
+          focus: params.focus === true,
+          label: typeof params.label === 'string' ? params.label : undefined
         });
       });
       const finalized = await finalizeOpenedSessionBindingTab(opened, expectedUrl);
       void ensureNetworkDebugger(finalized.tab.id).catch(() => undefined);
+      emitSessionBindingUpdated(finalized.binding.id, 'open-tab', finalized.binding);
       return {
         browser: finalized.binding,
         tab: finalized.tab
@@ -1738,6 +1892,7 @@ async function handleRequest(request: CliRequest): Promise<unknown> {
     case 'sessionBinding.setActiveTab': {
       const result = await bindingManager.setActiveTab(Number(params.tabId), String(params.bindingId ?? ''));
       void ensureNetworkDebugger(result.tab.id).catch(() => undefined);
+      emitSessionBindingUpdated(result.binding.id, 'set-active-tab', result.binding);
       return {
         browser: result.binding,
         tab: result.tab
@@ -1755,8 +1910,10 @@ async function handleRequest(request: CliRequest): Promise<unknown> {
         const result = await bindingManager.reset({
           bindingId: String(params.bindingId ?? ''),
           focus: params.focus === true,
-          initialUrl: typeof params.url === 'string' ? params.url : undefined
+          initialUrl: typeof params.url === 'string' ? params.url : undefined,
+          label: typeof params.label === 'string' ? params.label : undefined
         });
+        emitSessionBindingUpdated(result.binding.id, 'reset', result.binding);
         return {
           browser: result.binding,
           created: result.created,
@@ -1765,8 +1922,22 @@ async function handleRequest(request: CliRequest): Promise<unknown> {
         };
       });
     }
+    case 'sessionBinding.closeTab': {
+      const bindingId = String(params.bindingId ?? '');
+      const result = await bindingManager.closeTab(bindingId, typeof params.tabId === 'number' ? params.tabId : undefined);
+      emitSessionBindingUpdated(bindingId, 'close-tab', result.binding, {
+        closedTabId: result.closedTabId
+      });
+      return {
+        browser: result.binding,
+        closedTabId: result.closedTabId
+      };
+    }
     case 'sessionBinding.close': {
-      return await bindingManager.close(String(params.bindingId ?? ''));
+      const bindingId = String(params.bindingId ?? '');
+      const result = await bindingManager.close(bindingId);
+      emitSessionBindingUpdated(bindingId, 'close', null);
+      return result;
     }
     case 'page.goto': {
       return await preserveHumanFocus(typeof target.tabId !== 'number', async () => {
@@ -2269,14 +2440,16 @@ function scheduleReconnect(reason: string): void {
     return;
   }
 
-  const delayMs = computeReconnectDelayMs(reconnectAttempt);
-  reconnectAttempt += 1;
-  nextReconnectInMs = delayMs;
-  reconnectTimer = setTimeout(() => {
-    reconnectTimer = null;
-    nextReconnectInMs = null;
-    void connectWebSocket();
-  }, delayMs) as unknown as number;
+  const delayMs = computeReconnectDelayMs(reconnectAttempt);
+  reconnectAttempt += 1;
+  nextReconnectInMs = delayMs;
+  nextReconnectAt = Date.now() + delayMs;
+  reconnectTimer = setTimeout(() => {
+    reconnectTimer = null;
+    nextReconnectInMs = null;
+    nextReconnectAt = null;
+    void connectWebSocket();
+  }, delayMs) as unknown as number;
 
   if (!lastError) {
     setRuntimeError(`Reconnect scheduled: ${reason}`, 'socket');
@@ -2299,26 +2472,30 @@ async function connectWebSocket(): Promise<void> {
     return;
   }
 
-  const url = `ws://127.0.0.1:${config.port}/extension?token=${encodeURIComponent(config.token)}`;
-  ws = new WebSocket(url);
-
-  ws.addEventListener('open', () => {
-    manualDisconnect = false;
-    reconnectAttempt = 0;
-    lastError = null;
-    ws?.send(JSON.stringify({
+  const url = `ws://127.0.0.1:${config.port}/extension?token=${encodeURIComponent(config.token)}`;
+  const socket = new WebSocket(url);
+  ws = socket;
+
+  socket.addEventListener('open', () => {
+    if (ws !== socket) {
+      return;
+    }
+    manualDisconnect = false;
+    reconnectAttempt = 0;
+    lastError = null;
+    socket.send(JSON.stringify({
       type: 'hello',
       role: 'extension',
       version: EXTENSION_VERSION,
       ts: Date.now()
     }));
   });
-
-  ws.addEventListener('message', (event) => {
-    try {
-      const request = JSON.parse(String(event.data)) as CliRequest;
-      if (!request.id || !request.method) {
-        return;
+
+  socket.addEventListener('message', (event) => {
+    try {
+      const request = JSON.parse(String(event.data)) as CliRequest;
+      if (!request.id || !request.method) {
+        return;
       }
       void handleRequest(request)
         .then((result) => {
@@ -2335,66 +2512,109 @@ async function connectWebSocket(): Promise<void> {
         ok: false,
         error: toError('E_INTERNAL', error instanceof Error ? error.message : String(error))
       });
-    }
-  });
-
-  ws.addEventListener('close', () => {
-    ws = null;
-    scheduleReconnect('socket-closed');
-  });
-
-  ws.addEventListener('error', () => {
-    setRuntimeError('Cannot connect to bak cli', 'socket');
-    ws?.close();
-  });
-}
+    }
+  });
+
+  socket.addEventListener('close', () => {
+    if (ws !== socket) {
+      return;
+    }
+    ws = null;
+    scheduleReconnect('socket-closed');
+  });
+
+  socket.addEventListener('error', () => {
+    if (ws !== socket) {
+      return;
+    }
+    setRuntimeError('Cannot connect to bak cli', 'socket');
+    socket.close();
+  });
+}
 
 chrome.tabs.onRemoved.addListener((tabId) => {
   dropNetworkCapture(tabId);
   void mutateSessionBindingStateMap((stateMap) => {
+    const updates: Array<{ bindingId: string; state: SessionBindingRecord | null }> = [];
     for (const [bindingId, state] of Object.entries(stateMap)) {
       if (!state.tabIds.includes(tabId)) {
         continue;
       }
       const nextTabIds = state.tabIds.filter((id) => id !== tabId);
-      stateMap[bindingId] = {
+      if (nextTabIds.length === 0) {
+        delete stateMap[bindingId];
+        updates.push({ bindingId, state: null });
+        continue;
+      }
+      const fallbackTabId = nextTabIds[0] ?? null;
+      const nextState: SessionBindingRecord = {
         ...state,
         tabIds: nextTabIds,
-        activeTabId: state.activeTabId === tabId ? null : state.activeTabId,
-        primaryTabId: state.primaryTabId === tabId ? null : state.primaryTabId
+        activeTabId: state.activeTabId === tabId ? fallbackTabId : state.activeTabId,
+        primaryTabId: state.primaryTabId === tabId ? fallbackTabId : state.primaryTabId
       };
+      stateMap[bindingId] = nextState;
+      updates.push({ bindingId, state: nextState });
+    }
+    return updates;
+  }).then((updates) => {
+    for (const update of updates) {
+      emitSessionBindingUpdated(update.bindingId, 'tab-removed', update.state, {
+        closedTabId: tabId
+      });
     }
   });
 });
 
 chrome.tabs.onActivated.addListener((activeInfo) => {
-  void mutateSessionBindingStateMap((stateMap) => {
-    for (const [bindingId, state] of Object.entries(stateMap)) {
-      if (state.windowId !== activeInfo.windowId || !state.tabIds.includes(activeInfo.tabId)) {
-        continue;
+  if (preserveHumanFocusDepth > 0) {
+    return;
+  }
+  void chrome.windows
+    .get(activeInfo.windowId)
+    .then((window) => window.focused === true)
+    .catch(() => false)
+    .then((windowFocused) => {
+      if (!windowFocused) {
+        return [] as Array<{ bindingId: string; state: SessionBindingRecord }>;
       }
-      stateMap[bindingId] = {
-        ...state,
-        activeTabId: activeInfo.tabId
-      };
-    }
-  });
+      return mutateSessionBindingStateMap((stateMap) => {
+        const updates: Array<{ bindingId: string; state: SessionBindingRecord }> = [];
+        for (const [bindingId, state] of Object.entries(stateMap)) {
+          if (state.windowId !== activeInfo.windowId || !state.tabIds.includes(activeInfo.tabId)) {
+            continue;
+          }
+          const nextState: SessionBindingRecord = {
+            ...state,
+            activeTabId: activeInfo.tabId
+          };
+          stateMap[bindingId] = nextState;
+          updates.push({ bindingId, state: nextState });
+        }
+        return updates;
+      });
+    })
+    .then((updates) => {
+      for (const update of updates) {
+        emitSessionBindingUpdated(update.bindingId, 'tab-activated', update.state);
+      }
+    });
 });
 
 chrome.windows.onRemoved.addListener((windowId) => {
   void mutateSessionBindingStateMap((stateMap) => {
+    const updates: Array<{ bindingId: string; state: SessionBindingRecord | null }> = [];
     for (const [bindingId, state] of Object.entries(stateMap)) {
       if (state.windowId !== windowId) {
         continue;
       }
-      stateMap[bindingId] = {
-        ...state,
-        windowId: null,
-        groupId: null,
-        tabIds: [],
-        activeTabId: null,
-        primaryTabId: null
-      };
+      delete stateMap[bindingId];
+      updates.push({ bindingId, state: null });
+    }
+    return updates;
+  }).then((updates) => {
+    for (const update of updates) {
+      emitSessionBindingUpdated(update.bindingId, 'window-removed', update.state);
     }
   });
 });
@@ -2410,48 +2630,49 @@ chrome.runtime.onStartup.addListener(() => {
 void connectWebSocket();
 
 chrome.runtime.onMessage.addListener((message, _sender, sendResponse) => {
-  if (message?.type === 'bak.updateConfig') {
-    manualDisconnect = false;
-    void setConfig({
-      token: message.token,
-      port: Number(message.port ?? DEFAULT_PORT),
-      debugRichText: message.debugRichText === true
-    }).then(() => {
-      ws?.close();
-      void connectWebSocket().then(() => sendResponse({ ok: true }));
-    });
-    return true;
-  }
-
-  if (message?.type === 'bak.getState') {
-    void getConfig().then((config) => {
-      sendResponse({
-        ok: true,
-        connected: ws?.readyState === WebSocket.OPEN,
-        hasToken: Boolean(config.token),
-        port: config.port,
-        debugRichText: config.debugRichText,
-        lastError: lastError?.message ?? null,
-        lastErrorAt: lastError?.at ?? null,
-        lastErrorContext: lastError?.context ?? null,
-        reconnectAttempt,
-        nextReconnectInMs
-      });
-    });
-    return true;
-  }
-
-  if (message?.type === 'bak.disconnect') {
-    manualDisconnect = true;
-    clearReconnectTimer();
-    reconnectAttempt = 0;
-    ws?.close();
-    ws = null;
-    sendResponse({ ok: true });
-    return false;
-  }
+  if (message?.type === 'bak.updateConfig') {
+    manualDisconnect = false;
+    const token = typeof message.token === 'string' ? message.token.trim() : '';
+    void setConfig({
+      ...(token ? { token } : {}),
+      port: Number(message.port ?? DEFAULT_PORT),
+      debugRichText: message.debugRichText === true
+    }).then(() => {
+      ws?.close();
+      void connectWebSocket().then(() => sendResponse({ ok: true }));
+    });
+    return true;
+  }
 
-  return false;
-});
+  if (message?.type === 'bak.getState') {
+    void buildPopupState().then((state) => {
+      sendResponse(state);
+    });
+    return true;
+  }
+
+  if (message?.type === 'bak.disconnect') {
+    manualDisconnect = true;
+    clearReconnectTimer();
+    reconnectAttempt = 0;
+    lastError = null;
+    ws?.close();
+    ws = null;
+    sendResponse({ ok: true });
+    return false;
+  }
+
+  if (message?.type === 'bak.reconnectNow') {
+    manualDisconnect = false;
+    clearReconnectTimer();
+    reconnectAttempt = 0;
+    ws?.close();
+    ws = null;
+    void connectWebSocket().then(() => sendResponse({ ok: true }));
+    return true;
+  }
+
+  return false;
+});