getobsrv 0.11.0 → 0.12.0

package/out/main/index.js

@@ -4,87 +4,16 @@ const node_fs = require("node:fs");
 const promises = require("node:fs/promises");
 const node_path = require("node:path");
 const node_crypto = require("node:crypto");
-const targetSource = require("./targetSource-nbfc-Fe6.js");
+const targetSource = require("./targetSource-DlsHc-Ri.js");
 const node_http = require("node:http");
 const node_url = require("node:url");
-const IPC = {
-  navigate: "obsrv:navigate",
-  reload: "obsrv:reload",
-  back: "obsrv:back",
-  forward: "obsrv:forward",
-  setViewport: "obsrv:set-viewport",
-  setNativeBounds: "obsrv:set-native-bounds",
-  setNativeVisible: "obsrv:set-native-visible",
-  setMode: "obsrv:set-mode",
-  sendInput: "obsrv:send-input",
-  getHostInfo: "obsrv:get-host-info",
-  getSettings: "obsrv:get-settings",
-  setSettings: "obsrv:set-settings",
-  frame: "obsrv:frame",
-  frameSubscribe: "obsrv:frame-subscribe",
-  urlChanged: "obsrv:url-changed",
-  loadError: "obsrv:load-error",
-  hostChanged: "obsrv:host-changed",
-  targetLoading: "obsrv:target-loading",
-  targetNavigating: "obsrv:target-navigating",
-  nativeFocused: "obsrv:native-focused",
-  syncScroll: "obsrv:sync-scroll",
-  applyScroll: "obsrv:apply-scroll",
-  scrollResult: "obsrv:scroll-result",
-  openImage: "obsrv:open-image",
-  focusUrl: "obsrv:focus-url",
-  openImagePath: "obsrv:open-image-path",
-  readImageFile: "obsrv:read-image-file",
-  uiState: "obsrv:ui-state",
-  agentApply: "obsrv:agent-apply",
-  agentActivity: "obsrv:agent-activity",
-  getUpdate: "obsrv:get-update",
-  checkUpdate: "obsrv:check-update",
-  openRelease: "obsrv:open-release",
-  updateStatus: "obsrv:update-status",
-  getHistory: "obsrv:get-history",
-  clearHistory: "obsrv:clear-history",
-  historyChanged: "obsrv:history-changed"
-};
-function attachFrameBus(target, win) {
-  let ready = false;
-  let enabled = true;
-  const gone = () => win.isDestroyed() || win.webContents.isDestroyed();
-  const onFrame = (msg) => {
-    if (!ready || !enabled || gone()) return;
-    win.webContents.send(IPC.frame, msg);
-  };
-  const onSubscribe = (e) => {
-    if (gone() || e.sender !== win.webContents) return;
-    ready = true;
-    if (enabled) target.invalidate();
-  };
-  const onRendererGone = (details) => {
-    if (details.isMainFrame && !details.isSameDocument) ready = false;
-  };
-  target.on("frame", onFrame);
-  electron.ipcMain.on(IPC.frameSubscribe, onSubscribe);
-  win.webContents.on("did-start-navigation", onRendererGone);
-  return {
-    detach() {
-      ready = false;
-      target.off("frame", onFrame);
-      electron.ipcMain.removeListener(IPC.frameSubscribe, onSubscribe);
-      if (!gone()) win.webContents.off("did-start-navigation", onRendererGone);
-    },
-    setEnabled(next) {
-      enabled = next;
-      if (enabled && ready) target.invalidate();
-    }
-  };
-}
 const MAX_SCROLL_SELECTOR = 512;
 const MAX_RECT = 16384;
 const MAX_SCROLL_WARNINGS = 4;
 const isFiniteNumber = (v) => typeof v === "number" && Number.isFinite(v);
