fix background re-renders stealing focus and killing terminal selection

The statusLine helper rewrote <sid>.sessionid on every Claude render, and
updateSessionCliId had no equality guard — so each identical write fired
session-changed, and renderLayout() answered with container.appendChild(pane).
appendChild on a node that is already a child is a remove-and-reinsert: it blurs
whatever is focused inside (the Cmd+F find bar is appended *into* .terminal-pane)
and detaches the node mid-drag, where xterm's selection math reads a zero-size
rect. setFocused then yanked focus back, because its closest('.terminal-pane')
test counts the find bar's input as "already the terminal".

Fixed at four levels:

Source. updateSessionCliId early-returns on an unchanged id, and .sessionid joins
.name behind one write_if_changed helper in the generated statusLine script.

DOM. attachToContainer no-ops when the pane is already in the container, matching
the seven sibling attach* helpers that already did; the ordering concern it was
smuggling moves up to ensurePaneOrder in the layout owner, which compares
*relative* order (hidden panes stay in the container interleaved with the
laid-out ones) and so mutates nothing in the steady state. renderSwarmMode reuses
its grid wrapper instead of rebuilding it.

Focus. focusPane gates the call on shouldFocusPane, so a render that does not
change the focused pane never reaches setFocused at all — the find bar cannot be
told apart from the terminal down there, so the decision belongs one level up.
setFocused goes back to its original guard.

Resize. fitTerminal skips pty.resize when the cols x rows memo is unchanged; a
redundant resize makes the CLI redraw under a selection, and xterm clears the
selection outright on a row-count change. spawnTerminal clears that memo and
re-fits *after* pty.create resolves: callers fire it un-awaited and fit
immediately, so the first resize can reach main while pty:create is still
suspended (Copilot awaits a hook install) and resizePty drops it — the memo would
otherwise pin the PTY at the 120x30 spawn default for the session's life.

Both decisions live in DOM-free pane-order.ts / pane-focus.ts and are unit-tested.
The terminal-pane test fake also had className and classList as separate state and
an appendChild that did not move nodes; both are fixed, which is what let the
attach and fit tests be written honestly.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_012qptmPxqXxKn13WfPzFXXz

Author: elirantutia

CLAUDE.md

