fix(web): model erase-in-line, tab stops, and cross-line SGR

Six findings. Each terminal-semantics case was checked in a real terminal
(tmux, reading back the painted screen) before changing anything:

`100%\r\x1b[KOK` shows `OK`. Modelling the `\r` without its erase left the
previous frame's tail standing — a regression against the old truncate, since
`\r\x1b[K` is the single idiom every spinner and progress bar writes. Erase is
now part of the same replay, in all three parameter forms.

`a\tb\rXY` shows `XY      b`. Counting a tab as one column produced `XYb` and
destroyed the alignment this card exists to hold, so the cursor now advances
by terminal columns: tabs reach the next 8-column stop and a wide character
takes two cells.

`\x1b[31mabc\rX\nnext` paints BOTH lines red. A newline does not reset the
graphic state, so state threads from one replayed line to the next instead of
closing at each line end.

Only `m` accumulates into a cell's style now. Folding cursor and erase
sequences in grew the state string per redraw and emitted boundaries anser
had to discard.

The empty check reads the parsed lines the card renders rather than the raw
text: output that is only escapes or control bytes survives `trim()` yet
parses to nothing, and drew blank rows plus a copy control for invisible
bytes instead of the placeholder.

The gutter is the card's own left padding rather than a margin. Every render
site rewrites `margin` wholesale for its own indent, which silently cancelled
the reservation and let a container clip the dot.

The fixture sample no longer carries an `[exit code: 1]` line: the real bash
presenter consumes that marker precisely because the card shows the exit as
its own pill, so the built-bundle snapshot had pinned a frame showing it
twice — one the product path cannot produce.
This commit is contained in:
Chinesezjc
2026-07-29 15:36:16 +08:00
parent 612b3c7c4e
commit 43de478d10
11 changed files with 224 additions and 55 deletions

View File

@@ -220,16 +220,24 @@ describe('web e2e: navigation & panes over a rich seeded session', () => {
// puts it to the left of the `$`.
beforePrompt: node.compareDocumentPosition(node.parentElement!.querySelector('[class*="_cwd_"]')!)
=== Node.DOCUMENT_POSITION_FOLLOWING,
// The dot is out of flow in the card's left gutter, so it starts to the
// left of the card surface itself — the geometry jsdom cannot compute.
leftOfCard: (node as HTMLElement).getBoundingClientRect().left
< node.closest('[data-terminal]')!.getBoundingClientRect().left,
// The dot lives in the card's OWN left padding, so it sits inside the
// card box yet left of the prompt text. Owning the reservation as padding
// rather than margin is what keeps a consumer's own margin from
// cancelling it and letting a container clip the dot — geometry jsdom
// cannot compute.
insideCard: (node as HTMLElement).getBoundingClientRect().left
>= (node.closest('[data-terminal]')?.getBoundingClientRect().left ?? Infinity),
leftOfPrompt: (node as HTMLElement).getBoundingClientRect().right
<= (node.closest('[class*="_promptLine_"]')
?.querySelector('[class*="_cwd_"]')
?.getBoundingClientRect().left ?? -Infinity),
}
})
expect(dot.state).toBe('done')
expect(dot.label).toBe('已完成')
expect(dot.beforePrompt).toBe(true)
expect(dot.leftOfCard).toBe(true)
expect(dot.insideCard).toBe(true)
expect(dot.leftOfPrompt).toBe(true)
// Resolved through the theme token, not a literal hex in the component.
expect(dot.success).toMatch(/^rgb/)
expect(dot.color).toBe(dot.success)