-const isRecord$2 = (v) => typeof v === "object" && v !== null;
+const isRecord$3 = (v) => typeof v === "object" && v !== null;
 function parseRect(raw) {
-  if (!isRecord$2(raw)) return null;
+  if (!isRecord$3(raw)) return null;
   const { x, y, width, height } = raw;
   if (!isFiniteNumber(x) || !isFiniteNumber(y) || !isFiniteNumber(width) || !isFiniteNumber(height)) return null;
   const r = { x: Math.round(x), y: Math.round(y), width: Math.round(width), height: Math.round(height) };
@@ -106,7 +35,7 @@ function parseModifiers(raw) {
   return raw.filter((m) => typeof m === "string" && MODIFIERS.has(m));
 }
 function parseInputEvent(raw) {
-  if (!isRecord$2(raw)) return null;
+  if (!isRecord$3(raw)) return null;
   const modifiers = parseModifiers(raw.modifiers);
   switch (raw.type) {
     case "mouseDown":
@@ -139,7 +68,7 @@ function parseDeviceScaleFactor(raw) {
   return raw;
 }
 function parseSettings(raw) {
-  if (!isRecord$2(raw)) return null;
+  if (!isRecord$3(raw)) return null;
   const { hostDiagonalInches, hostNits } = raw;
   if (!isFiniteNumber(hostDiagonalInches) || hostDiagonalInches <= 0) return null;
   if (!isFiniteNumber(hostNits) || hostNits <= 0) return null;
@@ -153,15 +82,24 @@ function parseSettings(raw) {
   if (typeof recordHistory !== "boolean") return null;
   const split = raw.split ?? targetSource.DEFAULT_SETTINGS.split;
   if (!isFiniteNumber(split) || split < targetSource.SPLIT_MIN || split > targetSource.SPLIT_MAX) return null;
-  return { hostDiagonalInches, hostNits, agentControl, updateCheck, lastUpdateCheck, recordHistory, split };
+  const maxTabs = raw.maxTabs ?? targetSource.DEFAULT_SETTINGS.maxTabs;
+  if (!isFiniteNumber(maxTabs) || !Number.isInteger(maxTabs) || maxTabs < targetSource.MAX_TABS_MIN || maxTabs > targetSource.MAX_TABS_MAX) return null;
+  return { hostDiagonalInches, hostNits, agentControl, updateCheck, lastUpdateCheck, recordHistory, split, maxTabs };
 }
 function parseMode(raw) {
   return raw === "url" || raw === "image" ? raw : null;
 }
 const MAX_UI_ID = 64;
+const MAX_TAB_ID = 64;
+function parseTabId(raw) {
+  if (typeof raw !== "string" || raw.length === 0 || raw.length > MAX_TAB_ID) return null;
+  return raw;
+}
 function parseUiState(raw) {
-  if (!isRecord$2(raw)) return null;
+  if (!isRecord$3(raw)) return null;
   const { presetId, profileId, viewMode, mode } = raw;
+  const tabId = parseTabId(raw.tabId);
+  if (tabId === null) return null;
   if (typeof presetId !== "string" || presetId.length === 0 || presetId.length > MAX_UI_ID) return null;
   if (typeof profileId !== "string" || profileId.length === 0 || profileId.length > MAX_UI_ID) return null;
   if (viewMode !== "1:1" && viewMode !== "fit") return null;
@@ -169,6 +107,7 @@ function parseUiState(raw) {
   const panes = raw.panes ?? "both";
   if (panes !== "both" && panes !== "target") return null;
   return {
+    tabId,
     presetId,
     profileId,
     viewMode,
@@ -179,7 +118,7 @@ function parseUiState(raw) {
   };
 }
 function parseScrollPos(raw) {
-  if (!isRecord$2(raw)) return null;
+  if (!isRecord$3(raw)) return null;
   const { x, y } = raw;
   if (!isFiniteNumber(x) || !isFiniteNumber(y) || x < 0 || y < 0) return null;
   return { x, y };
@@ -196,7 +135,7 @@ function parseScrollRequest(raw) {
   return { ...pos, selector: trimmed };
 }
 function parseScrollReport(raw) {
-  if (!isRecord$2(raw)) return null;
+  if (!isRecord$3(raw)) return null;
   const { id, x, y, scroller } = raw;
   if (!isFiniteNumber(id)) return null;
   if (!isFiniteNumber(x) || !isFiniteNumber(y)) return null;
@@ -229,7 +168,7 @@ const CONTROL_COMMANDS = [
 function isControlCommand(v) {
   return typeof v === "string" && CONTROL_COMMANDS.includes(v);
 }
-const isRecord$1 = (v) => typeof v === "object" && v !== null;
+const isRecord$2 = (v) => typeof v === "object" && v !== null;
 function tokenEqual(expected, provided) {
   if (typeof provided !== "string") return false;
   const a = node_crypto.createHash("sha256").update(expected).digest();
@@ -265,7 +204,7 @@ function pixelExactApplyError(v) {
 }
 function parseClick(raw, viewport) {
   const shape = "click payload must be { x, y, button? } with finite CSS-pixel coordinates";
-  if (!isRecord$1(raw)) return shape;
+  if (!isRecord$2(raw)) return shape;
   const { x, y } = raw;
   if (typeof x !== "number" || !Number.isFinite(x) || typeof y !== "number" || !Number.isFinite(y)) return shape;
   if (x < 0 || y < 0 || x >= viewport.width || y >= viewport.height) {
@@ -294,7 +233,7 @@ function parseHighlight(raw) {
 }
 const HISTORY_MAX = 500;
 const MAX_URL_LENGTH = 2048;
-const isRecord = (v) => typeof v === "object" && v !== null;
+const isRecord$1 = (v) => typeof v === "object" && v !== null;
 const isCount = (v) => typeof v === "number" && Number.isInteger(v) && v >= 1;
 const isStamp$1 = (v) => typeof v === "number" && Number.isFinite(v) && v >= 0;
 function isStorableUrl(v) {
@@ -327,7 +266,7 @@ function loadHistory(file) {
     const seen = /* @__PURE__ */ new Set();
     const out = [];
     for (const item of raw) {
-      if (!isRecord(item)) continue;
+      if (!isRecord$1(item)) continue;
       if (!isStorableUrl(item.url) || seen.has(item.url)) continue;
       seen.add(item.url);
       out.push({
@@ -347,16 +286,63 @@ function saveHistory(file, entries) {
   if (!Array.isArray(entries)) throw new RangeError("history must be an array");
   if (entries.length > HISTORY_MAX) throw new RangeError(`history must hold at most ${HISTORY_MAX} entries`);
   for (const e of entries) {
-    if (!isRecord(e) || !isStorableUrl(e.url)) throw new RangeError("history entries need a loadable url");
+    if (!isRecord$1(e) || !isStorableUrl(e.url)) throw new RangeError("history entries need a loadable url");
     if (!isCount(e.visits)) throw new RangeError("visits must be an integer >= 1");
     if (!isStamp$1(e.lastVisit)) throw new RangeError("lastVisit must be a finite epoch ms >= 0");
   }
   node_fs.mkdirSync(node_path.dirname(file), { recursive: true });
   node_fs.writeFileSync(file, JSON.stringify(entries, null, 2));
 }
+const IPC = {
+  navigate: "obsrv:navigate",
+  reload: "obsrv:reload",
+  back: "obsrv:back",
+  forward: "obsrv:forward",
+  setViewport: "obsrv:set-viewport",
+  setNativeBounds: "obsrv:set-native-bounds",
+  setNativeVisible: "obsrv:set-native-visible",
+  setMode: "obsrv:set-mode",
+  sendInput: "obsrv:send-input",
+  getHostInfo: "obsrv:get-host-info",
+  getSettings: "obsrv:get-settings",
+  setSettings: "obsrv:set-settings",
+  frame: "obsrv:frame",
+  frameSubscribe: "obsrv:frame-subscribe",
+  urlChanged: "obsrv:url-changed",
+  titleChanged: "obsrv:title-changed",
+  loadError: "obsrv:load-error",
+  hostChanged: "obsrv:host-changed",
+  targetLoading: "obsrv:target-loading",
+  targetNavigating: "obsrv:target-navigating",
+  nativeFocused: "obsrv:native-focused",
+  syncScroll: "obsrv:sync-scroll",
+  applyScroll: "obsrv:apply-scroll",
+  scrollResult: "obsrv:scroll-result",
+  openImage: "obsrv:open-image",
+  focusUrl: "obsrv:focus-url",
+  openImagePath: "obsrv:open-image-path",
+  readImageFile: "obsrv:read-image-file",
+  uiState: "obsrv:ui-state",
+  agentApply: "obsrv:agent-apply",
+  agentActivity: "obsrv:agent-activity",
+  getUpdate: "obsrv:get-update",
+  checkUpdate: "obsrv:check-update",
+  openRelease: "obsrv:open-release",
+  updateStatus: "obsrv:update-status",
+  getHistory: "obsrv:get-history",
+  clearHistory: "obsrv:clear-history",
+  historyChanged: "obsrv:history-changed",
+  getTabs: "obsrv:get-tabs",
+  addTab: "obsrv:add-tab",
+  closeTab: "obsrv:close-tab",
+  activateTab: "obsrv:activate-tab",
+  tabsChanged: "obsrv:tabs-changed"
+};
 const isPositive = (v) => typeof v === "number" && Number.isFinite(v) && v > 0;
 const isStamp = (v) => typeof v === "number" && Number.isFinite(v) && v >= 0;
 const isRatio = (v) => typeof v === "number" && Number.isFinite(v) && v >= targetSource.SPLIT_MIN && v <= targetSource.SPLIT_MAX;
+const isTabCap = (v) => typeof v === "number" && Number.isInteger(v) && v >= targetSource.MAX_TABS_MIN && v <= targetSource.MAX_TABS_MAX;
+const readTabCap = (v) => typeof v === "number" && Number.isInteger(v) ? Math.min(targetSource.MAX_TABS_MAX, Math.max(targetSource.MAX_TABS_MIN, v)) : targetSource.DEFAULT_SETTINGS.maxTabs;
 function loadSettings(file) {
   try {
     const raw = JSON.parse(node_fs.readFileSync(file, "utf8"));
@@ -378,7 +364,12 @@ function loadSettings(file) {
       // was hand-edited to 0.97 means "I want the target tiny", not "refuse
       // to start". Falling back to an even split loses one preference; the
       // panes stay usable, which is the point of the band.
-      split: isRatio(raw.split) ? raw.split : targetSource.DEFAULT_SETTINGS.split
+      split: isRatio(raw.split) ? raw.split : targetSource.DEFAULT_SETTINGS.split,
+      // Lenient like `split`, but clamped rather than dropped — see
+      // `readTabCap` for why this field diverges. Only the on-disk load is
+      // lenient at all: it is the one path that has to cope with whatever a
+      // human typed.
+      maxTabs: readTabCap(raw.maxTabs)
     };
   } catch {
     return { ...targetSource.DEFAULT_SETTINGS };
@@ -391,6 +382,40 @@ function saveSettings(file, s) {
   if (!isStamp(s.lastUpdateCheck)) throw new RangeError("lastUpdateCheck must be a finite epoch ms >= 0");
   if (typeof s.recordHistory !== "boolean") throw new RangeError("recordHistory must be a boolean");
   if (!isRatio(s.split)) throw new RangeError(`split must be a finite ratio in ${targetSource.SPLIT_MIN}..${targetSource.SPLIT_MAX}`);
+  if (!isTabCap(s.maxTabs)) throw new RangeError(`maxTabs must be a whole count in ${targetSource.MAX_TABS_MIN}..${targetSource.MAX_TABS_MAX}`);
+  node_fs.mkdirSync(node_path.dirname(file), { recursive: true });
+  node_fs.writeFileSync(file, JSON.stringify(s, null, 2));
+}
+const DEFAULT_PRESET = "1080p-24";
+const DEFAULT_PROFILE = targetSource.PANEL_PROFILES[0].id;
+const isRecord = (v) => typeof v === "object" && v !== null;
+const EMPTY = () => ({ tabs: [], activeIndex: 0 });
+function loadTabs(file, max = Infinity) {
+  try {
+    const raw = JSON.parse(node_fs.readFileSync(file, "utf8"));
+    if (!isRecord(raw) || !Array.isArray(raw.tabs)) return EMPTY();
+    const tabs = [];
+    for (const entry of raw.tabs) {
+      if (!isRecord(entry) || typeof entry.url !== "string") continue;
+      tabs.push({
+        url: entry.url,
+        presetId: targetSource.SCREEN_PRESETS.some((p) => p.id === entry.presetId) ? entry.presetId : DEFAULT_PRESET,
+        profileId: targetSource.PANEL_PROFILES.some((p) => p.id === entry.profileId) ? entry.profileId : DEFAULT_PROFILE
+      });
+    }
+    const kept = tabs.slice(0, Math.max(0, max));
+    const idx = raw.activeIndex;
+    const activeIndex = typeof idx === "number" && Number.isInteger(idx) && idx >= 0 && idx < kept.length ? idx : 0;
+    return { tabs: kept, activeIndex };
+  } catch {
+    return EMPTY();
+  }
+}
+function saveTabs(file, s) {
+  if (!Array.isArray(s.tabs)) throw new TypeError("tabs must be an array");
+  for (const t of s.tabs) {
+    if (!isRecord(t) || typeof t.url !== "string") throw new TypeError("each tab needs a url string");
+  }
   node_fs.mkdirSync(node_path.dirname(file), { recursive: true });
   node_fs.writeFileSync(file, JSON.stringify(s, null, 2));
 }
@@ -699,7 +724,7 @@ async function checkForUpdate(current, now) {
     request.end();
   });
 }
-const TOOLBAR_H = 82;
+const TOOLBAR_H = 114;
 const MAX_IMAGE_FILE_BYTES = 64 * 1024 * 1024;
 const SCROLL_REPLY_TIMEOUT_MS = 1e3;
 function hostInfo(win) {
@@ -715,76 +740,91 @@ function hostInfo(win) {
   }
 }
 function registerIpc(ctx) {
-  const { win, native, target, bus, sync } = ctx;
+  const { win, bus, tabs } = ctx;
+  const tab = () => tabs.active();
   const settingsFile = node_path.join(electron.app.getPath("userData"), "settings.json");
   let settings = loadSettings(settingsFile);
+  tabs.maxTabs = settings.maxTabs;
   const fromRenderer = (e) => e.sender === win.webContents;
   const assertRenderer = (e) => {
     if (!fromRenderer(e)) throw new Error("ipc: unexpected sender");
   };
-  const navigateBoth = async (url) => {
+  const undo = [];
+  const on = (channel, listener) => {
+    electron.ipcMain.on(channel, listener);
+    undo.push(() => electron.ipcMain.off(channel, listener));
+  };
+  const handle = (channel, listener) => {
+    electron.ipcMain.handle(channel, listener);
+    undo.push(() => electron.ipcMain.removeHandler(channel));
+  };
+  const navigateBoth = async (url, session) => {
+    const s = session ?? tab();
+    await s.ready;
     let wanted = url;
     try {
       wanted = targetSource.normalizeUrl(url);
-      sync.expect(wanted);
+      s.sync.expect(wanted);
     } catch {
     }
-    const [applied] = await Promise.all([native.load(wanted), target.load(wanted)]);
+    const [applied] = await Promise.all([s.native.load(wanted), s.target.load(wanted)]);
     return applied;
   };
-  electron.ipcMain.handle(IPC.navigate, (e, url) => {
+  handle(IPC.navigate, (e, url) => {
     assertRenderer(e);
     return navigateBoth(url);
   });
   const reloadBoth = () => {
-    native.reload();
-    target.reload();
+    tab().native.reload();
+    tab().target.reload();
   };
-  const goBack = () => native.back();
-  const goForward = () => native.forward();
-  electron.ipcMain.on(IPC.reload, (e) => {
+  const goBack = () => tab().native.back();
+  const goForward = () => tab().native.forward();
+  on(IPC.reload, (e) => {
     if (!fromRenderer(e)) return;
     reloadBoth();
   });
-  electron.ipcMain.on(IPC.back, (e) => {
+  on(IPC.back, (e) => {
     if (!fromRenderer(e)) return;
     goBack();
   });
-  electron.ipcMain.on(IPC.forward, (e) => {
+  on(IPC.forward, (e) => {
     if (!fromRenderer(e)) return;
     goForward();
   });
-  electron.ipcMain.handle(IPC.setViewport, (e, width, height, rawDsf) => {
+  handle(IPC.setViewport, (e, width, height, rawDsf) => {
     assertRenderer(e);
-    viewportArrived = true;
+    tab().viewportArrived = true;
     const dsf = parseDeviceScaleFactor(rawDsf);
     if (dsf === null) throw new Error("invalid deviceScaleFactor");
-    const v = target.setViewport(width, height, dsf);
+    const v = tab().target.setViewport(width, height, dsf);
     return { width: v.width, height: v.height };
   });
-  electron.ipcMain.on(IPC.sendInput, (e, raw) => {
+  on(IPC.sendInput, (e, raw) => {
     if (!fromRenderer(e)) return;
     const ev = parseInputEvent(raw);
     if (!ev) return;
     try {
-      target.sendInput(ev);
+      tab().target.sendInput(ev);
     } catch {
     }
   });
-  let modeIsLive = true;
   let panesShowNative = true;
+  tabs.nativeVisible = (s) => s.modeIsLive && panesShowNative;
+  tabs.busEnabled = (s) => s.modeIsLive;
   const applyNativeVisibility = () => {
-    native.setVisible(modeIsLive && panesShowNative);
+    const s = tab();
+    s.native.setVisible(tabs.nativeVisible(s));
   };
-  electron.ipcMain.on(IPC.setMode, (e, raw) => {
+  on(IPC.setMode, (e, raw) => {
     if (!fromRenderer(e)) return;
     const mode = parseMode(raw);
     if (!mode) return;
-    modeIsLive = mode === "url";
+    tab().modeIsLive = mode === "url";
     applyNativeVisibility();
-    bus.setEnabled(modeIsLive);
+    bus.setEnabled(tab().modeIsLive);
   });
-  electron.ipcMain.on(IPC.setNativeVisible, (e, raw) => {
+  on(IPC.setNativeVisible, (e, raw) => {
     if (!fromRenderer(e)) return;
     if (typeof raw !== "boolean") return;
     panesShowNative = raw;
@@ -794,7 +834,7 @@ function registerIpc(ctx) {
   const fallbackLayout = () => {
     if (rendererDrivesLayout) return;
     const [w = 0, h = 0] = win.getContentSize();
-    native.setBounds({
+    tabs.setSlotRect({
       x: 0,
       y: TOOLBAR_H,
       width: Math.floor(w / 2),
@@ -803,17 +843,17 @@ function registerIpc(ctx) {
   };
   fallbackLayout();
   win.on("resize", fallbackLayout);
-  electron.ipcMain.on(IPC.setNativeBounds, (e, raw) => {
+  on(IPC.setNativeBounds, (e, raw) => {
     if (!fromRenderer(e)) return;
     const rect = parseRect(raw);
     if (!rect) return;
-    native.setBounds(rect);
+    tabs.setSlotRect(rect);
     rendererDrivesLayout = true;
   });
   let scrollSeq = 0;
   const scrollWaiters = /* @__PURE__ */ new Map();
-  electron.ipcMain.on(IPC.scrollResult, (e, raw) => {
-    if (e.sender !== target.webContents && e.sender !== native.webContents) return;
+  on(IPC.scrollResult, (e, raw) => {
+    if (!tabs.byWebContents(e.sender)) return;
     const report = parseScrollReport(raw);
     if (!report) return;
     const waiter = scrollWaiters.get(report.id);
@@ -822,11 +862,12 @@ function registerIpc(ctx) {
     waiter(report);
   });
   const scrollBoth = async (req) => {
-    await awaitViewportStable();
+    const s = tab();
+    await awaitViewportStable(s);
     const base = { x: req.x, y: req.y };
     if (req.selector !== void 0) base.selector = req.selector;
-    if (!native.webContents.isDestroyed()) native.webContents.send(IPC.applyScroll, base);
-    const wc = target.webContents;
+    if (!s.native.webContents.isDestroyed()) s.native.webContents.send(IPC.applyScroll, base);
+    const wc = s.target.webContents;
     if (wc.isDestroyed()) return null;
     const id = ++scrollSeq;
     const answered = new Promise((resolve) => {
@@ -842,7 +883,7 @@ function registerIpc(ctx) {
     wc.send(IPC.applyScroll, { ...base, id });
     return answered;
   };
-  electron.ipcMain.handle(IPC.getHostInfo, (e) => {
+  handle(IPC.getHostInfo, (e) => {
     assertRenderer(e);
     return hostInfo(win);
   });
@@ -860,76 +901,107 @@ function registerIpc(ctx) {
   electron.screen.on("display-metrics-changed", pushHostIfChanged);
   electron.screen.on("display-added", pushHostIfChanged);
   electron.screen.on("display-removed", pushHostIfChanged);
-  electron.ipcMain.handle(IPC.getSettings, (e) => {
+  handle(IPC.getSettings, (e) => {
     assertRenderer(e);
     return settings;
   });
-  electron.ipcMain.handle(IPC.setSettings, (e, raw) => {
+  handle(IPC.setSettings, (e, raw) => {
     assertRenderer(e);
     const s = parseSettings(raw);
     if (!s) throw new Error("invalid settings");
     saveSettings(settingsFile, s);
     const wasEnabled = settings.agentControl;
     settings = s;
+    tabs.maxTabs = s.maxTabs;
     if (s.agentControl !== wasEnabled) applyAgentControl(s.agentControl);
   });
-  const uiState = { presetId: "1080p-24", profileId: "reference", viewMode: "fit", panes: "both", mode: "url" };
+  const uiState = {
+    get presetId() {
+      return tab().presetId;
+    },
+    set presetId(v) {
+      tab().presetId = v;
+    },
+    get profileId() {
+      return tab().profileId;
+    },
+    set profileId(v) {
+      tab().profileId = v;
+    },
+    get viewMode() {
+      return tab().viewMode;
+    },
+    set viewMode(v) {
+      tab().viewMode = v;
+    },
+    get mode() {
+      return tab().reportedMode;
+    },
+    set mode(v) {
+      tab().reportedMode = v;
+    },
+    panes: "both"
+  };
   let targetBounds = null;
   let canvasBounds = null;
   const MAX_PENDING_APPLIES = 32;
   let rendererReported = false;
   let warnedPendingOverflow = false;
   const pendingApplies = [];
-  electron.ipcMain.on(IPC.uiState, (e, raw) => {
+  on(IPC.uiState, (e, raw) => {
     if (!fromRenderer(e)) return;
     const s = parseUiState(raw);
     if (!s) return;
-    const { targetBounds: bounds, canvasBounds: canvas, ...state } = s;
-    Object.assign(uiState, state);
-    targetBounds = bounds ?? null;
-    canvasBounds = canvas ?? null;
     if (!rendererReported) {
       rendererReported = true;
       for (const patch of pendingApplies.splice(0)) {
         if (!win.isDestroyed()) win.webContents.send(IPC.agentApply, patch);
       }
     }
+    if (s.tabId !== tabs.activeId) return;
+    const { tabId: _tabId, targetBounds: bounds, canvasBounds: canvas, ...state } = s;
+    Object.assign(uiState, state);
+    targetBounds = bounds ?? null;
+    canvasBounds = canvas ?? null;
+    persistTabs();
   });
-  let viewportPending = false;
-  let viewportArrived = false;
   const VIEWPORT_ARRIVAL_MS = 600;
-  const awaitViewportStable = async () => {
-    if (!viewportPending) return;
-    viewportPending = false;
+  const awaitViewportStable = async (s = tab()) => {
+    if (!s.viewportPending) return;
+    s.viewportPending = false;
     const arrivalDeadline = Date.now() + VIEWPORT_ARRIVAL_MS;
-    while (!viewportArrived && Date.now() < arrivalDeadline) {
+    while (!s.viewportArrived && Date.now() < arrivalDeadline) {
       await new Promise((r) => setTimeout(r, SETTLE_POLL_MS));
     }
-    await settleTarget();
+    await settleTarget(s.target);
   };
   const SETTLE_POLL_MS = 80;
   const SETTLE_STABLE_READS = 2;
   const SETTLE_BUDGET_MS = 4e3;
   const SETTLE_DRAW_MS = 120;
-  const nextFrame = (budgetMs) => new Promise((resolve) => {
+  const nextFrame = (t, budgetMs) => new Promise((resolve) => {
+    if (!t.painting) {
+      resolve(false);
+      return;
+    }
     const timer = setTimeout(() => {
-      target.off("frame", onFrame);
+      t.off("frame", onFrame);
       resolve(false);
     }, budgetMs);
     const onFrame = () => {
       clearTimeout(timer);
-      target.off("frame", onFrame);
+      t.off("frame", onFrame);
       resolve(true);
     };
-    target.on("frame", onFrame);
-    target.invalidate();
+    t.on("frame", onFrame);
+    t.invalidate();
   });
-  const settleTarget = async () => {
+  const settleTarget = async (t = tab().target) => {
     const deadline = Date.now() + SETTLE_BUDGET_MS;
     let last = "";
     let stable = 0;
     while (Date.now() < deadline) {
-      const v = target.getViewport();
+      const v = t.getViewport();
       const key = `${v.width}x${v.height}`;
       stable = key === last ? stable + 1 : 0;
       last = key;
@@ -937,7 +1009,7 @@ function registerIpc(ctx) {
       await new Promise((r) => setTimeout(r, SETTLE_POLL_MS));
     }
     if (stable < SETTLE_STABLE_READS) return false;
-    const painted = await nextFrame(Math.max(0, deadline - Date.now()));
+    const painted = await nextFrame(t, Math.max(0, deadline - Date.now()));
     await new Promise((r) => setTimeout(r, SETTLE_DRAW_MS));
     return painted;
   };
@@ -971,15 +1043,15 @@ function registerIpc(ctx) {
     if (!win.isDestroyed()) win.webContents.send(IPC.updateStatus, state);
     return state;
   };
-  electron.ipcMain.handle(IPC.getUpdate, (e) => {
+  handle(IPC.getUpdate, (e) => {
     assertRenderer(e);
     return update;
   });
-  electron.ipcMain.handle(IPC.checkUpdate, (e) => {
+  handle(IPC.checkUpdate, (e) => {
     assertRenderer(e);
     return runUpdateCheck();
   });
-  electron.ipcMain.handle(IPC.openRelease, async (e) => {
+  handle(IPC.openRelease, async (e) => {
     assertRenderer(e);
     if (releaseUrl === "") return false;
     await electron.shell.openExternal(releaseUrl);
@@ -1000,17 +1072,96 @@ function registerIpc(ctx) {
     history = next;
     publishHistory();
   };
-  native.webContents.on("did-navigate", (_e, url) => {
+  tabs.onNativeNavigate = (url) => {
     if (!settings.recordHistory) return;
     const next = recordVisit(history, url, Date.now());
     if (next === history) return;
     commitHistory(next);
+  };
+  const publishTabs = () => {
+    if (win.isDestroyed() || win.webContents.isDestroyed()) return;
+    win.webContents.send(IPC.tabsChanged, tabs.snapshot());
+  };
+  tabs.onTabsChanged = () => {
+    publishTabs();
+    persistTabs();
+  };
+  handle(IPC.getTabs, (e) => {
+    assertRenderer(e);
+    return tabs.snapshot();
+  });
+  handle(IPC.addTab, (e) => {
+    assertRenderer(e);
+    const session = tabs.add();
+    if (!session) return null;
+    tabs.activate(session.id);
+    return session.id;
+  });
+  on(IPC.closeTab, (e, raw) => {
+    if (!fromRenderer(e)) return;
+    const id = parseTabId(raw);
+    if (id === null) return;
+    tabs.close(id);
+  });
+  on(IPC.activateTab, (e, raw) => {
+    if (!fromRenderer(e)) return;
+    const id = parseTabId(raw);
+    if (id === null) return;
+    tabs.activate(id);
   });
-  electron.ipcMain.handle(IPC.getHistory, (e) => {
+  const tabsFile = node_path.join(electron.app.getPath("userData"), "tabs.json");
+  let lastWritten = "";
+  let persistReady = false;
+  const persistTabs = () => {
+    if (!persistReady) return;
+    const stored = {
+      tabs: tabs.tabs.map((t) => ({ url: t.url, presetId: t.presetId, profileId: t.profileId })),
+      activeIndex: tabs.activeIndex
+    };
+    const json = JSON.stringify(stored);
+    if (json === lastWritten) return;
+    lastWritten = json;
+    try {
+      saveTabs(tabsFile, stored);
+    } catch (e) {
+      console.warn("obsrv: could not save tabs", e);
+    }
+  };
+  tabs.onTabUrlChanged = persistTabs;
+  const restoreTabs = async () => {
+    const stored = loadTabs(tabsFile, settings.maxTabs);
+    if (stored.tabs.length === 0) return;
+    const sessions = [];
+    for (const [i, entry] of stored.tabs.entries()) {
+      const s = i === 0 ? tabs.tabs[0] : tabs.add();
+      if (!s) break;
+      s.presetId = entry.presetId;
+      s.profileId = entry.profileId;
+      sessions.push(s);
+    }
+    tabs.activate(sessions[Math.min(stored.activeIndex, sessions.length - 1)].id);
+    await Promise.all(
+      sessions.map(async (s, i) => {
+        const wanted = stored.tabs[i].url;
+        try {
+          await navigateBoth(wanted, s);
+        } catch (e) {
+          console.warn("obsrv: could not restore a tab", e);
+        }
+        if (s.url === "" || s.url === "about:blank") s.url = wanted;
+      })
+    );
+  };
+  void restoreTabs().finally(() => {
+    persistReady = true;
+    persistTabs();
+    publishTabs();
+  });
+  handle(IPC.getHistory, (e) => {
     assertRenderer(e);
     return history;
   });
-  electron.ipcMain.handle(IPC.clearHistory, (e) => {
+  handle(IPC.clearHistory, (e) => {
     assertRenderer(e);
     commitHistory([]);
   });
@@ -1022,17 +1173,17 @@ function registerIpc(ctx) {
     status: () => {
       let url = "";
       try {
-        url = target.webContents.getURL();
+        url = tab().target.webContents.getURL();
       } catch {
       }
-      return { version: appVersion, url, ...uiState };
+      return { version: appVersion, url, tabId: tabs.activeId, tabIndex: tabs.activeIndex, ...uiState };
     },
     navigate: navigateBoth,
     apply: (patch) => {
       if (win.isDestroyed()) return;
       if (patch.presetId !== void 0) {
-        viewportPending = true;
-        viewportArrived = false;
+        tab().viewportPending = true;
+        tab().viewportArrived = false;
       }
       if (!rendererReported) {
         if (pendingApplies.length >= MAX_PENDING_APPLIES) {
@@ -1072,7 +1223,7 @@ function registerIpc(ctx) {
         warnings
       };
     },
-    viewport: () => target.getViewport(),
+    viewport: () => tab().target.getViewport(),
     // An agent scroll drives both panes over the same `applyScroll` channel
     // the pane-sync mirror uses — each pane's sync preload applies it and
     // suppresses its own echo, so the two arrive together with no loop.
@@ -1084,8 +1235,8 @@ function registerIpc(ctx) {
       const up = parseInputEvent({ type: "mouseUp", x: c.x, y: c.y, button: c.button, clickCount: 1 });
       if (!down || !up) return;
       try {
-        target.sendInput(down);
-        target.sendInput(up);
+        tab().target.sendInput(down);
+        tab().target.sendInput(up);
       } catch {
       }
     },
@@ -1113,7 +1264,7 @@ function registerIpc(ctx) {
   if (process.env.OBSRV_AGENT_CONTROL === "1") settings = { ...settings, agentControl: true };
   if (settings.agentControl) applyAgentControl(true);
   electron.app.on("will-quit", () => control.stop());
-  electron.ipcMain.handle(IPC.readImageFile, async (e, raw) => {
+  handle(IPC.readImageFile, async (e, raw) => {
     assertRenderer(e);
     if (typeof raw !== "string" || !targetSource.IMAGE_EXTENSIONS.test(raw)) throw new Error("Unsupported file type");
     const { size } = await promises.stat(raw);
@@ -1122,23 +1273,59 @@ function registerIpc(ctx) {
     }
     return promises.readFile(raw);
   });
+  return () => {
+    for (const off of undo.splice(0)) off();
+    electron.screen.off("display-metrics-changed", pushHostIfChanged);
+    electron.screen.off("display-added", pushHostIfChanged);
+    electron.screen.off("display-removed", pushHostIfChanged);
+    control.stop();
+  };
 }
-function installMenu({ win, native, target }) {
+function installMenu({ win, tabs }) {
   const send = (channel) => {
     if (!win.isDestroyed()) win.webContents.send(channel);
   };
+  const openTab = () => {
+    const session = tabs.add();
+    if (session) tabs.activate(session.id);
+  };
+  const closeTab2 = () => tabs.close(tabs.activeId);
+  const selectTab = (index) => {
+    const list = tabs.tabs;
+    const wanted = index < 0 ? list[list.length - 1] : list[index];
+    if (wanted) tabs.activate(wanted.id);
+  };
+  const selectItems = [
+    ...[1, 2, 3, 4, 5, 6, 7, 8].map((n) => ({
+      id: `select-tab-${n}`,
+      label: `Select Tab ${n}`,
+      accelerator: `CmdOrCtrl+${n}`,
+      click: () => selectTab(n - 1)
+    })),
+    {
+      id: "select-tab-last",
+      label: "Select Last Tab",
+      accelerator: "CmdOrCtrl+9",
+      click: () => selectTab(-1)
+    }
+  ];
   const template = [
     { role: "appMenu" },
     {
       label: "File",
       submenu: [
+        { id: "new-tab", label: "New Tab", accelerator: "CmdOrCtrl+T", click: openTab },
+        { id: "close-tab", label: "Close Tab", accelerator: "CmdOrCtrl+W", click: closeTab2 },
+        { type: "separator" },
         {
           label: "Open Image…",
           accelerator: "CmdOrCtrl+O",
           click: () => send(IPC.openImage)
         },
         { type: "separator" },
-        { role: "close" }
+        // Displaced to Shift+Cmd+W, as in every browser, because Cmd+W now
+        // belongs to the tab. The role keeps the platform behaviour.
+        { role: "close", accelerator: "Shift+CmdOrCtrl+W" }
       ]
     },
     { role: "editMenu" },
@@ -1149,6 +1336,7 @@ function installMenu({ win, native, target }) {
           label: "Reload",
           accelerator: "CmdOrCtrl+R",
           click: () => {
+            const { native, target } = tabs.active();
             native.reload();
             target.reload();
           }
@@ -1170,10 +1358,71 @@ function installMenu({ win, native, target }) {
         { role: "togglefullscreen" }
       ]
     },
+    // Chrome's Tab menu, with Chrome's items: the numbers are discoverable
+    // here rather than being folklore, and the labels say which is which.
+    { label: "Tab", submenu: selectItems },
     { role: "windowMenu" }
   ];
   electron.Menu.setApplicationMenu(electron.Menu.buildFromTemplate(template));
 }
+function closeTab(tabs, closeId, activeId) {
+  const index = tabs.findIndex((t) => t.id === closeId);
+  if (index === -1) return { tabs, activeId };
+  const next = tabs.filter((t) => t.id !== closeId);
+  if (next.length === 0) return { tabs: next, activeId: null };
+  if (closeId !== activeId) return { tabs: next, activeId };
+  const neighbour = next[Math.min(index, next.length - 1)];
+  return { tabs: next, activeId: neighbour.id };
+}
+function canAddTab(count, max) {
+  return count < max;
+}
+function attachFrameBus(target, win) {
+  let ready = false;
+  let enabled = true;
+  let source = target;
+  const gone = () => win.isDestroyed() || win.webContents.isDestroyed();
+  const onFrame = (msg) => {
+    if (!ready || !enabled || gone()) return;
+    win.webContents.send(IPC.frame, msg);
+  };
+  const onSubscribe = (e) => {
+    if (gone() || e.sender !== win.webContents) return;
+    ready = true;
+    if (enabled) source.invalidate();
+  };
+  const onRendererGone = (details) => {
+    if (details.isMainFrame && !details.isSameDocument) ready = false;
+  };
+  const bind = (next) => {
+    source.off("frame", onFrame);
+    source = next;
+    source.on("frame", onFrame);
+  };
+  source.on("frame", onFrame);
+  electron.ipcMain.on(IPC.frameSubscribe, onSubscribe);
+  win.webContents.on("did-start-navigation", onRendererGone);
+  return {
+    detach() {
+      ready = false;
+      source.off("frame", onFrame);
+      electron.ipcMain.removeListener(IPC.frameSubscribe, onSubscribe);
+      if (!gone()) win.webContents.off("did-start-navigation", onRendererGone);
+    },
+    setEnabled(next) {
+      enabled = next;
+      if (enabled && ready) source.invalidate();
+    },
+    // Deliberately not short-circuited when `next` is already the source:
+    // unbind-then-rebind is idempotent, and the identity guard would hide the
+    // one failure this has to rule out — a `bind` that subscribes without
+    // unsubscribing, which stacks listeners and delivers every paint twice.
+    setSource(next) {
+      bind(next);
+      if (ready && enabled) next.invalidate();
+    }
+  };
+}
 const ERR_ABORTED = -3;
 class NativePane {
   constructor(win, events) {
@@ -1291,21 +1540,27 @@ function attachSyncBus(native, target, onUrlChanged) {
   native.webContents.on("did-navigate", onNativeNav);
   native.webContents.on("did-navigate-in-page", onNativeNavInPage);
   target.on("url-changed", onTargetNav);
-  const onScroll = (e, raw) => {
-    const other = e.sender === native.webContents ? target.webContents : e.sender === target.webContents ? native.webContents : null;
-    if (!other || other.isDestroyed()) return;
-    const pos = parseScrollPos(raw);
-    if (!pos) return;
-    other.send(IPC.applyScroll, pos);
-  };
-  electron.ipcMain.on(IPC.syncScroll, onScroll);
   return {
     expect(url) {
       pending.native = url;
       pending.target = url;
     },
+    // This channel is driven by the sync preload inside the two *page*
+    // webContents, never by the app's own renderer, so the sender check here
+    // is the inverse of `registerIpc`'s: accept exactly the two panes and
+    // route to the other one. The manager has already resolved the sender to
+    // this session, but the check stays — it is what picks the *other* pane,
+    // and a sender belonging to neither is still dropped rather than guessed.
+    // The payload comes from a preload running alongside a third-party page,
+    // so it is parsed like any renderer message.
+    onScroll(e, raw) {
+      const other = e.sender === native.webContents ? target.webContents : e.sender === target.webContents ? native.webContents : null;
+      if (!other || other.isDestroyed()) return;
+      const pos = parseScrollPos(raw);
+      if (!pos) return;
+      other.send(IPC.applyScroll, pos);
+    },
     detach() {
-      electron.ipcMain.off(IPC.syncScroll, onScroll);
       target.off("url-changed", onTargetNav);
       if (!native.webContents.isDestroyed()) {
         native.webContents.off("did-navigate", onNativeNav);
@@ -1314,8 +1569,321 @@ function attachSyncBus(native, target, onUrlChanged) {
     }
   };
 }
+let nextId = 1;
+class TabSession {
+  id;
+  native;
+  target;
+  sync;
+  // `modeIsLive` and `reportedMode` describe the same idea from opposite
+  // directions and must not be collapsed into one field. `modeIsLive` is
+  // main's own authority over an OS-level view: `IPC.setMode` is the command
+  // that writes it and `applyNativeVisibility` is the only thing that reads
+  // it. `reportedMode` is a mirror of what the renderer says it is showing,
+  // written by the renderer's `IPC.uiState` report so the control server's
+  // `status` can answer without a round trip.
+  //
+  // Letting the report drive visibility would let an observation write to a
+  // control, and it reorders badly: a `uiState` arriving ahead of its matching
+  // `setMode` would make the next `setNativeVisible` apply the new mode early.
+  // Tab activation will start moving these messages around, so keep them apart.
+  /** False in image mode: the left pane is drawn in the renderer instead. */
+  modeIsLive = true;
+  /** The renderer's last reported mode, for `status`. Never drives the view. */
+  reportedMode = "url";
+  /**
+   * What the strip shows for this tab. Both are main's, because main is what
+   * every tab's panes report to: a background tab has no other way to keep its
+   * own strip entry current, and the renderer holds one URL bar for the tab in
+   * front. `title` is Chromium's page title, empty until the page has one —
+   * `tabTitle` falls back to the host, then the URL.
+   */
+  url = "";
+  title = "";
+  /** A preset change is in flight; a capture or scroll must wait for it. */
+  viewportPending = false;
+  viewportArrived = false;
+  presetId = "1080p-24";
+  profileId = "reference";
+  viewMode = "fit";
+  /**
+   * Resolves once both panes have settled on their initial `about:blank`.
+   *
+   * `TargetSource` owns its first navigation, so the pair does not exist in a
+   * usable state the instant the constructor returns: a `navigate` issued
+   * before that internal commit lands is undone by it, because the commit
+   * clears the expectation the navigate had just set and `SyncBus` rightly
+   * mirrors a stray `about:blank` into the other pane. With one session that
+   * only ever happened at boot, which is why `boot()` announced the pair by
+   * hand; with tabs it happens every time one is opened and driven, so the
+   * announcement and the settle belong to the session itself.
+   */
+  ready;
+  constructor(win, onUrlChanged) {
+    this.id = `tab-${nextId++}`;
+    this.native = new NativePane(win, {
+      onLoadError: (err) => {
+        if (!win.isDestroyed()) win.webContents.send(IPC.loadError, { tabId: this.id, error: err });
+      },
+      // The renderer reads the file back over `readImageFile`; no bytes here.
+      onImageDrop: (path) => {
+        if (!win.isDestroyed()) win.webContents.send(IPC.openImagePath, path);
+      }
+    });
+    this.target = new targetSource.TargetSource();
+    this.sync = attachSyncBus(this.native, this.target, onUrlChanged);
+    this.sync.expect("about:blank");
+    this.ready = Promise.all([this.native.load("about:blank"), this.target.ready]).then(() => void 0);
+  }
+  /**
+   * Background tabs stay loaded but stop rasterising. Offscreen rendering runs
+   * at a fixed frame rate with `backgroundThrottling: false`, so without this
+   * every hidden tab would paint a full viewport forever for nobody. The page
+   * keeps its DOM, timers, network and scroll — only pixel production stops.
+   *
+   * Only the target is suspended. The native pane is an OS-level view that the
+   * window has already hidden, and it is Chromium's own compositor deciding
+   * whether an occluded view costs anything — main has no `stopPainting` for
+   * it and does not need one.
+   *
+   * The wish is kept by `TargetSource`, not here: a dsf change recreates the
+   * offscreen window, and a flag held at this level would go stale the moment
+   * a backgrounded tab changed preset.
+   */
+  setPainting(painting) {
+    this.target.setPainting(painting);
+  }
+  /** Whether this session is producing pixels. */
+  get painting() {
+    return this.target.painting;
+  }
+  destroy() {
+    this.sync.detach();
+    this.target.destroy();
+    this.native.view.webContents.close();
+  }
+}
+class TabManager {
+  constructor(win) {
+    this.win = win;
+    const first = this.create();
+    this.list.push(first);
+    this.id = first.id;
+    this.bus = attachFrameBus(first.target, win);
+    electron.ipcMain.on(IPC.syncScroll, this.route);
+  }
+  list = [];
+  id = "";
+  /**
+   * Where the native pane goes, in window coordinates. It is window-global —
+   * one slot on screen — and applied to *every* session's view, so activation
+   * needs no fresh measurement: the incoming view is already positioned.
+   */
+  slot = null;
+  /** The one bus. Re-pointed by `activate`, never duplicated. */
+  bus;
+  /** The cap from Settings. `registerIpc` owns the settings file and writes it. */
+  maxTabs = targetSource.DEFAULT_SETTINGS.maxTabs;
+  /**
+   * Whether the active session's native view belongs on screen. Two window-
+   * level inputs decide it (image mode and the Both/Target toggle) and
+   * `registerIpc` derives them in one place, so activation asks rather than
+   * re-deriving and drifting.
+   */
+  nativeVisible = () => true;
+  /**
+   * Whether the bus should deliver the active session's frames. Image mode is
+   * per tab, so this cannot be left to the `setMode` handler alone: that
+   * handler only fires when the *mode* changes, and a tab switch changes which
+   * mode is in force without any mode changing. Leaving it out strands the bus
+   * in the outgoing tab's setting — switch off an image-mode tab and the
+   * canvas never receives another frame.
+   */
+  busEnabled = () => true;
+  /** A committed main-frame navigation in any tab's native pane, for history. */
+  onNativeNavigate = () => {
+  };
+  /**
+   * The strip changed shape: a tab opened, closed, or came to the front.
+   * `registerIpc` publishes the snapshot; per-tab url and title travel on their
+   * own channels, so this fires only for list identity.
+   */
+  onTabsChanged = () => {
+  };
+  /**
+   * A tab's URL changed. Separate from `onTabsChanged` because the strip
+   * already learns this on its own channel: the list did not change shape, and
+   * what is on disk did. Persistence is the only caller.
+   */
+  onTabUrlChanged = () => {
+  };
+  route = (e, raw) => {
+    const session = this.byWebContents(e.sender);
+    if (!session) return;
+    session.sync.onScroll(e, raw);
+  };
+  get tabs() {
+    return this.list;
+  }
+  get activeId() {
+    return this.id;
+  }
+  /**
+   * The active tab's position in the strip, 0-based. `findIndex` cannot miss —
+   * the manager always holds its active session — but a -1 escaping into
+   * `tabs.json` or an agent's `status` would be a lie, so it clamps.
+   */
+  get activeIndex() {
+    return Math.max(0, this.list.findIndex((t) => t.id === this.id));
+  }
+  active() {
+    return this.list.find((t) => t.id === this.id) ?? this.list[0];
+  }
+  byWebContents(wc) {
+    return this.list.find((t) => t.native.webContents === wc || t.target.webContents === wc);
+  }
+  /** Null at the cap. The new tab is a background tab until `activate`. */
+  add() {
+    if (!canAddTab(this.list.length, this.maxTabs)) return null;
+    const session = this.create();
+    this.list.push(session);
+    session.native.setVisible(false);
+    session.setPainting(false);
+    if (this.slot) session.native.setBounds(this.slot);
+    this.onTabsChanged();
+    return session;
+  }
+  /**
+   * Brings a tab to the front. The ordering here is load-bearing:
+   *
+   *   * painting resumes on the incoming session *before* `setSource`, because
+   *     `setSource`'s invalidate lands on a stopped webContents otherwise and
+   *     the canvas keeps showing the outgoing tab's pixels;
+   *   * the bus is re-enabled *after* `setSource`, never before: enabling it
+   *     while the outgoing target is still bound invalidates that one, and the
+   *     frame it produces paints the tab being left over the tab being
+   *     entered;
+   *   * the slot rect is applied before the view is shown, so it never appears
+   *     at a stale position first;
+   *   * the outgoing session is suspended last, so nothing is dark in between.
+   */
+  activate(id) {
+    const next = this.list.find((t) => t.id === id);
+    if (!next) return;
+    const prev = this.list.find((t) => t.id === this.id);
+    this.id = id;
+    if (prev && prev !== next) prev.native.setVisible(false);
+    next.setPainting(true);
+    this.bus.setSource(next.target);
+    this.bus.setEnabled(this.busEnabled(next));
+    if (this.slot) next.native.setBounds(this.slot);
+    next.native.setVisible(this.nativeVisible(next));
+    if (prev && prev !== next) prev.setPainting(false);
+    this.onTabsChanged();
+  }
+  close(id) {
+    const going = this.list.find((t) => t.id === id);
+    if (!going) return;
+    going.native.setVisible(false);
+    const result = closeTab([...this.list], id, this.id);
+    this.list.length = 0;
+    this.list.push(...result.tabs);
+    if (result.activeId === null) {
+      const fresh = this.create();
+      this.list.push(fresh);
+      this.id = fresh.id;
+      this.bus.setSource(fresh.target);
+      this.bus.setEnabled(this.busEnabled(fresh));
+      if (this.slot) fresh.native.setBounds(this.slot);
+      fresh.native.setVisible(this.nativeVisible(fresh));
+    } else if (result.activeId !== this.id) {
+      this.activate(result.activeId);
+    }
+    going.destroy();
+    this.onTabsChanged();
+  }
+  /** One slot on screen; every view is moved to it, only the active one shows. */
+  setSlotRect(rect) {
+    this.slot = rect;
+    for (const t of this.list) t.native.setBounds(rect);
+  }
+  getSlotRect() {
+    return this.slot;
+  }
+  destroy() {
+    electron.ipcMain.off(IPC.syncScroll, this.route);
+    this.bus.detach();
+    for (const t of this.list) t.destroy();
+    this.list.length = 0;
+  }
+  /** What the strip renders: list identity plus each tab's own state. */
+  snapshot() {
+    return {
+      tabs: this.list.map((t) => ({
+        id: t.id,
+        url: t.url,
+        title: t.title,
+        presetId: t.presetId,
+        profileId: t.profileId
+      })),
+      activeId: this.id
+    };
+  }
+  /**
+   * Builds a session and wires its pane events to the window.
+   *
+   * **Every forward names its tab.** They used to be gated on the session being
+   * the one in front, because the renderer held one URL bar, one load-error
+   * badge and one spinner, and an unnamed report from a background tab would
+   * rewrite the front tab's address. With a strip that shows every tab, the
+   * gate is the defect instead: a background tab could never update its own
+   * entry, so the strip would show whatever it said when it was last in front.
+   * The id restores the isolation the gate was standing in for — the renderer
+   * writes the tab that is named, not the tab that is showing.
+   */
+  create() {
+    const s = new TabSession(this.win, (url) => {
+      s.url = url;
+      s.title = "";
+      this.toRenderer(IPC.urlChanged, { tabId: s.id, url });
+      this.toRenderer(IPC.titleChanged, { tabId: s.id, title: "" });
+      this.onTabUrlChanged(s);
+    });
+    s.native.webContents.on("page-title-updated", (_e, title) => {
+      s.title = title;
+      this.toRenderer(IPC.titleChanged, { tabId: s.id, title });
+    });
+    s.native.webContents.on("focus", () => {
+      this.toRenderer(IPC.nativeFocused, { tabId: s.id });
+    });
+    s.native.webContents.on("did-navigate", (_e, url) => this.onNativeNavigate(url, s));
+    s.target.on("load-error", (err) => this.toRenderer(IPC.loadError, { tabId: s.id, error: err }));
+    s.target.on("loading", (loading) => this.toRenderer(IPC.targetLoading, { tabId: s.id, loading }));
+    s.target.on("navigating", () => this.toRenderer(IPC.targetNavigating, { tabId: s.id }));
+    return s;
+  }
+  toRenderer(channel, payload) {
+    if (this.win.isDestroyed() || this.win.webContents.isDestroyed()) return;
+    this.win.webContents.send(channel, payload);
+  }
+}
 function exposeForTests(ctx) {
-  if (process.env.OBSRV_TEST === "1") globalThis.__obsrv = ctx;
+  if (process.env.OBSRV_TEST !== "1") return;
+  globalThis.__obsrv = {
+    ...ctx,
+    get session() {
+      return ctx.tabs.active();
+    },
+    get native() {
+      return ctx.tabs.active().native;
+    },
+    get target() {
+      return ctx.tabs.active().target;
+    },
+    get sync() {
+      return ctx.tabs.active().sync;
+    }
+  };
 }
 function createMainWindow() {
   const win = new electron.BrowserWindow({
@@ -1340,42 +1908,14 @@ function createMainWindow() {
 }
 function boot() {
   const win = createMainWindow();
-  const native = new NativePane(win, {
-    onLoadError: (err) => {
-      if (!win.isDestroyed()) win.webContents.send(IPC.loadError, err);
-    },
-    // The renderer reads the file back over `readImageFile`; no bytes here.
-    onImageDrop: (path) => {
-      if (!win.isDestroyed()) win.webContents.send(IPC.openImagePath, path);
-    }
-  });
-  native.webContents.on("focus", () => {
-    if (!win.isDestroyed()) win.webContents.send(IPC.nativeFocused);
-  });
-  const target = new targetSource.TargetSource();
-  target.on("load-error", (err) => {
-    if (!win.isDestroyed()) win.webContents.send(IPC.loadError, err);
-  });
-  target.on("loading", (loading) => {
-    if (!win.isDestroyed()) win.webContents.send(IPC.targetLoading, loading);
-  });
-  target.on("navigating", () => {
-    if (!win.isDestroyed()) win.webContents.send(IPC.targetNavigating);
-  });
-  const bus = attachFrameBus(target, win);
-  const sync = attachSyncBus(native, target, (url) => {
-    if (!win.isDestroyed()) win.webContents.send(IPC.urlChanged, url);
-  });
-  const ctx = { win, native, target, bus, sync, toolbarH: TOOLBAR_H };
-  registerIpc(ctx);
+  const tabs = new TabManager(win);
+  const ctx = { win, tabs, bus: tabs.bus, toolbarH: TOOLBAR_H };
+  const stopIpc = registerIpc(ctx);
   installMenu(ctx);
   win.on("close", () => {
-    sync.detach();
-    bus.detach();
-    target.destroy();
+    stopIpc();
+    tabs.destroy();
   });
-  sync.expect("about:blank");
-  void native.load("about:blank");
   exposeForTests(ctx);
 }
 void electron.app.whenReady().then(boot);