@@ -65,6 +65,7 @@ CLI-specific behavior is encapsulated behind a `CliProvider` interface (`src/mai
 - `terminal-pane.ts` — xterm.js wrapper per session, handles PTY data streaming and WebGL rendering with software fallback
 - `state.ts` — Reactive AppState singleton; debounced persistence (300ms) to `~/.vibeyard/state.json`
 - `split-layout.ts` — Manages tab mode (single terminal) vs split mode (side-by-side)
+- **Renders must not touch pane DOM they don't need to.** `renderLayout()` runs on every `session-changed`/`layout-changed`, and `appendChild` on a node that is *already* a child is a remove-and-reinsert: it blurs whatever is focused inside (the Cmd+F find bar is appended *into* `.terminal-pane`, see `search-bar.ts`) and collapses an in-progress selection. So every `attach*ToContainer` no-ops when `element.parentElement === container`; DOM order among the panes laid out together is corrected separately by `ensurePaneOrder` (split-layout) via the DOM-free `isInRelativeOrder` in `components/pane-order.ts` — *relative* order, because hidden panes stay in the container interleaved with the visible ones — and `renderSwarmMode` reuses its `.swarm-grid-wrapper` instead of rebuilding it. Focus is guarded one level up, not by sniffing the DOM: `setFocused` cannot tell the find bar from the terminal (it is inside the pane), so `focusPane` gates the call on the DOM-free `shouldFocusPane` (`components/pane-focus.ts`) — a render that does not change the focused pane never calls `setFocused` at all, unless focus is sitting on nothing. `fitTerminal` skips `pty.resize` when the `cols`x`rows` memo is unchanged (a redundant resize makes the CLI redraw under a selection, and xterm does `clearSelection()` on a row-count change); `spawnTerminal` clears that memo and re-fits **after** `pty.create` resolves, because a fit racing the un-awaited spawn is dropped by `resizePty` for a session it has not registered yet (Copilot awaits a hook install first) and the PTY would stay at the 120×30 spawn default. Feeding this loop, `updateSessionCliId` (`state.ts`) early-returns on an unchanged id and the statusLine's `write_if_changed` writes `.sessionid`/`.name` only on change — the statusLine fires on every render, and each write used to cost a persist plus a full re-render.
 - `session-activity.ts` — Tracks working/waiting/idle status with debounced transitions
 - **Hook → session-state contract** — see `HOOKS.md` for the full map; it is verified against a specific Claude Code version and must be re-checked against https://code.claude.com/docs/en/hooks whenever hook handling changes. Three points are load-bearing and easy to get wrong. (1) **`PostToolUse` fires only on success**; a tool that ran and failed fires `PostToolUseFailure` (`error`, `is_interrupt`, `duration_ms`), and a call rejected before execution fires neither. Treating any non-empty `tool_response` as a failure — which this repo did until the events were re-verified — feeds every successful tool call into `missing-tool-detector.ts`. (2) **A `Stop` is not always a completion**: the main agent fires one every time it pauses on parallel subagents. `stop_status_writer.py` resolves it from the payload's `background_tasks` array, holding `working` only for `subagent`/`teammate`/`workflow` entries; only a *non-empty* array is authoritative — an empty one is not proof of an idle session, because the CLI filters that array on an `isBackgrounded` flag freshly-dispatched subagents don't carry yet — so empty *and* absent both fall through to the legacy `<sid>.subagents` counter. `session_crons` is never consulted or a `/loop` session would never complete. (3) **Every field name in `INSPECTOR_FIELDS` (`claude-cli.ts`) must exist in a documented per-event schema, and be read by something.** A compile-time assertion against `keyof InspectorEvent` catches the internal half of that drift; the external half — whether Claude Code actually sends the field — no type system can check, and an invented name silently renders a blank timeline row forever (how `config_key`/`question`/`answer` survived for months). Beware nested keys when reading the docs: the Elicitation example's `requested_schema.properties.username.type` scans like top-level `type`/`username` fields, and both were added on a previous pass and were dead on arrival. Generated Python embeds values via `pyLiteral` (`shared/python.ts`), never a raw `r'…'` literal, which breaks on an apostrophe in the path.
 - `session-cost.ts` — Structured cost tracking via Claude CLI status line (`statusLine` setting), with regex fallback for older CLI versions. Provides per-session and aggregate cost data (USD, tokens, cache, duration)

src/main/hook-status.test.ts

@@ -101,9 +101,14 @@ describe('hook-status', () => {
       const opts = { input, env: { ...process.env, PYTHONIOENCODING: 'utf-8' } };
       return spawnSync('python3', ['-c', code], opts);
     };
+    // Memoised: three tests probe for python3, and each probe is a process launch.
+    let pythonAvailable: boolean | undefined;
     const hasPython = () => {
-      const { spawnSync } = require('child_process') as typeof import('child_process');
-      return !spawnSync('python3', ['-c', 'pass']).error;
+      if (pythonAvailable === undefined) {
+        const { spawnSync } = require('child_process') as typeof import('child_process');
+        pythonAvailable = !spawnSync('python3', ['-c', 'pass']).error;
+      }
+      return pythonAvailable;
     };
 
     it('extracts cost, context_window, session_id and session_name', () => {
@@ -154,6 +159,57 @@ describe('hook-status', () => {
       expect(body()).not.toContain("encoding=");
     });
 
+    it('writes .sessionid only when the id changed', () => {
+      // The statusLine fires on every render. An unconditional write reaches the
+      // renderer as an IPC that ends in a persist plus a full renderLayout(),
+      // which used to re-append the terminal pane many times a second — blurring
+      // the in-pane find bar and collapsing an in-progress selection.
+      if (!hasPython()) return; // no python3 on this runner
+
+      // Real fs, deliberately: `fs` is mocked in this suite, so the script's own
+      // writes are observed from inside Python instead.
+      const tmp = path.join(
+        process.env.TMPDIR || process.env.TEMP || '/tmp',
+        `vibeyard-statusline-${process.pid}`,
+      );
+      const driver = `
+import sys,os,io,json,builtins,shutil
+src=sys.stdin.read()
+d=${JSON.stringify(tmp)}
+shutil.rmtree(d,ignore_errors=True)
+os.makedirs(d)
+writes=[]
+real=builtins.open
+def spy(file,mode='r',*a,**k):
+    if str(file).endswith('.sessionid') and 'w' in mode:
+        writes.append(str(file))
+    return real(file,mode,*a,**k)
+builtins.open=spy
+os.environ['CLAUDE_IDE_SESSION_ID']='sess1'
+def run(payload):
+    sys.stdin=io.StringIO(payload)
+    try:
+        exec(compile(src,'statusline','exec'),{})
+    except SystemExit:
+        pass
+run('{"session_id":"cli-a"}')
+run('{"session_id":"cli-a"}')
+after_repeat=len(writes)
+run('{"session_id":"cli-b"}')
+final=real(os.path.join(d,'sess1.sessionid')).read()
+shutil.rmtree(d,ignore_errors=True)
+sys.stdout.write(json.dumps({'afterRepeat':after_repeat,'total':len(writes),'final':final}))
+`;
+      // Built against the temp dir so the script's .cost/.name writes land there too.
+      const result = runPython(driver, buildStatusLinePython(tmp));
+      expect(result.status).toBe(0);
+
+      const seen = JSON.parse(result.stdout.toString());
+      expect(seen.afterRepeat).toBe(1); // the repeat wrote nothing
+      expect(seen.total).toBe(2);       // the changed id did
+      expect(seen.final).toBe('cli-b');
+    });
+
     it('is syntactically valid Python', () => {
       // A syntax error here is silent in production: it kills cost, context,
       // sessionid and name at once, with the traceback going only to

src/main/hook-status.ts

@@ -49,6 +49,15 @@ export function getStatusLineScriptPath(): string {
  * The `.name` payload carries the CLI session id alongside the title so a
  * stale title can be told apart from the current conversation's.
  *
+ * `.sessionid` and `.name` both go through `write_if_changed`, which writes only
+ * when the content differs (and removes the file for an empty blob — how a
+ * cleared `.name` is retracted; `.sessionid` never passes one). The statusLine
+ * fires on every render, and each write reaches the renderer as an IPC that ends
+ * in a `persist()` plus a full `renderLayout()` — which used to detach and
+ * re-insert the terminal pane many times a second, blurring the in-pane find bar
+ * and breaking mouse selection. `.cost` is exempt: its payload genuinely changes
+ * on nearly every render, and it lands on a persist-only path with no re-render.
+ *
  * Installed as a real `.py` file on every platform and invoked by path, never
  * inlined into the shell command — see the module docstring in
  * `hook-commands.ts` for why inlining Python is fragile here.
@@ -77,28 +86,28 @@ if cost or ctx or model:
         payload['model']=model
     with open(os.path.join(status_dir,sid+'.cost'),'w') as f:
         json.dump(payload,f)
-claude_sid=d.get('session_id','')
-if claude_sid:
-    with open(os.path.join(status_dir,sid+'.sessionid'),'w') as f:
-        f.write(claude_sid)
-name_path=os.path.join(status_dir,sid+'.name')
-name=str(d.get('session_name') or '').strip()
-blob=json.dumps({'name':name,'session_id':claude_sid}) if name else ''
-prev=''
-try:
-    with open(name_path) as f:
-        prev=f.read()
-except:
-    pass
-if prev!=blob:
+def write_if_changed(path,blob):
+    prev=''
+    try:
+        with open(path) as f:
+            prev=f.read()
+    except:
+        pass
+    if prev==blob:
+        return
     try:
         if blob:
-            with open(name_path,'w') as f:
+            with open(path,'w') as f:
                 f.write(blob)
         else:
-            os.remove(name_path)
+            os.remove(path)
     except:
         pass
+claude_sid=d.get('session_id','')
+if claude_sid:
+    write_if_changed(os.path.join(status_dir,sid+'.sessionid'),claude_sid)
+name=str(d.get('session_name') or '').strip()
+write_if_changed(os.path.join(status_dir,sid+'.name'),json.dumps({'name':name,'session_id':claude_sid}) if name else '')
 `;
 }
 

