Transcript: click anywhere on an edits card's header to expand or collapse it

Merged
TE
7d ago
+402-31

Leo, on the edits card in the transcript ("± Edited MEMORY.md +1 -0"): "this thing i can't click the whole thing to expand/collapse only on the middle strip it's weird and bad"

Takes back #26704: not a revert. Its data-interactive mark on the edits card's title moves to the whole header, which is now the control that owns the click.

What changed

  • Edits card header (EditedFilesCard.tsx): the whole header is now the toggle, edge to edge. That covers its padding, the ± icon, the title, the counts, the empty middle, and the right end past the chevron. A one-file card opens and closes its diff from it, and a folded card (show: collapsed) shows or hides its rows. Before this change only the title's strip and the chevron toggled. View changes and Undo still handle their own clicks. The chevron is still the keyboard and screen-reader control.
  • Hover: the highlight covers the header and nothing else. It goes away while the pointer is on one of the header's own buttons, since those light themselves, and the chevron no longer draws a second highlight inside it. The cursor stays the arrow (cursor: default), as clickable-cursor.test.ts requires; the pointing hand is banned in webviews.
  • The same shape in other rows: an agent message's line (AgentMessageRow.tsx) used to toggle only from its words and its toggle button. Its icon, the gaps and the meta now toggle too, and the old per-span handlers are gone. A disclosure row's line (DisclosureRow.tsx: received messages, agent cards, sub-session calls) now toggles from its leading padding, gaps and trailing space. The sender chip, the open-chat button, Reply and menus keep their own clicks. I checked tool rows, thoughts, Worked for, subagent groups and sent-message lines: each is already one full-width toggle, so they are unchanged.
  • One helper, conversation/headerToggle.ts, holds the rule. A click on the header toggles unless it lands on a control of the header's own (button, link, role=button, menu item, input), comes from a portal, or ends a text selection. Headers carry data-header-toggle, which foldAnchor.ts holds in place while the body folds, the same way it holds a toggle button.

Edits card design reference: design/ has no transcript or edits-card spec yet.

Tests

webviews/test/agent-pane-edited-head-toggle-browser.test.ts runs in real Chromium against the pane's dev entry with a stand-in daemon. For a one-file card it clicks the left padding, the icon, the counts, the empty middle, the right end past the chevron, the top inset, the bottom inset and the top-left corner. Each click must toggle aria-expanded. It then checks that View changes keeps its own click. A second case checks that the hover covers the header but not while View changes is under the pointer, and that the cursor is the arrow.

  • Base (EditedFilesCard.tsx and turnChanges.css at f66a92e7c6e, new test on top): fails. The first click ("the left padding") leaves expanded: "false", and the header's hover background stays rgba(0, 0, 0, 0).
  • Head: passes. The fleet ran bun test on headerToggle.test.ts, foldAnchor.test.ts, the new browser test, agent-pane-edited-calm, agent-pane-edited-card-expand, agent-pane-diff-find, transcript-gap-select-browser and clickable-cursor: 140 pass, 0 fail. vp fmt --check is clean at head, and the lint and type check found 0 errors.

Observed / Not run

  • Observed: the fleet cmux-ci test runs above, red at base and green at head.
  • Not run: a native capture. The change is webview-only, and Leo tries the build himself.

Changelog

Fixed: In the agent chat, clicking anywhere on an edits card's header (or a message or disclosure line) now expands or collapses it, not just the middle strip.

risk: normal (webview pointer handling in the transcript only).

Agent session: agent session

🤖 Generated with Claude Code

View with [code]smith Autofix with [code]smith
Need help on this PR? Tag @codesmith-bot with what you need.

Summary by cubic

Fixes the transcript's edits card so the entire header expands or collapses on click, not just the middle strip; the same full-width toggle now applies to agent message and disclosure row lines.

  • A click toggles unless it lands on one of the header's own controls (View changes, Undo, a sender chip, Reply, a menu) or ends a text selection; a received message's sender keeps its own click to open that session.
  • The chevron stays the keyboard and screen-reader control and no longer draws a second highlight; headers keep data-interactive so gap selection still works and are held in place while their body folds.
  • Adds a unit test for the click rule and a Chromium browser test covering the header's edges and insets, plus a gallery audit entry.