src/renderer/components/pane-focus.test.ts

@@ -0,0 +1,25 @@
+import { describe, it, expect } from 'vitest';
+import { shouldFocusPane, type PaneFocusMemo } from './pane-focus';
+
+describe('shouldFocusPane', () => {
+  const prev: PaneFocusMemo = { projectId: 'p1', sessionId: 's1' };
+
+  it('focuses on the first render', () => {
+    expect(shouldFocusPane(null, prev, false)).toBe(true);
+  });
+
+  it('focuses when the session or the project changed', () => {
+    expect(shouldFocusPane(prev, { projectId: 'p1', sessionId: 's2' }, false)).toBe(true);
+    expect(shouldFocusPane(prev, { projectId: 'p2', sessionId: 's1' }, false)).toBe(true);
+  });
+
+  it('leaves focus alone on a repeat render', () => {
+    // The find bar the user is typing into lives inside the pane, so setFocused
+    // cannot tell it from the terminal — this is where it is protected.
+    expect(shouldFocusPane(prev, { ...prev }, false)).toBe(false);
+  });
+
+  it('reclaims focus on a repeat render when nothing holds it', () => {
+    expect(shouldFocusPane(prev, { ...prev }, true)).toBe(true);
+  });
+});

src/renderer/components/pane-focus.ts

@@ -0,0 +1,29 @@
+// Focus decisions for the layout, kept DOM-free so they can be unit-tested.
+
+/** Which pane the layout last moved DOM focus to. */
+export interface PaneFocusMemo {
+  projectId: string;
+  sessionId: string;
+}
+
+/**
+ * Whether a layout render may move DOM focus into `next`'s pane.
+ *
+ * `renderLayout()` runs on every `session-changed` — a background statusLine tick
+ * included — so only an actual change of the focused pane justifies taking focus.
+ * The Cmd+F find bar lives inside the pane it searches, which makes it invisible
+ * to `setFocused`'s "is focus already on a terminal" test; not calling `setFocused`
+ * at all is what keeps the user's keystrokes in it.
+ *
+ * `focusIsIdle` (nothing focused, or the body) re-opens the door on a repeat
+ * render, so focus still lands in the terminal when it is sitting nowhere.
+ */
+export function shouldFocusPane(
+  prev: PaneFocusMemo | null,
+  next: PaneFocusMemo,
+  focusIsIdle: boolean,
+): boolean {
+  if (!prev) return true;
+  if (prev.projectId !== next.projectId || prev.sessionId !== next.sessionId) return true;
+  return focusIsIdle;
+}

src/renderer/components/pane-order.test.ts

@@ -0,0 +1,30 @@
+import { describe, it, expect } from 'vitest';
+import { isInRelativeOrder } from './pane-order';
+
+describe('isInRelativeOrder', () => {
+  it('accepts an empty wanted list', () => {
+    expect(isInRelativeOrder(['a', 'b'], [])).toBe(true);
+    expect(isInRelativeOrder([], [])).toBe(true);
+  });
+
+  it('accepts a contiguous run in order', () => {
+    expect(isInRelativeOrder(['a', 'b', 'c'], ['a', 'b', 'c'])).toBe(true);
+  });
+
+  it('ignores unrelated nodes interleaved between the wanted ones', () => {
+    // Hidden panes stay in the container between the laid-out ones.
+    expect(isInRelativeOrder(['a', 'hidden', 'b'], ['a', 'b'])).toBe(true);
+  });
+
+  it('rejects a swapped pair', () => {
+    expect(isInRelativeOrder(['b', 'a'], ['a', 'b'])).toBe(false);
+  });
+
+  it('rejects a wanted node that is not a child yet', () => {
+    expect(isInRelativeOrder(['a'], ['a', 'b'])).toBe(false);
+  });
+
+  it('rejects a node moved to the front of the container', () => {
+    expect(isInRelativeOrder(['c', 'a', 'b'], ['a', 'b', 'c'])).toBe(false);
+  });
+});

src/renderer/components/pane-order.ts

@@ -0,0 +1,19 @@
+// DOM-order decisions for the layout, kept DOM-free so they can be unit-tested.
+
+/**
+ * Whether `wanted` already sits inside `children` in that relative order — i.e.
+ * whether a layout pass needs to move any pane at all.
+ *
+ * Only the *relative* order matters: hidden panes stay in the container and sit
+ * interleaved with the laid-out ones, so a `previousSibling` comparison would
+ * report a false mismatch and re-append every pane on every render.
+ */
+export function isInRelativeOrder<T>(children: readonly T[], wanted: readonly T[]): boolean {
+  let last = -1;
+  for (const item of wanted) {
+    const index = children.indexOf(item);
+    if (index === -1 || index < last) return false;
+    last = index;
+  }
+  return true;
+}

src/renderer/components/remote-terminal-pane.test.ts

@@ -9,6 +9,7 @@ class FakeTerminal {
 
   loadAddon(): void {}
   onData(): void {}
+  onSelectionChange(): void {}
   open(): void {}
   write(): void {}
   dispose(): void {}
@@ -54,6 +55,8 @@ class FakeElement {
   innerHTML = '';
 
   appendChild(child: FakeElement): FakeElement {
+    // Mirror the DOM: appending a node that already has a parent moves it.
+    child.remove();
     child.parentElement = this;
     this.children.push(child);
     return child;
@@ -125,3 +128,57 @@ describe('applyThemeToAllRemoteTerminals()', () => {
     expect((instance.terminal as unknown as FakeTerminal).options.theme).toBe(lightTerminalTheme);
   });
 });
+
+describe('attachRemoteToContainer()', () => {
+  beforeEach(() => {
+    vi.resetModules();
+    vi.clearAllMocks();
+    vi.stubGlobal('document', new FakeDocument());
+  });
+
+  /** Stand in for the .xterm node terminal.open() would have created. */
+  function markOpened(element: FakeElement): void {
+    const screen = new FakeElement();
+    screen.className = 'xterm';
+    element.querySelector('.xterm-wrap')!.appendChild(screen);
+  }
+
+  it('does not re-append a pane that is already in the container', async () => {
+    // appendChild on an existing child removes and re-inserts it, blurring
+    // whatever is focused inside and collapsing any selection.
+    const { createRemoteTerminalPane, attachRemoteToContainer, getRemoteTerminalInstance, _resetForTesting } =
+      await import('./remote-terminal-pane.js');
+    const container = new FakeElement();
+
+    _resetForTesting();
+    createRemoteTerminalPane('remote-attach', 'readonly', 80, 24, () => {});
+    attachRemoteToContainer('remote-attach', container as unknown as HTMLElement);
+
+    const element = getRemoteTerminalInstance('remote-attach')!.element as unknown as FakeElement;
+    markOpened(element);
+
+    attachRemoteToContainer('remote-attach', container as unknown as HTMLElement);
+    attachRemoteToContainer('remote-attach', container as unknown as HTMLElement);
+
+    expect(container.children).toEqual([element]);
+  });
+
+  it('moves a pane attached to a different container', async () => {
+    const { createRemoteTerminalPane, attachRemoteToContainer, getRemoteTerminalInstance, _resetForTesting } =
+      await import('./remote-terminal-pane.js');
+    const first = new FakeElement();
+    const second = new FakeElement();
+
+    _resetForTesting();
+    createRemoteTerminalPane('remote-move', 'readonly', 80, 24, () => {});
+    attachRemoteToContainer('remote-move', first as unknown as HTMLElement);
+
+    const element = getRemoteTerminalInstance('remote-move')!.element as unknown as FakeElement;
+    markOpened(element);
+
+    attachRemoteToContainer('remote-move', second as unknown as HTMLElement);
+
+    expect(first.children).toEqual([]);
+    expect(second.children).toEqual([element]);
+  });
+});

src/renderer/components/remote-terminal-pane.ts

@@ -93,6 +93,7 @@ export function getRemoteTerminalInstance(sessionId: string): RemoteTerminalInst
   return instances.get(sessionId);
 }
 
+/** Idempotent — see `attachToContainer` in `terminal-pane.ts` for why that matters. */
 export function attachRemoteToContainer(sessionId: string, container: HTMLElement): void {
   const instance = instances.get(sessionId);
   if (!instance) return;
@@ -104,7 +105,7 @@ export function attachRemoteToContainer(sessionId: string, container: HTMLElemen
     attachCopyOnSelect(instance.terminal);
 
     loadWebglWithFallback(instance.terminal);
-  } else {
+  } else if (instance.element.parentElement !== container) {
     container.appendChild(instance.element);
   }
 }