From 1dd3e60f5043420909d9fd9b3f59607f03ca906c Mon Sep 17 00:00:00 2001 From: 07akioni <07akioni2@gmail.com> Date: Mon, 31 Aug 2026 17:22:25 +0800 Subject: [PATCH 01/26] fix(web): make streaming code fences incremental --- ...20-web-streaming-fence-highlight.i18n.yaml | 4 +- ...026-08-20-web-streaming-fence-highlight.md | 17 +- ...-08-20-web-streaming-fence-highlight.zh.md | 17 +- ...8-25-loaded-turn-chat-navigation.i18n.yaml | 4 +- .../2026-08-25-loaded-turn-chat-navigation.md | 4 +- ...26-08-25-loaded-turn-chat-navigation.zh.md | 4 +- packages/client/ui-chat/README.i18n.yaml | 4 +- packages/client/ui-chat/README.md | 8 + packages/client/ui-chat/README.zh.md | 8 + .../ui-chat/src/client/chat/ChatView.tsx | 8 +- .../ui-chat/tests/chat-view.client.spec.tsx | 52 ++++ .../client/ui-primitives/README.i18n.yaml | 4 +- packages/client/ui-primitives/README.md | 5 +- packages/client/ui-primitives/README.zh.md | 5 +- .../ui-primitives/src/markdown/CodeBlock.tsx | 94 +++++-- .../src/markdown/MarkdownText.tsx | 6 +- .../ui-primitives/src/markdown/highlight.ts | 92 ++++--- .../ui-primitives/src/markdown/incremental.ts | 256 +++++++++++++++++- .../markdown-incremental.client.spec.tsx | 121 +++++++++ .../streaming-code-block.client.spec.tsx | 42 ++- 20 files changed, 649 insertions(+), 106 deletions(-) diff --git a/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.i18n.yaml b/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.i18n.yaml index 2139112dec..bd978d1920 100644 --- a/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.i18n.yaml +++ b/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.i18n.yaml @@ -2,5 +2,5 @@ # side as of the last confirmed-consistent state. Both languages carry equal authority; # after editing either side, bring the other along and re-record with: # pnpm run verify-translation-pairing --write .agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md -2026-08-20-web-streaming-fence-highlight.md: ccc961da1febba3611e3e558087b586c6f1f474b -2026-08-20-web-streaming-fence-highlight.zh.md: e5d29545bf659ed572d052f1212d68d344d49b5a +2026-08-20-web-streaming-fence-highlight.md: aa44a8c7ea91ff4913d92449d62a6ebf9406e922 +2026-08-20-web-streaming-fence-highlight.zh.md: 88bae36928ac8d00960e529addeb4f30240e3579 diff --git a/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md b/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md index ccc961da1f..aa44a8c7ea 100644 --- a/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md +++ b/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md @@ -10,17 +10,18 @@ While a reply streamed, `MarkdownText` stripped the fence language before `CodeB ## Decision -Streaming fences highlight incrementally through grammar-state resumption; the settled arm is unchanged. +Streaming fences parse, tokenize, and reconcile from retained frontiers; the settled output is unchanged. -- **`StreamingHighlightSession`** (`packages/client/ui-primitives/src/markdown/highlight.ts`) exploits that TextMate tokenization is line-based and forward-only: a line's tokens depend only on its own text and the grammar state entering it, so appended text never changes a completed line's tokens. The session caches completed lines' spans plus shiki's `GrammarState` after them (`getLastGrammarState`), and each update tokenizes newly completed text via `codeToTokensBase(…, { grammarState })` plus the still-growing last line. Per-chunk cost excludes the completed prefix; the result is token-identical to a from-scratch tokenization. Non-append input and a resolved-grammar change reset the cache and re-tokenize fully. Each run carries the style shiki's HTML arm would assign it — the css-variables color plus the markup font-style bits the theme lets through (bold/italic/underline; markdown fences carry them); whitespace-only runs fold into their following token as shiki's default `mergeWhitespaces` does (its underlined/struck-whitespace exemption cannot occur under this theme, whose only underline rule styles inline-link scopes that tokenize spaced text as one run); and a CRLF cut never leaks its `\r` into the last completed line, matching shiki's own line splitting — so the streaming spans and the settled `codeToHtml` swap render one identical span tree. -- **`CodeBlock`** gains a `streaming` prop: it renders the session's spans as a `pre.shiki.css-variables` React tree with the same attributes shiki's HTML emits, holds the session and per-line elements in refs, and reuses a retained line's element identity so React leaves that line's DOM untouched. Unknown or absent languages keep the identical-geometry plain arm; a lazy grammar renders plain until it registers, then the existing `useSyncExternalStore` load signal re-renders into highlight — one plain→highlighted transition, no flicker back. -- **`render.tsx`** passes `lang` and `context.streaming` to fences. Wrong-grammar transients are structurally impossible: a fence whose info string is still mid-chunk (`` ```py `` completing to `` ```python ``) has no content yet — content only exists after the info line's newline, which finalizes the language — and the empty-value fence keeps the stock `
`. The streaming CodeBlock instance survives every chunk because streaming render keys are source offsets. `` ```math `` fences and TeX stay literal until the settled pass; the language banner shows the fence language during streaming.
+- **`IncrementalMarkdownParser`** (`packages/client/ui-primitives/src/markdown/incremental.ts`) recognizes a parser-confirmed final unclosed top-level fence after the ordinary tail parse. Completed content remains in the retained `code` node; only the last completed line and current partial line pass through the caller's GFM grammar, preserving its newline, indentation, CRLF, and value semantics without re-parsing the fence prefix. A closing delimiter, non-append input, nested/container fence, or ambiguous reconstruction returns to the ordinary tail parse.
+- **`StreamingHighlightSession`** (`packages/client/ui-primitives/src/markdown/highlight.ts`) exploits that TextMate tokenization is line-based and forward-only: a line's tokens depend only on its own text and the grammar state entering it, so appended text never changes a completed line's tokens. The session caches completed lines' spans plus shiki's `GrammarState` after them (`getLastGrammarState`); `updateFrame` publishes only newly completed lines plus the still-growing last line, while the compatibility `update` method materializes the complete result. Per-chunk tokenization excludes the completed prefix; the result is token-identical to a from-scratch tokenization. Non-append input and a resolved-grammar change reset the cache and re-tokenize fully. Each run carries the style shiki's HTML arm would assign it — the css-variables color plus the markup font-style bits the theme lets through (bold/italic/underline; markdown fences carry them); whitespace-only runs fold into their following token as shiki's default `mergeWhitespaces` does (its underlined/struck-whitespace exemption cannot occur under this theme, whose only underline rule styles inline-link scopes that tokenize spaced text as one run); and a CRLF cut never leaks its `\r` into the last completed line, matching shiki's own line splitting.
+- **`CodeBlock`** renders the delta frames as a `pre.shiki.css-variables` React tree with the same attributes and token spans shiki's HTML emits. Completed lines seal into fixed-size React fragments; later updates reuse those fragment elements and reconcile only a bounded pending group plus the mutable tail. Unknown or absent languages keep the identical-geometry plain arm; a lazy grammar renders plain until it registers, then the existing `useSyncExternalStore` load signal re-renders into highlight — one plain→highlighted transition, no flicker back. Group size is an internal reconciliation unit, not a deployment policy or content limit.
+- **`render.tsx` and `MarkdownText`** pass `lang` and `context.streaming` to fences and key both streaming and settled top-level blocks by source offset. Wrong-grammar transients are structurally impossible: a fence whose info string is still mid-chunk (`` ```py `` completing to `` ```python ``) has no content yet — content only exists after the info line's newline, which finalizes the language — and the empty-value fence keeps the stock `
`. `` ```math `` fences and TeX stay literal until the settled pass; the language banner shows the fence language during streaming.
 
-The settle swap re-renders through `highlightToHtml`: same tokens, same span tree, so the swap is visually invisible and never touches the code content.
+The final full-document parse still resolves document-wide references and math. When that parse produces the same fence code and language, the source-offset key preserves its `CodeBlock` instance and the component reuses the complete streamed React tree; cold settled fences continue through `highlightToHtml`.
 
 ## Testing
 
-Package tests cover incremental/from-scratch equivalence across multiline grammar state, blank lines, CRLF, and markup styles; cache identity and reset/lazy paths; streaming/settled token-tree parity; DOM retention; and plain or math fallbacks. The assembled Web browser snapshot boots the real Web composition, streams a TypeScript fence through the Host and SSE path, pauses the deterministic LLM adapter while the reply is still active, and snapshots Chromium's Shiki token tree before verifying that settlement preserves it. The `tests/fixtures/markdown-dom/*.streaming.txt` fixtures pin the intentional streaming divergence from their react-markdown origin: the Shiki span tree and visible language banner replace the plain arm.
+Package tests bound the grammar input accumulated across 800 open-fence lines, compare each incremental result with a full parse, and cover indented delimiters, CRLF split across chunks, closure fallback, and non-append reset. Highlighter tests cover incremental/from-scratch equivalence across multiline grammar state, blank lines, CRLF, and markup styles; delta identity and reset/lazy paths; fixed-group DOM retention; streamed-to-settled DOM identity; and plain or math fallbacks. The assembled Web browser snapshot boots the real Web composition, streams a TypeScript fence through the Host and SSE path, pauses the deterministic LLM adapter while the reply is still active, and snapshots Chromium's Shiki token tree before verifying that settlement preserves it. The `tests/fixtures/markdown-dom/*.streaming.txt` fixtures pin the intentional streaming divergence from their react-markdown origin: the Shiki span tree and visible language banner replace the plain arm.
 
 ## Alternatives considered
 
@@ -28,10 +29,12 @@ Package tests cover incremental/from-scratch equivalence across multiline gramma
 
 **Highlight only frozen (closed, settled-position) fences during streaming.** Bounded cost, but an unclosed fence pins the incremental parser's tail, so the actively growing fence — the one on screen — would stay plain until the reply finishes, failing the issue's "识别语言后即可增量高亮".
 
+**Keep only a fixed window of highlighted lines and turn the older prefix into plain text.** This bounds live token DOM and can reduce layout further, but changes already rendered content, complicates selection across the window boundary, and makes a tunable presentation policy part of `CodeBlock`. Retained parser, tokenizer, and React frontiers remove the avoidable repeated work without discarding colors; the complete token DOM remains an explicit limitation rather than a hidden semantic change.
+
 **Move highlighting to a worker or async pass.** Rejected when shiki was adopted ([synchronous highlighting note](../process/2026-07-26-web-syntax-highlighting-shiki.md)); an async swap also reintroduces the plain→colored→plain flicker class this change must avoid.
 
 **Build the settled HTML string incrementally and keep `dangerouslySetInnerHTML`.** Exact settled parity for free, but React replaces the whole `innerHTML` per chunk, so the browser re-parses and rebuilds every line's DOM each time — O(fence) DOM churn that forfeits the token-level win the session provides.
 
 ## Consequences
 
-Streaming code is readable as it arrives: tokens color as soon as the language is known, completed lines never re-tokenize or re-render, and the finalize swap is invisible for fences. The package owns a small mirror of shiki's HTML-arm conventions — the `pre` attributes and the whitespace fold — pinned by the arm-parity test, so a shiki upgrade that changes either fails loud there instead of drifting the two arms apart. The streaming DOM-parity fixtures pin Shiki span trees as an intentional divergence from their react-markdown origin. The still-growing last line re-tokenizes per chunk (bounded by one line), and a pathological single-line fence still degrades to full re-tokenization per chunk — the same degradation class the incremental block parser accepts for a single giant block.
+Streaming code is readable as it arrives: tokens color as soon as the language is known; completed top-level fence content neither re-parses nor re-tokenizes; sealed React groups keep their elements and DOM; and settlement preserves the highlighted tree. The package owns a small mirror of shiki's HTML-arm conventions — the `pre` attributes and the whitespace fold — pinned by the arm-parity test, so a shiki upgrade that changes either fails loud there instead of drifting the two arms apart. The streaming DOM-parity fixtures pin Shiki span trees as an intentional divergence from their react-markdown origin. The retained DOM still grows with final token count, so browser style and layout work is not length-independent. Nested/container fences use the ordinary tail parser, and the still-growing last line re-tokenizes per chunk; a pathological single-line fence therefore remains the worst case.
diff --git a/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md b/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md
index e5d29545bf..88bae36928 100644
--- a/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md
+++ b/.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md
@@ -10,17 +10,18 @@ Status: implemented
 
 ## Decision
 
-流式围栏通过 grammar state 续接实现增量高亮;定稿臂保持不变。
+流式围栏从保留的解析、tokenize 与 reconcile 前沿继续推进;定稿输出保持不变。
 
-- **`StreamingHighlightSession`**(`packages/client/ui-primitives/src/markdown/highlight.ts`)利用 TextMate tokenize 按行、且只向前推进的性质:一行的 token 只取决于该行文本与进入该行时的 grammar state,因此追加的文本永远不会改变已完成行的 token。会话缓存已完成行的 span 以及其后的 shiki `GrammarState`(`getLastGrammarState`),每次更新通过 `codeToTokensBase(…, { grammarState })` tokenize 新完成的文本,外加仍在增长的最后一行。每分片成本不包含已完成的前缀;结果与从头 tokenize 逐 token 一致。非追加输入与解析后语法变化会重置缓存并完整重新 tokenize。每个 run 携带 shiki HTML 臂会赋予它的样式——css-variables 颜色加上主题放行的 markup 字体位(bold/italic/underline;markdown 围栏会携带它们);纯空白 run 并入其后的 token,与 shiki 默认的 `mergeWhitespaces` 一致(其对带下划线/删除线空白的豁免在该主题下不可能出现:主题唯一的 underline 规则作用于 inline-link scope,其含空格文本整体成一个 run);CRLF 切割点的 `\r` 绝不进入最后一个已完成行,与 shiki 自身的行切分一致——因此流式 span 与定稿 `codeToHtml` 换入的 span 树完全一致。
-- **`CodeBlock`** 新增 `streaming` prop:把会话的 span 渲染为带有 shiki HTML 同款属性的 `pre.shiki.css-variables` React 树,用 ref 持有会话与逐行元素,并复用保留行的元素标识,让 React 完全不触碰该行的 DOM。未知或缺失语言保持几何一致的纯文本臂;懒加载语法在注册前渲染纯文本,注册后由既有的 `useSyncExternalStore` 加载信号触发重渲染进入高亮——只有一次纯文本→高亮的转换,不会闪回。
-- **`render.tsx`** 向围栏传递 `lang` 与 `context.streaming`。错误语法的瞬时着色在结构上不可能出现:info string 尚在分片中途的围栏(`` ```py `` 补全为 `` ```python ``)还没有内容——内容只在 info 行的换行之后才存在,而该换行恰恰定格了语言——空值围栏保持原生 `
`。流式渲染 key 是源偏移,围栏的 CodeBlock 实例因此跨分片存活。`` ```math `` 围栏与 TeX 在定稿前保持字面量;语言横幅在流式期间显示围栏语言。
+- **`IncrementalMarkdownParser`**(`packages/client/ui-primitives/src/markdown/incremental.ts`)会在普通尾部解析后识别经 parser 确认、位于末尾且未闭合的顶层 fence。已完成内容保留在既有 `code` node 中;只有最后一个已完成行与当前未完成行再次进入调用方的 GFM grammar,因此无需重新解析 fence 前缀,也能保留其换行、缩进、CRLF 与 value 语义。出现闭合分隔符、非追加输入、嵌套/容器内 fence 或无法明确重建时,会回到普通尾部解析。
+- **`StreamingHighlightSession`**(`packages/client/ui-primitives/src/markdown/highlight.ts`)利用 TextMate tokenize 按行、且只向前推进的性质:一行的 token 只取决于该行文本与进入该行时的 grammar state,因此追加的文本永远不会改变已完成行的 token。会话缓存已完成行的 span 以及其后的 shiki `GrammarState`(`getLastGrammarState`);`updateFrame` 只发布新完成行与仍在增长的最后一行,兼容方法 `update` 则物化完整结果。每分片 tokenize 成本不包含已完成的前缀;结果与从头 tokenize 逐 token 一致。非追加输入与解析后语法变化会重置缓存并完整重新 tokenize。每个 run 携带 shiki HTML 臂会赋予它的样式——css-variables 颜色加上主题放行的 markup 字体位(bold/italic/underline;markdown 围栏会携带它们);纯空白 run 并入其后的 token,与 shiki 默认的 `mergeWhitespaces` 一致(其对带下划线/删除线空白的豁免在该主题下不可能出现:主题唯一的 underline 规则作用于 inline-link scope,其含空格文本整体成一个 run);CRLF 切割点的 `\r` 绝不进入最后一个已完成行,与 shiki 自身的行切分一致。
+- **`CodeBlock`** 把增量 frame 渲染为带有 shiki HTML 同款属性与 token span 的 `pre.shiki.css-variables` React 树。已完成行会封入固定大小的 React fragment;后续更新复用这些 fragment element,只 reconcile 一个有界的待完成分组与可变尾部。未知或缺失语言保持几何一致的纯文本臂;懒加载语法在注册前渲染纯文本,注册后由既有的 `useSyncExternalStore` 加载信号触发重渲染进入高亮——只有一次纯文本→高亮的转换,不会闪回。分组大小只是内部 reconcile 单元,不是部署策略或内容上限。
+- **`render.tsx` 与 `MarkdownText`** 向围栏传递 `lang` 与 `context.streaming`,并让流式和定稿的顶层 block 都按源偏移设置 key。错误语法的瞬时着色在结构上不可能出现:info string 尚在分片中途的围栏(`` ```py `` 补全为 `` ```python ``)还没有内容——内容只在 info 行的换行之后才存在,而该换行恰恰定格了语言——空值围栏保持原生 `
`。`` ```math `` 围栏与 TeX 在定稿前保持字面量;语言横幅在流式期间显示围栏语言。
 
-定稿切换经 `highlightToHtml` 重渲染:token 相同、span 树相同,切换在视觉上不可见,也绝不触碰代码内容。
+最终的全量文档解析仍会解决跨文档引用与数学语法。当该解析产生相同的 fence 代码与语言时,源偏移 key 会保留其 `CodeBlock` 实例,组件则复用完整的流式 React 树;冷启动的定稿 fence 继续使用 `highlightToHtml`。
 
 ## Testing
 
-包测试覆盖跨多行 grammar state、空行、CRLF 与 markup 样式的增量/从头等价性,缓存标识与重置/懒加载路径,流式/定稿 token 树一致性,DOM 保留,以及纯文本和 math 回退。组装后的 Web 浏览器快照会启动真实 Web 组合,让 TypeScript 围栏经过 Host 与 SSE 路径流式传输,在回复仍活跃时暂停确定性 LLM 适配器并对 Chromium 中的 Shiki token 树做快照,然后验证定稿保留该 token 树。`tests/fixtures/markdown-dom/*.streaming.txt` fixture 锁定相对 react-markdown 来源的一项有意分叉:Shiki span 树与可见语言横幅取代纯文本臂。
+包测试会约束 800 行未闭合 fence 的累计 grammar 输入量、逐次比较增量结果与全量解析,并覆盖缩进分隔符、跨分片 CRLF、闭合回退与非追加重置。高亮测试覆盖跨多行 grammar state、空行、CRLF 与 markup 样式的增量/从头等价性,delta 标识与重置/懒加载路径,固定分组的 DOM 保留,从流式到定稿的 DOM 标识,以及纯文本和 math 回退。组装后的 Web 浏览器快照会启动真实 Web 组合,让 TypeScript 围栏经过 Host 与 SSE 路径流式传输,在回复仍活跃时暂停确定性 LLM 适配器并对 Chromium 中的 Shiki token 树做快照,然后验证定稿保留该 token 树。`tests/fixtures/markdown-dom/*.streaming.txt` fixture 锁定相对 react-markdown 来源的一项有意分叉:Shiki span 树与可见语言横幅取代纯文本臂。
 
 ## Alternatives considered
 
@@ -28,10 +29,12 @@ Status: implemented
 
 **流式期间只高亮已冻结(闭合且位置定格)的围栏。** 成本有界,但未闭合围栏会钉住增量解析器的尾部,于是正在增长的围栏——屏幕上的那个——要等回复结束才高亮,不满足 issue 的"识别语言后即可增量高亮"。
 
+**只保留固定窗口内的高亮行,并把更早的前缀转成纯文本。** 这能限制流式 token DOM 并进一步降低布局成本,但会改变已经渲染的内容、让跨窗口边界的选择更复杂,还会把可调的展示策略塞进 `CodeBlock`。保留解析、tokenize 与 React 前沿可以在不丢颜色的情况下消除可避免的重复工作;完整 token DOM 被明确记录为限制,而不是隐藏的语义变化。
+
 **把高亮移到 worker 或异步流程。** 采纳 shiki 时已否决([同步高亮笔记](../process/2026-07-26-web-syntax-highlighting-shiki.zh.md));异步换入还会重新引入本变更必须避免的纯文本→彩色→纯文本闪烁类问题。
 
 **增量拼接定稿 HTML 字符串并继续使用 `dangerouslySetInnerHTML`。** 白得定稿一致性,但 React 每个分片都会整体替换 `innerHTML`,浏览器每次重新解析并重建所有行的 DOM——O(围栏) 的 DOM 翻搅,抵消了会话在 token 层的收益。
 
 ## Consequences
 
-流式代码随到达即可读:语言一经识别 token 即着色,已完成行绝不重新 tokenize 或重渲染,定稿切换对围栏而言不可见。该包持有一小份 shiki HTML 臂约定的镜像——`pre` 属性与空白折叠——由双臂一致性测试锁定,shiki 升级若改变任一处会在该测试处响亮失败,而不是让两臂悄然漂移。流式 DOM 一致性 fixture 锁定 Shiki span 树,这是相对其 react-markdown 来源的一项有意分叉。仍在增长的最后一行每分片重新 tokenize(以一行为界);病态的单行超长围栏仍退化为每分片完整重新 tokenize——与增量块解析器对单个巨型块接受的是同一退化类。
+流式代码随到达即可读:语言一经识别 token 即着色;顶层 fence 的已完成内容不再重新解析或 tokenize;封存的 React 分组保留其 element 与 DOM;定稿也会保留高亮树。该包持有一小份 shiki HTML 臂约定的镜像——`pre` 属性与空白折叠——由双臂一致性测试锁定,shiki 升级若改变任一处会在该测试处响亮失败,而不是让两臂悄然漂移。流式 DOM 一致性 fixture 锁定 Shiki span 树,这是相对其 react-markdown 来源的一项有意分叉。保留的 DOM 仍随最终 token 数增长,因此浏览器 style 与 layout 工作量并非与长度无关。嵌套/容器内 fence 使用普通尾部解析器,仍在增长的最后一行则会每分片重新 tokenize;病态的单行超长 fence 因而仍是最坏情况。
diff --git a/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.i18n.yaml b/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.i18n.yaml
index 0ba01f1eeb..2fd847ed20 100644
--- a/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.i18n.yaml
+++ b/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.i18n.yaml
@@ -2,5 +2,5 @@
 # side as of the last confirmed-consistent state. Both languages carry equal authority;
 # after editing either side, bring the other along and re-record with:
 #   pnpm run verify-translation-pairing --write .agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.md
-2026-08-25-loaded-turn-chat-navigation.md: 5d9d93b07f7a8c527bf7376bf111c6a709afa4d1
-2026-08-25-loaded-turn-chat-navigation.zh.md: 21dba024710b306848fee9bc4fe1f16913c475b3
+2026-08-25-loaded-turn-chat-navigation.md: b01e64d23fbc87f61c0de5b32cdf293c8d0afa94
+2026-08-25-loaded-turn-chat-navigation.zh.md: 85397c4a33cbc4ff1a08d253845f0112fe9b051b
diff --git a/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.md b/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.md
index 5d9d93b07f..b01e64d23f 100644
--- a/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.md
+++ b/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.md
@@ -18,7 +18,7 @@ The rail renders the complete loaded Turn set with a 10px natural interval and n
 
 The rail sits against the scrollport's right edge and centers on the band the sticky composer leaves visible. That band is the scrollport's own height minus the seat's, so ConversationRoot publishes `--dsh-conversation-viewport-height` beside the `--dsh-composer-height` it already measures on the same element, and the rail centers on their difference instead of a viewport height that ignores the Session header.
 
-The active mark follows a reading line near the top of the shared Chat scrollport. A scroll frame resolves the owning Turn with one hit test at that line, falling back to a single row scan where layout cannot answer, so cost does not grow with the number of marks. Flow-height changes that move rows across the line without a scroll event resync through the existing column observer. Scroll updates are coalesced with `requestAnimationFrame`; reaching the bottom selects the final loaded Turn. Activating a mark computes the target node's position in the existing scroll coordinate system, moves that same scrollport, and records the resulting Chat scroll-restoration anchor.
+The active mark follows a reading line near the top of the shared Chat scrollport. A pinned frame selects the final loaded Turn from scroll distance before reading any row geometry; streaming and other observed height changes can therefore follow the floor without a hit test or scan. Away from the floor, a scroll frame resolves the owning Turn with one hit test at the reading line, falling back to a single row scan where layout cannot answer, so cost does not grow with the number of marks. Flow-height changes that move rows across the line without a scroll event resync through the existing column observer. Scroll updates are coalesced with `requestAnimationFrame`. Activating a mark computes the target node's position in the existing scroll coordinate system, moves that same scrollport, and records the resulting Chat scroll-restoration anchor.
 
 Every Turn remains an accessible button even when dense marks visually overlap. The rail maps pointer height to the nearest loaded Turn, while keyboard focus and activation operate the individual buttons. Hover and focus show a compact prompt-and-response preview, the active mark is longer and darker, the rail is hidden when the Chat container is at most 900px wide, and reduced-motion preferences disable redistribution and mark-entry animation.
 
@@ -42,4 +42,4 @@ Desktop-width Chat views can jump among all currently loaded Turns and inspect a
 
 ## Testing
 
-Builder tests pin the accumulated projection, the bounded preview, and preview freshness under an in-place chunk update. Component tests pin the published items, accessible previews, scroll-coordinate jumps, DOM identity, and percentage redistribution after prepend. The long-interaction Chromium scenario pins the real paginated boundary, prompt completion after `Load earlier`, stable-mark movement, keyboard activation, active-state update, and the narrow-container hide. The multi-Turn recorded Web snapshot includes the navigation landmark and buttons.
+Builder tests pin the accumulated projection, the bounded preview, and preview freshness under an in-place chunk update. Component tests pin the published items, accessible previews, scroll-coordinate jumps, DOM identity, percentage redistribution after prepend, and a pinned `ResizeObserver` update that rejects every row-geometry read. The long-interaction Chromium scenario pins the real paginated boundary, prompt completion after `Load earlier`, stable-mark movement, keyboard activation, active-state update, and the narrow-container hide. The multi-Turn recorded Web snapshot includes the navigation landmark and buttons.
diff --git a/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.zh.md b/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.zh.md
index 21dba02471..85397c4a33 100644
--- a/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.zh.md
+++ b/.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.zh.md
@@ -18,7 +18,7 @@ Chat snapshot 构建层为当前已加载且含可见 transcript node 的每个
 
 轨道紧贴滚动视口右缘,并在粘性输入区之外的可见区间内垂直居中。该区间等于滚动视口自身高度减去输入区高度,因此 ConversationRoot 在同一元素上除已有的 `--dsh-composer-height` 外再发布 `--dsh-conversation-viewport-height`,轨道按两者之差居中,而不是按忽略 Session 头部的视口高度居中。
 
-活跃刻度跟随共享 Chat 滚动区顶部附近的阅读线。每个滚动帧用一次命中测试解析该行所属 Turn,布局无法作答时退化为一次行扫描,成本不随刻度数量增长。图片加载、工具卡展开等不产生滚动事件的高度变化,通过既有的 column observer 重新同步。滚动更新由 `requestAnimationFrame` 合并;到达底部时选择最后一个已加载 Turn。激活刻度会在现有滚动坐标系中计算目标 node 的位置,移动同一个滚动区,并记录由此产生的 Chat 滚动恢复锚点。
+活跃刻度跟随共享 Chat 滚动区顶部附近的阅读线。跟随底部的 frame 会先按滚动距离选中最后一个已加载 Turn,不读取任何行几何;流式输出及其他被 observer 捕获的高度变化因此无需命中测试或扫描即可追随底部。离开底部后,每个滚动 frame 用一次命中测试解析阅读线所属 Turn,布局无法作答时退化为一次行扫描,成本不随刻度数量增长。不产生滚动事件却让行跨过阅读线的高度变化通过既有的 column observer 重新同步。滚动更新由 `requestAnimationFrame` 合并。激活刻度会在现有滚动坐标系中计算目标 node 的位置,移动同一个滚动区,并记录由此产生的 Chat 滚动恢复锚点。
 
 即使密集刻度在视觉上重叠,每个 Turn 仍是可访问的按钮。轨道把指针高度映射到最近的已加载 Turn,键盘聚焦和激活则作用于各个按钮。悬停或聚焦显示紧凑的问题与回复预览,活跃刻度更长、更深;Chat 容器宽度不超过 900px 时隐藏轨道,用户偏好减少动态效果时关闭重排和刻度入场动画。
 
@@ -42,4 +42,4 @@ Chat snapshot 构建层为当前已加载且含可见 transcript node 的每个
 
 ## 测试
 
-构建层测试固定累积投影、预览截断,以及原地 chunk 更新后的预览新鲜度。组件测试固定已发布条目、可访问预览、滚动坐标跳转、DOM 身份以及前插后的百分比重排。长交互 Chromium 场景固定真实分页边界、`加载更早` 后补齐问题、稳定刻度移动、键盘激活、活跃状态更新与窄容器隐藏。多 Turn 的 Web 录制快照包含导航 landmark 和按钮。
+构建层测试固定累积投影、预览截断,以及原地 chunk 更新后的预览新鲜度。组件测试固定已发布条目、可访问预览、滚动坐标跳转、DOM 身份、前插后的百分比重排,以及拒绝任何行几何读取的底部跟随 `ResizeObserver` 更新。长交互 Chromium 场景固定真实分页边界、`加载更早` 后补齐问题、稳定刻度移动、键盘激活、活跃状态更新与窄容器隐藏。多 Turn 的 Web 录制快照包含导航 landmark 和按钮。
diff --git a/packages/client/ui-chat/README.i18n.yaml b/packages/client/ui-chat/README.i18n.yaml
index 1e22b05602..d7a5f88cac 100644
--- a/packages/client/ui-chat/README.i18n.yaml
+++ b/packages/client/ui-chat/README.i18n.yaml
@@ -2,5 +2,5 @@
 # side as of the last confirmed-consistent state. Both languages carry equal authority;
 # after editing either side, bring the other along and re-record with:
 #   pnpm run verify-translation-pairing --write packages/client/ui-chat/README.md
-README.md: 9fe462316e6ab6d664a43b9fc481e07b01eda093
-README.zh.md: bad8a9143cd0307cdc5edb3e66bb9984cd5ca2be
+README.md: 1b24e6bb6825826a97a22a32f43d0210a2f4c6ad
+README.zh.md: 86596bc73ffd1b41867af6559739ab5426adb7b1
diff --git a/packages/client/ui-chat/README.md b/packages/client/ui-chat/README.md
index 9fe462316e..1b24e6bb68 100644
--- a/packages/client/ui-chat/README.md
+++ b/packages/client/ui-chat/README.md
@@ -15,6 +15,7 @@ The browser Chat target for Conversation assembly. It registers Chat event defin
 - [System prompt row](#system-prompt-row)
 - [Turn token usage](#turn-token-usage)
 - [Turn Process Folding](#turn-process-folding)
+- [Scroll ownership](#scroll-ownership)
 - [Model Experience](#model-experience)
 - [Known Limitations and Deferred Work](#known-limitations-and-deferred-work)
 - [Dev Note](#dev-note)
@@ -42,6 +43,13 @@ Settings → General exposes a persisted `Normal` / `Compact` conversation-displ
 
 -----
 
+
+## Scroll ownership
+
+Chat restores semantic anchors across history prepend and renderer remounts. While the reader is pinned to the floor, `ResizeObserver` follows the new floor and selects the latest loaded Turn without reading row geometry. Once the reader moves away, flow-height changes preserve the top position and the reading-line geometry selects the active Turn ([loaded-Turn navigation](../../../.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.md)).
+
+-----
+
 
 ## Model Experience
 
diff --git a/packages/client/ui-chat/README.zh.md b/packages/client/ui-chat/README.zh.md
index bad8a9143c..86596bc73f 100644
--- a/packages/client/ui-chat/README.zh.md
+++ b/packages/client/ui-chat/README.zh.md
@@ -15,6 +15,7 @@ Conversation 组装的浏览器 Chat target。本包注册 Chat event definition
 - [系统提示词行](#system-prompt-row)
 - [轮次 token 用量](#turn-token-usage)
 - [轮次过程折叠](#turn-process-folding)
+- [滚动归属](#scroll-ownership)
 - [模型体验](#model-experience)
 - [已知限制与暂缓事项](#known-limitations-and-deferred-work)
 - [开发备注](#dev-note)
@@ -42,6 +43,13 @@ Chat 会为每个非空的初始或恢复请求、显式消息序列起点或真
 
 -----
 
+
+## 滚动归属
+
+Chat 会在历史前插与 renderer 重新挂载时恢复语义锚点。读者跟随底部时,`ResizeObserver` 追随新的底部,并且无需读取行几何就选中最后一个已加载 Turn;读者离开底部后,高度变化会保持顶部位置,再由阅读线几何选择活跃 Turn([已加载 Turn 导航](../../../.agents/notes/implemented/feature/2026-08-25-loaded-turn-chat-navigation.zh.md))。
+
+-----
+
 
 ## 模型体验
 
diff --git a/packages/client/ui-chat/src/client/chat/ChatView.tsx b/packages/client/ui-chat/src/client/chat/ChatView.tsx
index b2b07d4229..517dccfeb3 100644
--- a/packages/client/ui-chat/src/client/chat/ChatView.tsx
+++ b/packages/client/ui-chat/src/client/chat/ChatView.tsx
@@ -321,6 +321,11 @@ export function ChatView({
       return
     }
     const el = scrollerOf(local)
+    if (el.scrollHeight - el.scrollTop - el.clientHeight <= FOLLOW_THRESHOLD + 1) {
+      const latest = turnNavigationItems.at(-1)?.turn ?? first.turn
+      setActiveTurn(current => current === latest ? current : latest)
+      return
+    }
     const readingLine = el.getBoundingClientRect().top + Math.min(96, el.clientHeight * 0.2)
     const reading = turnAtLine(local, readingLine)
     // No row reaches the line yet: the flow head still owns the mark. Otherwise
@@ -333,9 +338,6 @@ export function ChatView({
         next = item.turn
       }
     }
-    if (el.scrollHeight - el.scrollTop - el.clientHeight <= FOLLOW_THRESHOLD + 1) {
-      next = turnNavigationItems.at(-1)?.turn ?? next
-    }
     setActiveTurn(current => current === next ? current : next)
   }, [turnNavigationItems])
 
diff --git a/packages/client/ui-chat/tests/chat-view.client.spec.tsx b/packages/client/ui-chat/tests/chat-view.client.spec.tsx
index d95a3a4099..eccacecc0d 100644
--- a/packages/client/ui-chat/tests/chat-view.client.spec.tsx
+++ b/packages/client/ui-chat/tests/chat-view.client.spec.tsx
@@ -2179,6 +2179,58 @@ describe('ChatView', () => {
     expect(observe).toHaveBeenCalledTimes(1)
   })
 
+  it('pinned dynamic-height updates select the latest Turn without reading row geometry', () => {
+    let notify: (() => void) | undefined
+    let nextFrame = 0
+    const frames = new Map()
+    vi.stubGlobal('requestAnimationFrame', (callback: FrameRequestCallback) => {
+      nextFrame += 1
+      frames.set(nextFrame, callback)
+      return nextFrame
+    })
+    vi.stubGlobal('cancelAnimationFrame', (id: number) => { frames.delete(id) })
+    class ResizeObserverStub {
+      constructor(callback: ResizeObserverCallback) {
+        notify = () => { callback([], this as unknown as ResizeObserver) }
+      }
+
+      observe = vi.fn()
+      disconnect = vi.fn()
+    }
+    vi.stubGlobal('ResizeObserver', ResizeObserverStub)
+    const rect = vi.spyOn(HTMLElement.prototype, 'getBoundingClientRect')
+      .mockReturnValue({ top: 0, bottom: 40 } as DOMRect)
+    const h = makeHarness({
+      nodes: [
+        userInTurn(1, 'first', 1), assistant(2, 'first answer', 1),
+        userInTurn(4, 'second', 2), assistant(5, 'second answer', 2),
+      ],
+      turnEnds: new Map([[1, 3], [2, 6]]),
+    })
+    const view = render()
+    const scroller = view.container.querySelector('[class*="scroll"]') as HTMLDivElement
+    const metrics = installScrollMetrics(scroller, 1_000, 300)
+    scroller.scrollTop = 700
+    act(() => {
+      const pending = [...frames.values()]
+      frames.clear()
+      for (const callback of pending) callback(0)
+    })
+    rect.mockClear()
+
+    metrics.setHeight(1_200)
+    act(() => { notify?.() })
+    act(() => {
+      const pending = [...frames.values()]
+      frames.clear()
+      for (const callback of pending) callback(0)
+    })
+
+    expect(scroller.scrollTop).toBe(900)
+    expect(view.getByRole('button', { name: '跳转到第 2 轮' }).getAttribute('aria-current')).toBe('true')
+    expect(rect).not.toHaveBeenCalled()
+  })
+
   it('entering the at-bottom threshold does not snap the remaining scroll distance', () => {
     const h = makeHarness({ nodes: [user(1, 'q'), assistant(2, 'a')] })
     const view = render()
diff --git a/packages/client/ui-primitives/README.i18n.yaml b/packages/client/ui-primitives/README.i18n.yaml
index d48604ea73..9fcd055b42 100644
--- a/packages/client/ui-primitives/README.i18n.yaml
+++ b/packages/client/ui-primitives/README.i18n.yaml
@@ -2,5 +2,5 @@
 # side as of the last confirmed-consistent state. Both languages carry equal authority;
 # after editing either side, bring the other along and re-record with:
 #   pnpm run verify-translation-pairing --write packages/client/ui-primitives/README.md
-README.md: 42c1110e8735dd2191c8b7a2e4dcc1f2b9b938bc
-README.zh.md: 9f3c06cacebb7a596204dbe1c8e00a549ce1fcae
+README.md: 525c2c01ec3f3aa3f6146beb3b3b7a6209998a85
+README.zh.md: b2758c5de1f63d6e211dc462c2386bb9e59e4826
diff --git a/packages/client/ui-primitives/README.md b/packages/client/ui-primitives/README.md
index 42c1110e87..525c2c01ec 100644
--- a/packages/client/ui-primitives/README.md
+++ b/packages/client/ui-primitives/README.md
@@ -33,7 +33,7 @@ Compose feature UI from these atoms whenever the web client needs a standard con
 
 ### Rendering agent output
 
-`MarkdownText` renders untrusted GFM and TeX math, blocks unsafe links and images, and can turn resolved file mentions into explicit controls. While a reply streams, it freezes completed blocks and highlights a growing fence from saved Shiki grammar state; the final render uses the same span tree ([incremental renderer](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.md), [streaming fence highlighting](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md)). `TerminalBlock`, `ReadBlock`, `DiffBlock`, `SearchBlock`, and `WebBlock` render the matching tool-result intent with copy controls, overflow handling, and ANSI processing where applicable. `JsonTree` and `JsonBlock` inspect JSON values read-only, while `MessageText` remains the literal-text primitive for user-authored content.
+`MarkdownText` renders untrusted GFM and TeX math, blocks unsafe links and images, and can turn resolved file mentions into explicit controls. While a reply streams, it freezes completed blocks, advances a top-level open fence by completed lines, and highlights that fence from saved Shiki grammar state. Completed token lines enter fixed-size React groups, so later chunks reconcile only the growing group; an unchanged fence retains that DOM when the final full parse resolves cross-document syntax ([incremental renderer](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.md), [streaming fence highlighting](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md)). `TerminalBlock`, `ReadBlock`, `DiffBlock`, `SearchBlock`, and `WebBlock` render the matching tool-result intent with copy controls, overflow handling, and ANSI processing where applicable. `JsonTree` and `JsonBlock` inspect JSON values read-only, while `MessageText` remains the literal-text primitive for user-authored content.
 
 ### Localizing copy
 
@@ -63,7 +63,7 @@ The package is one separation: presentational React atoms with zero Cordis and z
 
 ### Streaming markdown
 
-While a reply streams, `MarkdownText` parses incrementally: all but the trailing two blocks freeze as cached React elements and only the source tail re-parses per chunk, so per-chunk work tracks the tail instead of the whole reply. A growing fenced block tokenizes completed text from saved Shiki grammar state plus the unfinished last line; completed lines retain their DOM, and the settled render uses the same span tree. The settled full parse at finalize also resolves references that crossed the freeze boundary ([incremental renderer](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.md), [streaming fence highlighting](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md)).
+While a reply streams, `MarkdownText` parses incrementally: all but the trailing two blocks freeze as cached React elements and only the source tail re-parses per chunk, so per-chunk work tracks the tail instead of the whole reply. A final unclosed top-level fence keeps its parsed code node and sends only the last completed line plus the current partial line through the same GFM grammar; a closing fence or ambiguous parse returns to the ordinary tail path. Highlighting likewise resumes from saved Shiki grammar state and publishes only newly completed lines plus the mutable tail. `CodeBlock` seals completed lines into fixed-size React groups, reuses earlier groups, and retains the whole highlighted tree across settlement when code and language are unchanged. The settled full parse still resolves references that crossed the freeze boundary ([incremental renderer](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.md), [streaming fence highlighting](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md)).
 
 ### Geometry and overflow
 
@@ -103,6 +103,7 @@ None; this package neither assembles nor sends a provider request.
 These limits define how the atoms behave at the edges; they are current package constraints, not a component roadmap.
 
 - **Streaming defers cross-boundary reference resolution** — a reference-style link or footnote whose definition sits on the other side of the incremental freeze boundary renders as literal text while the reply streams; the settled full parse at finalize resolves it.
+- **A long highlighted fence retains its complete token DOM** — streaming avoids re-parsing, re-tokenizing, and reconciling the completed prefix, but it does not discard old colors or virtualize token spans. Final DOM cardinality therefore still follows the fence's token count; nested/container fences and a pathological single long line remain on the general tail path.
 - **Glyph-level icons are redrawn approximations** — the fish logo and the sparkle mark come from font glyphs whose vector geometry is not exportable from the local design data; hand-authored recreations stand in until an exact export path exists.
 - **`Pill` and `Input` have no design source** — both atoms are self-defined; the sidebar search field and view-tab strip that resemble them are consumer-owned compositions, not these atoms.
 - **No `Active` `StateDot` variant** — the supported states are done, warning, ongoing, and error.
diff --git a/packages/client/ui-primitives/README.zh.md b/packages/client/ui-primitives/README.zh.md
index 9f3c06cace..b2758c5de1 100644
--- a/packages/client/ui-primitives/README.zh.md
+++ b/packages/client/ui-primitives/README.zh.md
@@ -33,7 +33,7 @@ kind: "package-library"
 
 ### 渲染 agent 输出
 
-`MarkdownText` 渲染不可信的 GFM 与 TeX 公式、阻止不安全的链接与图片,并可把已解析的文件提及转换为显式控件。回复流式输出时,它冻结已完成的块,并从保存的 Shiki grammar state 为不断增长的 fence 增量高亮;最终渲染使用相同的 span 树([增量渲染器](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.zh.md)、[流式 fence 高亮](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md))。`TerminalBlock`、`ReadBlock`、`DiffBlock`、`SearchBlock` 与 `WebBlock` 把对应的工具结果意图渲染为带复制控件、溢出处理及适用时 ANSI 处理的卡片。`JsonTree` 与 `JsonBlock` 以只读方式检查 JSON 值;`MessageText` 仍是用户创作内容的字面文本原语。
+`MarkdownText` 渲染不可信的 GFM 与 TeX 公式、阻止不安全的链接与图片,并可把已解析的文件提及转换为显式控件。回复流式输出时,它冻结已完成的块、按已完成行推进顶层未闭合 fence,并从保存的 Shiki grammar state 为该 fence 增量高亮。已完成的 token 行进入固定大小的 React 分组,后续分片只 reconcile 正在增长的分组;最终全量解析解决跨文档语法时,未变化的 fence 会保留该 DOM([增量渲染器](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.zh.md)、[流式 fence 高亮](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md))。`TerminalBlock`、`ReadBlock`、`DiffBlock`、`SearchBlock` 与 `WebBlock` 把对应的工具结果意图渲染为带复制控件、溢出处理及适用时 ANSI 处理的卡片。`JsonTree` 与 `JsonBlock` 以只读方式检查 JSON 值;`MessageText` 仍是用户创作内容的字面文本原语。
 
 ### 本地化文案
 
@@ -63,7 +63,7 @@ kind: "package-library"
 
 ### 流式 markdown
 
-回复流式输出期间,`MarkdownText` 增量解析:除末尾两个块外全部冻结为缓存的 React 元素,每个分片只重新解析其后的源文本尾部,因此每分片的工作量跟随尾部而非整个回复。不断增长的 fenced block 会从已保存的 Shiki grammar state 加上尚未完成的最后一行继续分词;已完成行保留其 DOM,定稿渲染则使用相同的 span 树。定稿时的全量解析还会解析跨过冻结边界的引用([增量渲染器](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.zh.md)、[流式 fence 高亮](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md))。
+回复流式输出期间,`MarkdownText` 增量解析:除末尾两个块外全部冻结为缓存的 React 元素,每个分片只重新解析其后的源文本尾部,因此每分片的工作量跟随尾部而非整个回复。末尾的顶层未闭合 fence 会保留已解析的 code node,只把最后一个已完成行与当前未完成行交给同一套 GFM grammar;闭合 fence 或有歧义的解析会回到普通尾部路径。高亮同样从保存的 Shiki grammar state 续接,并只发布新完成行与可变尾部。`CodeBlock` 把已完成行封入固定大小的 React 分组、复用更早的分组,并在代码与语言未变化时跨定稿保留整棵高亮树。定稿时的全量解析仍会解析跨过冻结边界的引用([增量渲染器](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.zh.md)、[流式 fence 高亮](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md))。
 
 ### 几何与溢出
 
@@ -103,6 +103,7 @@ kind: "package-library"
 这些限制说明原子组件在边缘情况下的行为;它们是当前包约束,不是组件路线图。
 
 - **流式期间跨边界引用解析被推迟**:定义落在增量冻结边界另一侧的引用式链接或脚注,在回复流式输出期间渲染为字面文本;定稿时的全量解析会将其解析。
+- **长高亮 fence 会保留完整 token DOM**:流式路径避免重新解析、重新 tokenize 和 reconcile 已完成前缀,但不会丢弃旧颜色或虚拟化 token span。因此最终 DOM 数量仍随 fence 的 token 数增长;嵌套/容器内 fence 与病态的单个超长行仍走通用尾部路径。
 - **字形级图标是重新绘制的近似版本**:鱼形标志与闪光标记来自字体字形,而本地设计数据无法导出其矢量几何;在获得精确导出路径前,使用手工重建版本代替。
 - **`Pill` 与 `Input` 没有设计来源**:两个原子组件均自行定义;与其相似的侧边栏搜索字段和视图标签条由消费方组合,不是这些原子组件。
 - **`StateDot` 没有 `Active` 变体**:支持的状态为 done、warning、ongoing 和 error。
diff --git a/packages/client/ui-primitives/src/markdown/CodeBlock.tsx b/packages/client/ui-primitives/src/markdown/CodeBlock.tsx
index ba9cd43392..04bc7c2062 100644
--- a/packages/client/ui-primitives/src/markdown/CodeBlock.tsx
+++ b/packages/client/ui-primitives/src/markdown/CodeBlock.tsx
@@ -5,7 +5,7 @@ import { writeClipboard } from '../clipboard.ts'
 import {
   StreamingHighlightSession, grammarLoadCount, highlightToHtml, subscribeGrammarLoaded,
 } from './highlight.ts'
-import type { HighlightSpan } from './highlight.ts'
+import type { HighlightSpan, StreamingHighlightFrame } from './highlight.ts'
 import css from './CodeBlock.module.css'
 
 export interface CodeBlockProps {
@@ -16,9 +16,10 @@ export interface CodeBlockProps {
   /**
    * The code is still growing (a streaming markdown fence): highlight through
    * a per-instance {@link StreamingHighlightSession}, which re-tokenizes only
-   * appended text and keeps completed lines' elements (and DOM) untouched.
-   * The caller must keep the component instance stable across growth (a
-   * stream-stable React key); settled callers omit this and get shiki's HTML.
+   * appended text and keeps completed line groups (and DOM) untouched. The
+   * caller must keep the component instance stable across growth (a
+   * stream-stable React key); an unchanged streamed fence also retains that
+   * tree when it settles. Cold settled callers get shiki's HTML.
    */
   streaming?: boolean | undefined
   /** Extra class merged onto the wrapper (callers position; this component draws). */
@@ -41,49 +42,92 @@ const SHIKI_PRE_PROPS = {
   tabIndex: 0,
 } as const
 
+/** Completed-line group size; React reconciles groups while the DOM remains line-for-line identical. */
+const STREAMING_LINE_GROUP_SIZE = 32
+
+function renderLine(line: readonly HighlightSpan[], index: number): ReactNode {
+  return (
+    
+      {index > 0 && '\n'}
+      
+        {line.map((span, spanIndex) => {span.text})}
+      
+    
+  )
+}
+
 export function CodeBlock({ code, lang, streaming, className, copyLabel, copiedLabel }: CodeBlockProps) {
   const trimmed = code.endsWith('\n') ? code.slice(0, -1) : code
   // Re-render when a lazy grammar finishes loading, so a fence that showed plain
   // text while its language's grammar imported picks up highlighting. The
   // snapshot value is opaque; only its change across renders drives the memo.
   const loaded = useSyncExternalStore(subscribeGrammarLoaded, grammarLoadCount, grammarLoadCount)
-  const html = useMemo(
-    () => (streaming === true ? undefined : highlightToHtml(trimmed, lang)),
-    [streaming, trimmed, lang, loaded],
-  )
   // Streaming state lives in refs mutated inside the memo (the MarkdownText
   // streaming-cache pattern): the session's caches carry across chunks only
   // because the owner keys this instance stably while the fence grows.
   const sessionRef = useRef(null)
-  const lineCacheRef = useRef<{ lines: readonly HighlightSpan[][]; elements: ReactNode[] } | null>(null)
+  const lineCacheRef = useRef<{
+    code: string
+    lang: string | undefined
+    generation: number
+    frame: StreamingHighlightFrame
+    groups: ReactNode[]
+    pending: ReactNode[]
+    nextLine: number
+    body: ReactNode
+  } | null>(null)
+  const settledRef = useRef(false)
   const streamedBody = useMemo(() => {
     if (streaming !== true) {
+      const previous = lineCacheRef.current
+      if (previous !== null && previous.code === trimmed && previous.lang === lang) {
+        settledRef.current = true
+        return previous.body
+      }
       sessionRef.current = null
       lineCacheRef.current = null
+      settledRef.current = true
       return undefined
     }
+    if (settledRef.current) {
+      sessionRef.current = null
+      lineCacheRef.current = null
+      settledRef.current = false
+    }
     sessionRef.current ??= new StreamingHighlightSession()
-    const lines = sessionRef.current.update(trimmed, lang)
-    if (lines === undefined) {
+    const frame = sessionRef.current.updateFrame(trimmed, lang)
+    if (frame === undefined) {
       lineCacheRef.current = null
       return undefined
     }
-    // A retained line keeps its span-array identity across chunks, so its
-    // cached element is reused and React leaves that line's DOM untouched.
     const previous = lineCacheRef.current
-    const elements = lines.map((line, index) => previous !== null && previous.lines[index] === line
-      ? previous.elements[index]
-      : (
-        
-          {index > 0 && '\n'}
-          
-            {line.map((span, spanIndex) => {span.text})}
-          
-        
-      ))
-    lineCacheRef.current = { lines, elements }
-    return 
{elements}
+ if (previous?.frame === frame && previous.code === trimmed && previous.lang === lang) { + return previous.body + } + const sameGeneration = previous?.generation === frame.generation + const groups = sameGeneration ? [...previous.groups] : [] + let pending = sameGeneration ? [...previous.pending] : [] + let nextLine = sameGeneration ? previous.nextLine : 0 + for (const line of frame.appended) { + pending.push(renderLine(line, nextLine)) + nextLine += 1 + if (pending.length !== STREAMING_LINE_GROUP_SIZE) continue + const start = nextLine - pending.length + groups.push({pending}) + pending = [] + } + const tail = frame.tail.map((line, index) => renderLine(line, nextLine + index)) + const tailGroup = {pending}{tail} + const body =
{groups}{tailGroup}
+ lineCacheRef.current = { + code: trimmed, lang, generation: frame.generation, frame, groups, pending, nextLine, body, + } + return body }, [streaming, trimmed, lang, loaded]) + const html = useMemo( + () => (streaming !== true && streamedBody === undefined ? highlightToHtml(trimmed, lang) : undefined), + [streaming, streamedBody, trimmed, lang, loaded], + ) const rootRef = useRef(null) const [copied, setCopied] = useState(false) diff --git a/packages/client/ui-primitives/src/markdown/MarkdownText.tsx b/packages/client/ui-primitives/src/markdown/MarkdownText.tsx index 3a26bac424..0b19896979 100644 --- a/packages/client/ui-primitives/src/markdown/MarkdownText.tsx +++ b/packages/client/ui-primitives/src/markdown/MarkdownText.tsx @@ -43,7 +43,11 @@ function renderSettled( footnoteCounts: new Map(), } const blocks = wrapBlockChildren( - renderBlocks(root.children.map((node, index) => ({ node, key: index })), context), + renderBlocks(root.children.map((node, index) => ({ + node, + /* v8 ignore next -- parseFull uses parseGfm, which stamps every top-level node. */ + key: node.position?.start.offset ?? -(index + 1), + })), context), false, ) const section = renderFootnoteSection(context) diff --git a/packages/client/ui-primitives/src/markdown/highlight.ts b/packages/client/ui-primitives/src/markdown/highlight.ts index 047f9d1139..d97d8d6c7f 100644 --- a/packages/client/ui-primitives/src/markdown/highlight.ts +++ b/packages/client/ui-primitives/src/markdown/highlight.ts @@ -333,10 +333,11 @@ function lineSpans(line: ThemedToken[]): HighlightSpan[] { * tokenization is line-based and forward-only — a line's tokens depend only on * its own text and the grammar state entering it — so appended text never * changes a completed line's tokens. The session caches the spans of every - * completed line together with the grammar state after them; each - * {@link update} tokenizes newly completed text from that state, plus the - * still-growing last line. Per-call cost therefore excludes the completed - * prefix, and the result equals a from-scratch tokenization of the same code. + * completed line together with the grammar state after them; + * {@link updateFrame} reports only newly completed lines plus the still-growing + * last line, while {@link update} materializes the complete compatibility + * result. Per-call tokenization cost therefore excludes the completed prefix, + * and the result equals a from-scratch tokenization of the same code. * Non-append input and a change of resolved grammar reset the cache and * re-tokenize fully, so any input stays correct. */ @@ -352,12 +353,16 @@ export class StreamingHighlightSession { private lastCode: string | undefined private lastLang: string | undefined private lastResult: HighlightSpan[][] | undefined + private generation = 0 + private lastFrame: StreamingHighlightFrame | undefined private reset(resolved: string | undefined): void { this.resolved = resolved this.prefix = '' this.spans = [] this.state = undefined + this.generation += 1 + this.lastFrame = undefined } /** Tokenize `text` with `resolved`, resuming from the cached grammar state when one exists. */ @@ -369,6 +374,43 @@ export class StreamingHighlightSession { }) } + /** + * Tokenize one update as a delta for a retained renderer. + * @param code - the fence text accumulated so far. + * @param lang - the language hint. + * @returns Newly completed lines plus the current tail, or `undefined` for the plain arm. + */ + updateFrame(code: string, lang: string | undefined): StreamingHighlightFrame | undefined { + if (code === this.lastCode && lang === this.lastLang && this.lastFrame !== undefined) { + return this.lastFrame + } + this.lastCode = code + this.lastLang = lang + this.lastResult = undefined + const resolved = lang === undefined ? undefined : LANG_ALIASES.get(lang.toLowerCase()) + if (resolved === undefined || !ensureGrammar(resolved)) { + this.reset(undefined) + return undefined + } + if (resolved !== this.resolved || !code.startsWith(this.prefix)) this.reset(resolved) + const firstNewLine = this.spans.length + const rest = code.slice(this.prefix.length) + const lastNewline = rest.lastIndexOf('\n') + if (lastNewline >= 0) { + const grownEnd = rest[lastNewline - 1] === '\r' ? lastNewline - 1 : lastNewline + const tokens = this.tokenize(resolved, rest.slice(0, grownEnd)) + for (const line of tokens) this.spans.push(lineSpans(line)) + this.state = highlighter().getLastGrammarState(tokens) + this.prefix = code.slice(0, this.prefix.length + lastNewline + 1) + } + this.lastFrame = { + generation: this.generation, + appended: this.spans.slice(firstNewLine), + tail: this.tokenize(resolved, rest.slice(lastNewline + 1)).map(lineSpans), + } + return this.lastFrame + } + /** * Tokenize the fence's current text into per-line highlighted runs; * `undefined` means the caller renders its plain fallback. Idempotent per @@ -385,39 +427,23 @@ export class StreamingHighlightSession { if (code === this.lastCode && lang === this.lastLang && this.lastResult !== undefined) { return this.lastResult } - this.lastCode = code - this.lastLang = lang - const resolved = lang === undefined ? undefined : LANG_ALIASES.get(lang.toLowerCase()) - if (resolved === undefined || !ensureGrammar(resolved)) { - this.reset(undefined) - this.lastResult = undefined - return undefined - } - if (resolved !== this.resolved || !code.startsWith(this.prefix)) this.reset(resolved) - const rest = code.slice(this.prefix.length) - const lastNewline = rest.lastIndexOf('\n') - // Everything before the last newline is newly completed lines: tokenize - // them once from the cached state and retain their spans. What follows is - // the still-growing line, re-tokenized per call but never retained. - if (lastNewline >= 0) { - // Tokenize what shiki's own line splitting would see: splitLines strips - // the \r of a \r\n terminator (interior pairs are shiki's to split), so - // a CRLF cut must not leak its \r into the last completed line — a bash - // continuation's grammar state, for example, differs with it. - const grownEnd = rest[lastNewline - 1] === '\r' ? lastNewline - 1 : lastNewline - const tokens = this.tokenize(resolved, rest.slice(0, grownEnd)) - // Per-line push, not one spread call: a reconnect can deliver the whole - // accumulated fence as one update, and spreading tens of thousands of - // lines into arguments can exceed the engine's argument limit. - for (const line of tokens) this.spans.push(lineSpans(line)) - this.state = highlighter().getLastGrammarState(tokens) - this.prefix = code.slice(0, this.prefix.length + lastNewline + 1) - } - this.lastResult = [...this.spans, ...this.tokenize(resolved, rest.slice(lastNewline + 1)).map(lineSpans)] + const frame = this.updateFrame(code, lang) + if (frame === undefined) return undefined + this.lastResult = [...this.spans, ...frame.tail] return this.lastResult } } +/** One retained-renderer update from {@link StreamingHighlightSession.updateFrame}. */ +export interface StreamingHighlightFrame { + /** Changes whenever prior completed lines must be discarded. */ + readonly generation: number + /** Completed lines added since the preceding frame in this generation. */ + readonly appended: readonly HighlightSpan[][] + /** The still-growing final line or lines, replaced by the next frame. */ + readonly tail: readonly HighlightSpan[][] +} + /** * Tokenize `code` into per-line highlighted runs when `lang` maps to a * registered grammar; `undefined` means the caller renders its plain fallback. diff --git a/packages/client/ui-primitives/src/markdown/incremental.ts b/packages/client/ui-primitives/src/markdown/incremental.ts index 18638a25b6..dc216e5155 100644 --- a/packages/client/ui-primitives/src/markdown/incremental.ts +++ b/packages/client/ui-primitives/src/markdown/incremental.ts @@ -4,19 +4,23 @@ * Re-parsing the whole accumulated document on every streaming chunk is * quadratic in the final reply length. CommonMark block parsing is line-based * and appended text can only reshape the parse frontier — the last top-level - * block (a paragraph becoming a setext heading or a table, a list continuing - * after a blank line, an unclosed fence swallowing lines) — so earlier blocks - * are final. This parser therefore freezes all but the trailing - * {@link UNSTABLE_TAIL_BLOCKS} blocks and re-parses only the source tail - * behind them: each source region is parsed O(1) times over the stream - * instead of once per chunk. + * block (a paragraph becoming a setext heading or a table, or a list + * continuing after a blank line) — so earlier blocks are final. This parser + * therefore freezes all but the trailing {@link UNSTABLE_TAIL_BLOCKS} blocks + * and re-parses only the source tail behind them. A final unclosed top-level + * fence cannot freeze as a block, so its completed content lines use a second + * frontier: only the last completed line and current partial line return + * through the caller's grammar. Each source region is therefore parsed a + * bounded number of times over the stream instead of once per chunk. * - * The freeze boundary comes from the parser's own `position` offsets, never - * from custom source scanning. The cut sits at the *end offset* of the last - * frozen block (not the next block's start): a following block's start offset - * excludes up to three spaces of insignificant leading indentation, which is - * harmless to drop, but cutting at the previous end also keeps the - * inter-block blank lines in the tail so the sliced source stays verbatim. + * The block freeze boundary comes from the parser's own `position` offsets. + * The cut sits at the *end offset* of the last frozen block (not the next + * block's start): a following block's start offset excludes up to three spaces + * of insignificant leading indentation, which is harmless to drop, but + * cutting at the previous end also keeps the inter-block blank lines in the + * tail so the sliced source stays verbatim. Fence scanning only recognizes a + * parser-confirmed code node and closing delimiter; ambiguous input returns to + * the normal tail parse. * * Known deviation, shared with any prefix-freeze scheme: micromark resolves * reference-style links and footnotes document-wide at parse time, so a @@ -24,7 +28,7 @@ * renders literally until the settled full parse self-heals it. */ -import type { Root, RootContent } from 'mdast' +import type { Code, Root, RootContent } from 'mdast' /** * Trailing blocks kept unstable. Appended text reshapes at most the last @@ -68,6 +72,103 @@ function blockKey(node: RootContent, base: number, index: number): number { return offset === undefined ? -(index + 1) : base + offset } +interface OpenFenceState { + readonly marker: '`' | '~' + readonly markerLength: number + readonly syntheticPrefix: string + readonly codeIndex: number + readonly frozen: readonly PositionedBlock[] + readonly tail: readonly PositionedBlock[] + readonly pendingStart: number + readonly valuePrefix: string + readonly end: { readonly line: number; readonly column: number; readonly offset: number } + readonly endedWithCarriageReturn: boolean +} + +/** Return the first line terminator at or after `start`, including a CRLF pair. */ +function lineTerminatorEnd(text: string, start: number): number | undefined { + for (let index = start; index < text.length; index += 1) { + const char = text[index] + if (char === '\n') return index + 1 + if (char === '\r') return text[index + 1] === '\n' ? index + 2 : index + 1 + } + return undefined +} + +/** + * Source prefix before the last completed line. Keeping that line beside the + * current partial line lets the grammar retain its trailing-newline semantics. + */ +function committableLinePrefixLength(text: string): number { + let previousEnd = 0 + let end = 0 + for (let index = 0; index < text.length; index += 1) { + const char = text[index] + if (char === '\n') { + previousEnd = end + end = index + 1 + continue + } + if (char !== '\r' || index + 1 >= text.length) continue + if (text[index + 1] === '\n') index += 1 + previousEnd = end + end = index + 1 + } + return previousEnd +} + +/** Exact source terminator ending a non-empty committable prefix. */ +function trailingLineTerminator(text: string): '\n' | '\r' | '\r\n' { + return text.endsWith('\r\n') ? '\r\n' : text.endsWith('\r') ? '\r' : '\n' +} + +/** Whether `text` contains a CommonMark closing fence on one of its logical lines. */ +function containsClosingFence(text: string, marker: '`' | '~', markerLength: number): boolean { + let start = 0 + while (start <= text.length) { + let end = start + while (end < text.length && text[end] !== '\n' && text[end] !== '\r') end += 1 + const line = text.slice(start, end) + let indent = 0 + while (indent < 3 && line[indent] === ' ') indent += 1 + let run = indent + while (line[run] === marker) run += 1 + if (run - indent >= markerLength && /^[ \t]*$/.test(line.slice(run))) return true + if (end === text.length) return false + start = text[end] === '\r' && text[end + 1] === '\n' ? end + 2 : end + 1 + } + /* v8 ignore next -- each loop iteration returns at EOF or advances past a line terminator. */ + return false +} + +/** Advance an mdast point across one append while treating a split CRLF as one line ending. */ +function advancePoint( + point: OpenFenceState['end'], + appended: string, + precededByCarriageReturn: boolean, +): OpenFenceState['end'] { + let line = point.line + let column = point.column + let afterCarriageReturn = precededByCarriageReturn + for (const char of appended) { + if (char === '\n') { + if (!afterCarriageReturn) line += 1 + column = 1 + afterCarriageReturn = false + continue + } + if (char === '\r') { + line += 1 + column = 1 + afterCarriageReturn = true + continue + } + column += 1 + afterCarriageReturn = false + } + return { line, column, offset: point.offset + appended.length } +} + /** * Append-only incremental parser over a caller-supplied grammar. One instance * accumulates one streaming document; non-append input resets it. @@ -78,10 +179,127 @@ export class IncrementalMarkdownParser { private frozen: PositionedBlock[] = [] private generation = 0 private cached: IncrementalBlocks | null = null + private openFence: OpenFenceState | null = null /** @param parse - Grammar shared with whatever renders the blocks, so boundaries agree. */ constructor(private readonly parse: (text: string) => Root) {} + /** Parse one unclosed-fence content slice through the caller's grammar. */ + private fenceValue(state: Pick, text: string): string | undefined { + const root = this.parse(`${state.syntheticPrefix}${text}`) + if (root.children.length !== 1) return undefined + const node = root.children[0] as RootContent + return node.type === 'code' ? node.value : undefined + } + + /** Recognize the parsed tail's final unclosed fence and prepare its incremental content frontier. */ + private openFenceState( + text: string, + base: number, + tail: readonly PositionedBlock[], + frozen: readonly PositionedBlock[], + ): OpenFenceState | null { + const codeIndex = tail.length - 1 + const block = tail[codeIndex] + if (block?.node.type !== 'code') return null + const node = block.node + const startOffset = node.position?.start.offset + const end = node.position?.end + if (startOffset === undefined || end?.offset === undefined) return null + /* v8 ignore next -- the caller's parse slice ends at text.length, so its final node ends there. */ + if (base + end.offset !== text.length) return null + const source = text.slice(base) + const previousLf = source.lastIndexOf('\n', startOffset - 1) + const previousCr = source.lastIndexOf('\r', startOffset - 1) + const lineStart = Math.max(previousLf, previousCr) + 1 + const terminatorEnd = lineTerminatorEnd(source, startOffset) + /* v8 ignore next -- a parser-confirmed fenced code node requires its opening line terminator. */ + if (terminatorEnd === undefined) return null + if (terminatorEnd === source.length && source.endsWith('\r')) return null + const openingLine = source.slice(lineStart, terminatorEnd).replace(/[\r\n]+$/, '') + const opening = /^( {0,3})(`{3,}|~{3,})/.exec(openingLine) + if (opening === null) return null + const indent = opening[1] as string + const run = opening[2] as string + /* v8 ignore next -- mdast positions a fenced code node at the matched delimiter after indentation. */ + if (lineStart + indent.length !== startOffset) return null + const marker = run[0] as '`' | '~' + const contentStart = base + terminatorEnd + const content = text.slice(contentStart) + if (containsClosingFence(content, marker, run.length)) return null + const syntheticPrefix = `${indent}${run}\n` + const stableLength = committableLinePrefixLength(content) + const stableValue = stableLength === 0 + ? '' + : this.fenceValue({ syntheticPrefix }, content.slice(0, stableLength)) + if (stableValue === undefined) return null + const pendingStart = contentStart + stableLength + const stableSource = content.slice(0, stableLength) + const valuePrefix = stableLength === 0 ? '' : `${stableValue}${trailingLineTerminator(stableSource)}` + const pendingValue = this.fenceValue({ syntheticPrefix }, text.slice(pendingStart)) + if (pendingValue === undefined || `${valuePrefix}${pendingValue}` !== node.value) return null + return { + marker, + markerLength: run.length, + syntheticPrefix, + codeIndex, + frozen, + tail, + pendingStart, + valuePrefix, + end: { line: end.line, column: end.column, offset: end.offset }, + endedWithCarriageReturn: text.endsWith('\r'), + } + } + + /** Extend a recognized unclosed fence without parsing its completed content prefix again. */ + private updateOpenFence( + state: OpenFenceState, + text: string, + previousText: string, + ): IncrementalBlocks | undefined { + const pending = text.slice(state.pendingStart) + if (containsClosingFence(pending, state.marker, state.markerLength)) return undefined + const pendingValue = this.fenceValue(state, pending) + if (pendingValue === undefined) return undefined + const stableLength = committableLinePrefixLength(pending) + const stableValue = stableLength === 0 + ? '' + : this.fenceValue(state, pending.slice(0, stableLength)) + if (stableValue === undefined) return undefined + // OpenFenceState is private and is installed only from this exact retained + // code entry; updates replace that entry with another positioned Code. + const block = state.tail[state.codeIndex] as PositionedBlock + const previousNode = block.node as Code & { position: NonNullable } + const end = advancePoint( + state.end, + text.slice(previousText.length), + state.endedWithCarriageReturn, + ) + const node: Code = { + ...previousNode, + value: `${state.valuePrefix}${pendingValue}`, + position: { start: previousNode.position.start, end }, + } + const tail = state.tail.map((entry, index) => index === state.codeIndex ? { ...entry, node } : entry) + const cached = { + frozen: state.frozen, + tail, + generation: this.generation, + } + this.openFence = { + ...state, + tail, + pendingStart: state.pendingStart + stableLength, + valuePrefix: stableLength === 0 + ? state.valuePrefix + : `${state.valuePrefix}${stableValue}${trailingLineTerminator(pending.slice(0, stableLength))}`, + end, + endedWithCarriageReturn: text.endsWith('\r'), + } + return cached + } + /** * Fold the current accumulated text and return the frozen/tail split. * Idempotent for identical input (the previous result is returned as-is), @@ -101,8 +319,19 @@ export class IncrementalMarkdownParser { this.prevText = '' this.tailStart = 0 this.frozen = [] + this.openFence = null this.generation += 1 } + const previousText = this.prevText + if (previousText !== '' && this.openFence !== null) { + const incremental = this.updateOpenFence(this.openFence, text, previousText) + if (incremental !== undefined) { + this.prevText = text + this.cached = incremental + return incremental + } + this.openFence = null + } this.prevText = text const base = this.tailStart const blocks = this.parse(text.slice(base)).children @@ -125,6 +354,7 @@ export class IncrementalMarkdownParser { key: blockKey(node, base, index), })) this.cached = { frozen: [...this.frozen], tail, generation: this.generation } + this.openFence = this.openFenceState(text, base, tail, this.cached.frozen) return this.cached } } diff --git a/packages/client/ui-primitives/tests/markdown-incremental.client.spec.tsx b/packages/client/ui-primitives/tests/markdown-incremental.client.spec.tsx index f3624b96d4..d0d7a8a205 100644 --- a/packages/client/ui-primitives/tests/markdown-incremental.client.spec.tsx +++ b/packages/client/ui-primitives/tests/markdown-incremental.client.spec.tsx @@ -117,6 +117,16 @@ describe('incremental streaming rendering', () => { live.unmount() settled.unmount() }) + + it('keeps a highlighted fence mounted across the final full-document parse', () => { + const doc = 'before.\n\n```ts\nconst answer = 42\n```\n\nafter.' + const live = render() + const line = live.container.querySelector('pre.shiki .line') + expect(line).not.toBeNull() + live.rerender() + expect(live.container.querySelector('pre.shiki .line')).toBe(line) + live.unmount() + }) }) describe('incremental parsing is actually in effect', () => { @@ -145,6 +155,25 @@ describe('incremental parsing is actually in effect', () => { expect(totalParsed).toBeLessThan(text.length * 5) }) + it('parses an open fence through bounded grammar slices as completed lines accumulate', () => { + const calls: string[] = [] + const recording = (text: string): Root => { + calls.push(text) + return parseGfm(text) + } + const parser = new IncrementalMarkdownParser(recording) + let text = '```ts\n' + let result = parser.update(text) + for (let index = 0; index < 800; index += 1) { + text += `const value${String(index)} = ${String(index)}\n` + result = parser.update(text) + } + const parsed = calls.reduce((sum, call) => sum + call.length, 0) + expect(Math.max(...calls.slice(10).map(call => call.length))).toBeLessThan(80) + expect(parsed).toBeLessThan(text.length * 4) + expect(result.tail.at(-1)?.node).toEqual(parseGfm(text).children[0]) + }) + it('shows the documented streaming fingerprint: a definition frozen earlier no longer resolves a new reference, and settling heals it', () => { const doc = [ '[ref]: https://example.com/target', @@ -197,6 +226,98 @@ describe('freeze dynamics around frontier-sensitive constructs', () => { expect(frozenCode?.type === 'code' && frozenCode.value).toContain('looks like a list') }) + it('keeps indented CRLF fence nodes equal to a fresh parse, then falls back when the fence closes', () => { + const parser = new IncrementalMarkdownParser(parseGfm) + const opening = 'p1.\n\np2.\n\np3.\n\n ```ts\r\n' + const suffix = ' const a = 1\r\n const b = 2\r\n ```\r\nafter' + let text = '' + for (const char of `${opening}${suffix}`) { + text += char + const result = parser.update(text) + const actual = [...result.frozen, ...result.tail].at(-1) + const expected = parseGfm(text).children.at(-1) + expect(actual?.key).toBe(expected?.position?.start.offset) + expect(actual?.node.type).toBe(expected?.type) + if (actual?.node.type === 'code' && expected?.type === 'code') { + expect({ lang: actual.node.lang, meta: actual.node.meta, value: actual.node.value }) + .toEqual({ lang: expected.lang, meta: expected.meta, value: expected.value }) + } + } + }) + + it('preserves lone-CR fence lines and ignores indented code as a fence frontier', () => { + const parser = new IncrementalMarkdownParser(parseGfm) + let text = '```ts\rfirst\r' + parser.update(text) + text += 'second\rthird' + const result = parser.update(text) + expect(result.tail.at(-1)?.node).toEqual(parseGfm(text).children.at(-1)) + + const indented = ' alpha\n beta\n' + const indentedResult = new IncrementalMarkdownParser(parseGfm).update(indented) + expect(indentedResult.tail.at(-1)?.node).toEqual(parseGfm(indented).children.at(-1)) + }) + + it('falls back to the full grammar tail when a custom grammar rejects fence slices', () => { + type Corruption = 'many' | 'paragraph' | 'mismatch' + const custom = (corruption: Corruption): ((text: string) => Root) => (text) => { + if (!text.startsWith('```\n')) return parseGfm(text) + if (corruption === 'many') return parseGfm('one\n\ntwo') + if (corruption === 'paragraph') return parseGfm('one') + const root = parseGfm(text) + const node = root.children[0] + if (node?.type === 'code') node.value += 'mismatch' + return root + } + const cases = [ + { corruption: 'many' as const, text: '```ts\nfirst' }, + { corruption: 'paragraph' as const, text: '```ts\nfirst' }, + { corruption: 'many' as const, text: '```ts\nfirst\nsecond\nthird' }, + { corruption: 'mismatch' as const, text: '```ts\nfirst' }, + ] + for (const { corruption, text } of cases) { + const result = new IncrementalMarkdownParser(custom(corruption)).update(text) + expect(result.tail.at(-1)?.node).toEqual(parseGfm(text).children.at(-1)) + } + + const positionless = new IncrementalMarkdownParser((text) => { + const root = parseGfm(text) + for (const node of root.children) delete node.position + return root + }).update('```ts\nfirst') + expect(positionless.tail.at(-1)?.node.type).toBe('code') + }) + + it('abandons an installed fence frontier when later custom-grammar slices fail', () => { + let syntheticCall = 0 + let reject: 'none' | 'first' | 'second' = 'none' + const custom = (text: string): Root => { + if (!text.startsWith('```\n')) return parseGfm(text) + syntheticCall += 1 + if (reject === 'first' && syntheticCall === 1) return parseGfm('one\n\ntwo') + if (reject === 'second' && syntheticCall === 2) return parseGfm('one\n\ntwo') + return parseGfm(text) + } + + const pendingParser = new IncrementalMarkdownParser(custom) + let text = '```ts\nfirst\nsecond' + pendingParser.update(text) + syntheticCall = 0 + reject = 'first' + text += ' tail' + expect(pendingParser.update(text).tail.at(-1)?.node).toEqual(parseGfm(text).children.at(-1)) + + reject = 'none' + syntheticCall = 0 + const stableParser = new IncrementalMarkdownParser(custom) + text = '```ts\nfirst\nsecond' + stableParser.update(text) + syntheticCall = 0 + reject = 'second' + text += '\nthird\nfourth' + expect(stableParser.update(text).tail.at(-1)?.node).toEqual(parseGfm(text).children.at(-1)) + }) + it('a list can keep extending across blank lines until it freezes whole', () => { const parser = new IncrementalMarkdownParser(parseGfm) let text = 'intro.\n\nsecond.\n\nthird.\n\n- item a\n- item b\n' diff --git a/packages/client/ui-primitives/tests/streaming-code-block.client.spec.tsx b/packages/client/ui-primitives/tests/streaming-code-block.client.spec.tsx index 6ed9e43732..3fe0847693 100644 --- a/packages/client/ui-primitives/tests/streaming-code-block.client.spec.tsx +++ b/packages/client/ui-primitives/tests/streaming-code-block.client.spec.tsx @@ -67,6 +67,19 @@ describe('StreamingHighlightSession', () => { expect(second?.[1]).not.toBe(first?.[1]) }) + it('reports only newly completed lines to a retained renderer', () => { + const session = new StreamingHighlightSession() + const first = session.updateFrame('const a = 1\nlet', 'ts') + const second = session.updateFrame('const a = 1\nlet b = 2\n// tail', 'ts') + expect(first?.appended).toHaveLength(1) + expect(first?.tail).toHaveLength(1) + expect(second?.appended).toHaveLength(1) + expect(second?.appended[0]?.map(span => span.text).join('')).toBe('let b = 2') + expect(second?.tail[0]?.map(span => span.text).join('')).toBe('// tail') + expect(second?.generation).toBe(first?.generation) + expect(session.updateFrame('const a = 1\nlet b = 2\n// tail', 'ts')).toBe(second) + }) + it('is idempotent per input: repeated calls return the identical result array', () => { const session = new StreamingHighlightSession() const result = session.update('const a = 1', 'ts') @@ -211,19 +224,46 @@ describe('CodeBlock streaming arm', () => { expect(view.container.querySelector('pre.shiki')?.textContent).toBe('const a = 1\nlet partial = 2\n// tail') }) + it('keeps completed line groups mounted while later groups grow', () => { + const code = (count: number) => Array.from({ length: count }, (_, index) => `const v${String(index)} = ${String(index)}`).join('\n') + const view = render() + const firstLine = view.container.querySelector('pre.shiki .line') + const thirtySecond = view.container.querySelectorAll('pre.shiki .line')[31] + view.rerender() + const lines = view.container.querySelectorAll('pre.shiki .line') + expect(lines).toHaveLength(80) + expect(lines[0]).toBe(firstLine) + expect(lines[31]).toBe(thirtySecond) + }) + + it('reuses an unchanged frame when an unrelated lazy grammar finishes loading', async () => { + const view = render() + const line = view.container.querySelector('pre.shiki .line') + expect(line).not.toBeNull() + const loader = new StreamingHighlightSession() + expect(loader.update('puts 1', 'ruby')).toBeUndefined() + await vi.waitFor(() => { expect(loader.update('puts 1', 'ruby')).toBeDefined() }, { timeout: 5_000 }) + expect(view.container.querySelector('pre.shiki .line')).toBe(line) + }) + it('streaming with an unknown language stays on the identical plain arm', () => { const view = render() expect(view.container.querySelector('pre.shiki')).toBeNull() expect(view.getByText('IDENTIFICATION DIVISION.')).toBeTruthy() }) - it('the settle swap (streaming to settled) preserves the code content', () => { + it('the settle transition preserves the highlighted DOM when the code is unchanged', () => { const code = 'const answer = 42\n' const view = render() + const streamedLine = view.container.querySelector('pre.shiki .line') const streamedText = view.container.querySelector('pre.shiki')?.textContent view.rerender() const settledText = view.container.querySelector('pre.shiki')?.textContent expect(streamedText).toBe('const answer = 42') expect(settledText).toBe(streamedText) + expect(view.container.querySelector('pre.shiki .line')).toBe(streamedLine) + view.rerender() + expect(view.container.querySelector('pre.shiki')?.textContent).toBe(streamedText) + expect(view.container.querySelector('pre.shiki .line')).toBe(streamedLine) }) }) From 2480bdf27ae13b2bf0554d7a357b4a2262c98fa9 Mon Sep 17 00:00:00 2001 From: Ziya Date: Mon, 31 Aug 2026 17:42:16 +0800 Subject: [PATCH 02/26] feat(web): clarify Workspace Write Chinese label (#3345) Co-authored-by: ZiyaZhang <199893125+ZiyaZhang@users.noreply.github.com> --- apps/web/tests/access-confirmation.e2e.ts | 2 +- apps/web/tests/expected/settings-chrome/dialog.expected.md | 4 ++-- apps/web/tests/settings-chrome.e2e.ts | 4 ++-- packages/client/ui-conversation/src/client/locales.ts | 2 +- .../client/ui-conversation/tests/input-bar.client.spec.tsx | 6 +++--- packages/client/ui-permission-presets/README.i18n.yaml | 4 ++-- packages/client/ui-permission-presets/README.md | 2 +- packages/client/ui-permission-presets/README.zh.md | 2 +- packages/client/ui-permission-presets/src/client/locales.ts | 4 ++-- .../tests/browser-plugin.client.spec.ts | 2 +- .../tests/permission-presets-row.client.spec.tsx | 6 +++--- 11 files changed, 19 insertions(+), 19 deletions(-) diff --git a/apps/web/tests/access-confirmation.e2e.ts b/apps/web/tests/access-confirmation.e2e.ts index e5595c94a8..cd64d98110 100644 --- a/apps/web/tests/access-confirmation.e2e.ts +++ b/apps/web/tests/access-confirmation.e2e.ts @@ -50,7 +50,7 @@ describe('web e2e: Full access confirmation', () => { const access = page.locator('button[aria-label^="访问模式"]').first() await access.waitFor({ timeout: 10_000 }) - expect(await access.getAttribute('aria-label')).toBe('访问模式,当前:可写入工作区') + expect(await access.getAttribute('aria-label')).toBe('访问模式,当前:工作区内修改') await access.click() await page.getByRole('menuitem', { name: '完全权限' }).click() diff --git a/apps/web/tests/expected/settings-chrome/dialog.expected.md b/apps/web/tests/expected/settings-chrome/dialog.expected.md index 9ff9301454..45ad145095 100644 --- a/apps/web/tests/expected/settings-chrome/dialog.expected.md +++ b/apps/web/tests/expected/settings-chrome/dialog.expected.md @@ -18,8 +18,8 @@ - img - text: 关闭 - text: 权限 选择新会话的默认权限模式 - - button "可写入工作区": - - text: 可写入工作区 + - button "工作区内修改": + - text: 工作区内修改 - img - text: 语言 - button "中文": diff --git a/apps/web/tests/settings-chrome.e2e.ts b/apps/web/tests/settings-chrome.e2e.ts index 4b8fd7495f..f86f5c0964 100644 --- a/apps/web/tests/settings-chrome.e2e.ts +++ b/apps/web/tests/settings-chrome.e2e.ts @@ -62,7 +62,7 @@ describe('web e2e: settings modal and General preferences', () => { expect(await trigger.getAttribute('aria-expanded')).toBe('true') // General is active by default; Permission, Language and Appearance are functional. expect(await dialog.getByRole('button', { name: '通用设置' }).getAttribute('aria-current')).toBe('true') - await dialog.getByRole('button', { name: '可写入工作区' }).waitFor({ timeout: 10_000 }) + await dialog.getByRole('button', { name: '工作区内修改' }).waitFor({ timeout: 10_000 }) await expect.poll(() => dialog.getByText('语言', { exact: true }).count(), { timeout: 5_000 }).toBe(1) await expect.poll(() => dialog.getByText('外观', { exact: true }).count(), { timeout: 5_000 }).toBe(1) const openDocument = dialog.getByRole('button', { name: '打开配置文件' }) @@ -150,7 +150,7 @@ describe('web e2e: settings modal and General preferences', () => { await page.getByRole('button', { name: '设置', exact: true }).click() const dialog = page.getByRole('dialog', { name: '设置' }) await dialog.waitFor({ timeout: 10_000 }) - const selector = dialog.getByRole('button', { name: '可写入工作区' }) + const selector = dialog.getByRole('button', { name: '工作区内修改' }) await selector.waitFor({ timeout: 10_000 }) await expect.poll(() => selector.isEnabled(), { timeout: 5_000 }).toBe(true) await selector.click() diff --git a/packages/client/ui-conversation/src/client/locales.ts b/packages/client/ui-conversation/src/client/locales.ts index 0e8ba381f4..296f95b33a 100644 --- a/packages/client/ui-conversation/src/client/locales.ts +++ b/packages/client/ui-conversation/src/client/locales.ts @@ -56,7 +56,7 @@ export const zh = { 'settings.enter.queue': '排队发送', 'settings.enter.steer': '插话发送', 'access.preset.readOnly': '仅可查看', - 'access.preset.workspaceWrite': '可写入工作区', + 'access.preset.workspaceWrite': '工作区内修改', 'access.preset.fullAccess': '完全权限', 'access.confirm.title': '确认启用完全权限?', 'access.confirm.description': '启用完全权限后,智能体将减少确认步骤,并且可以直接执行更多操作,包括敏感操作、文件修改或外部命令。仅建议在你信任当前任务时使用。', diff --git a/packages/client/ui-conversation/tests/input-bar.client.spec.tsx b/packages/client/ui-conversation/tests/input-bar.client.spec.tsx index d616c34a43..94aec70bbf 100644 --- a/packages/client/ui-conversation/tests/input-bar.client.spec.tsx +++ b/packages/client/ui-conversation/tests/input-bar.client.spec.tsx @@ -1335,11 +1335,11 @@ describe('command launcher chrome and control seats', () => { .every(icon => icon.closest('[aria-hidden="true"]') !== null)).toBe(true) fireEvent.click(trigger) const items = view.getAllByRole('menuitem') - expect(items.map(o => o.textContent)).toEqual(['仅可查看', '可写入工作区', '完全权限']) + expect(items.map(o => o.textContent)).toEqual(['仅可查看', '工作区内修改', '完全权限']) fireEvent.click(items[1]!) // Optimistic pick + disable until admission resolves (command stub resolves true). const busy = view.getByLabelText(/^访问模式/) as HTMLButtonElement - expect(busy.textContent).toBe('可写入工作区') + expect(busy.textContent).toBe('工作区内修改') expect(busy.disabled).toBe(true) expect(command).toHaveBeenCalledWith('/permission workspace-write') await act(async () => {}) @@ -1413,7 +1413,7 @@ describe('command launcher chrome and control seats', () => { fireEvent.click(view.getByRole('checkbox')) fireEvent.click(view.getByRole('button', { name: '取消' })) expect(command).not.toHaveBeenCalled() - expect((view.getByLabelText(/^访问模式/) as HTMLButtonElement).textContent).toBe('可写入工作区') + expect((view.getByLabelText(/^访问模式/) as HTMLButtonElement).textContent).toBe('工作区内修改') openConfirmation() expect((view.getByRole('checkbox') as HTMLInputElement).checked).toBe(false) diff --git a/packages/client/ui-permission-presets/README.i18n.yaml b/packages/client/ui-permission-presets/README.i18n.yaml index 44382511cf..5ae75b98f1 100644 --- a/packages/client/ui-permission-presets/README.i18n.yaml +++ b/packages/client/ui-permission-presets/README.i18n.yaml @@ -2,5 +2,5 @@ # side as of the last confirmed-consistent state. Both languages carry equal authority; # after editing either side, bring the other along and re-record with: # pnpm run verify-translation-pairing --write packages/client/ui-permission-presets/README.md -README.md: 6a82ebe45edb7e6055bf4c69a2e90bf21255696c -README.zh.md: bd5588b13cc55d856163ff3eadf04f8059b2f7a9 +README.md: a88c241b8d93228b19d40569f67b4311a550a7c7 +README.zh.md: a20d237f2a67f6f0aa085c3e0784a1e0f25c0c1c diff --git a/packages/client/ui-permission-presets/README.md b/packages/client/ui-permission-presets/README.md index 6a82ebe45e..a88c241b8d 100644 --- a/packages/client/ui-permission-presets/README.md +++ b/packages/client/ui-permission-presets/README.md @@ -29,7 +29,7 @@ Mount this plugin alongside the settings and commands packages; the permission r ### The picker -A pick submits the `/permission ` command line. The argued path (`/permission ` typed directly) still switches directly; the decoration replaces only the bare invocation. The built-in labels are `Read Only`, `Workspace Write`, and `Full access` in English and `仅可查看`, `可写入工作区`, and `完全权限` in Chinese; `custom` is display state, never a target. +A pick submits the `/permission ` command line. The argued path (`/permission ` typed directly) still switches directly; the decoration replaces only the bare invocation. The built-in labels are `Read Only`, `Workspace Write`, and `Full access` in English and `仅可查看`, `工作区内修改`, and `完全权限` in Chinese; `custom` is display state, never a target. ### The Settings row diff --git a/packages/client/ui-permission-presets/README.zh.md b/packages/client/ui-permission-presets/README.zh.md index bd5588b13c..a20d237f2a 100644 --- a/packages/client/ui-permission-presets/README.zh.md +++ b/packages/client/ui-permission-presets/README.zh.md @@ -29,7 +29,7 @@ kind: "package-reference" ### 选择器 -选中即提交 `/permission ` 命令行。带参路径(直接键入 `/permission `)仍直接切换;装饰只替换裸调用。内置标签在英文界面中是 `Read Only`、`Workspace Write` 和 `Full access`,在中文界面中是「仅可查看」「可写入工作区」和「完全权限」;`custom` 只是显示状态,绝非目标。 +选中即提交 `/permission ` 命令行。带参路径(直接键入 `/permission `)仍直接切换;装饰只替换裸调用。内置标签在英文界面中是 `Read Only`、`Workspace Write` 和 `Full access`,在中文界面中是「仅可查看」「工作区内修改」和「完全权限」;`custom` 只是显示状态,绝非目标。 ### 设置行 diff --git a/packages/client/ui-permission-presets/src/client/locales.ts b/packages/client/ui-permission-presets/src/client/locales.ts index 8a1ec2049c..43cd7695b6 100644 --- a/packages/client/ui-permission-presets/src/client/locales.ts +++ b/packages/client/ui-permission-presets/src/client/locales.ts @@ -7,7 +7,7 @@ export const zh = { 'loading': '加载中', 'unavailable': '不可用', 'preset.readOnly': '仅可查看', - 'preset.workspaceWrite': '可写入工作区', + 'preset.workspaceWrite': '工作区内修改', 'preset.fullAccess': '完全权限', 'confirm.title': '确认启用完全权限?', 'confirm.description': '启用完全权限后,新会话将减少确认步骤,并且可以直接执行更多操作,包括敏感操作、文件修改或外部命令。仅建议在你信任后续任务时使用。', @@ -38,7 +38,7 @@ export const en = { /** Simplified Chinese dictionary for the current-session popup gate. */ export const accessZh = { 'preset.readOnly': '仅可查看', - 'preset.workspaceWrite': '可写入工作区', + 'preset.workspaceWrite': '工作区内修改', 'preset.fullAccess': '完全权限', 'confirm.title': '确认启用完全权限?', 'confirm.description': '启用完全权限后,智能体将减少确认步骤,并且可以直接执行更多操作,包括敏感操作、文件修改或外部命令。仅建议在你信任当前任务时使用。', diff --git a/packages/client/ui-permission-presets/tests/browser-plugin.client.spec.ts b/packages/client/ui-permission-presets/tests/browser-plugin.client.spec.ts index 4ad456b47f..e6f9cd39f8 100644 --- a/packages/client/ui-permission-presets/tests/browser-plugin.client.spec.ts +++ b/packages/client/ui-permission-presets/tests/browser-plugin.client.spec.ts @@ -128,7 +128,7 @@ describe('ui-permission browser plugin', () => { }) b.locale.setLocale('zh') const localized = await c.ui.options(proj, new AbortController().signal) - expect(localized.map(option => option.label)).toEqual(['仅可查看', '可写入工作区', '完全权限']) + expect(localized.map(option => option.label)).toEqual(['仅可查看', '工作区内修改', '完全权限']) expect(localized.find(option => option.id === 'danger-full-access')?.confirmation).toEqual({ title: '确认启用完全权限?', description: accessZh['confirm.description'], diff --git a/packages/client/ui-permission-presets/tests/permission-presets-row.client.spec.tsx b/packages/client/ui-permission-presets/tests/permission-presets-row.client.spec.tsx index 13693a4e4d..b083a4074a 100644 --- a/packages/client/ui-permission-presets/tests/permission-presets-row.client.spec.tsx +++ b/packages/client/ui-permission-presets/tests/permission-presets-row.client.spec.tsx @@ -94,8 +94,8 @@ describe('PermissionRow', () => { fireEvent.click(screen.getByRole('menuitem', { name: '仅可查看' })) expect(mutate).not.toHaveBeenCalled() fireEvent.click(button) - fireEvent.click(screen.getByRole('menuitem', { name: '可写入工作区' })) - await screen.findByRole('button', { name: '可写入工作区' }) + fireEvent.click(screen.getByRole('menuitem', { name: '工作区内修改' })) + await screen.findByRole('button', { name: '工作区内修改' }) expect(mutate).toHaveBeenCalledOnce() }) @@ -166,7 +166,7 @@ describe('PermissionRow', () => { describe.resolve(ok({ writable: true, hasDocument: false, namespaces: [view('read-only')] })) const button = await screen.findByRole('button', { name: '仅可查看' }) fireEvent.click(button) - fireEvent.click(screen.getByRole('menuitem', { name: '可写入工作区' })) + fireEvent.click(screen.getByRole('menuitem', { name: '工作区内修改' })) expect((await screen.findByRole('alert')).textContent).toBe('changed elsewhere') }) }) From d8e2ac5052b28f065eab4cefcf51482427d17102 Mon Sep 17 00:00:00 2001 From: 07akioni <07akioni2@gmail.com> Date: Mon, 31 Aug 2026 18:11:32 +0800 Subject: [PATCH 03/26] fix(web): retain completed streaming fence lines --- .../tests/streaming-fence-highlight.e2e.ts | 69 +++++++++++++++---- .../ui-primitives/src/markdown/CodeBlock.tsx | 2 +- .../streaming-code-block.client.spec.tsx | 30 ++++++++ 3 files changed, 85 insertions(+), 16 deletions(-) diff --git a/apps/web/tests/streaming-fence-highlight.e2e.ts b/apps/web/tests/streaming-fence-highlight.e2e.ts index 4e74eb8764..6d65cdca0d 100644 --- a/apps/web/tests/streaming-fence-highlight.e2e.ts +++ b/apps/web/tests/streaming-fence-highlight.e2e.ts @@ -24,28 +24,48 @@ const MODE = webSnapshotMode() const PROVIDER = 'streaming-fence-highlight-test' const MODEL = 'streaming-fence' const PROMPT = 'Stream one TypeScript fence for the highlighting snapshot.' -const OPEN_REPLY = '```ts\nconst first: number = 1\nconst second = "two"\nlet tail' +const FIRST_REPLY = '```ts\nconst first: number = 1\n' +const OPEN_REPLY = `${FIRST_REPLY}const second = "two"\nlet tail` const REPLY = `${OPEN_REPLY}\n\`\`\`` -/** Deterministic model response held after the visible fence body arrives. */ +/** Deterministic model response held after each visible fence-growth frame. */ class StreamingFenceAdapter extends LlmAdapter { - private resolvePaused!: () => void - private resolveContinuation!: () => void - private continued = false - readonly paused = new Promise((resolve) => { this.resolvePaused = resolve }) - private readonly continuation = new Promise((resolve) => { this.resolveContinuation = resolve }) + private resolveFirstPaused!: () => void + private resolveFirstContinuation!: () => void + private resolveSecondPaused!: () => void + private resolveSecondContinuation!: () => void + private firstContinued = false + private secondContinued = false + readonly firstPaused = new Promise((resolve) => { this.resolveFirstPaused = resolve }) + readonly secondPaused = new Promise((resolve) => { this.resolveSecondPaused = resolve }) + private readonly firstContinuation = new Promise((resolve) => { this.resolveFirstContinuation = resolve }) + private readonly secondContinuation = new Promise((resolve) => { this.resolveSecondContinuation = resolve }) + + grow(): void { + if (this.firstContinued) return + this.firstContinued = true + this.resolveFirstContinuation() + } + + finish(): void { + if (this.secondContinued) return + this.secondContinued = true + this.resolveSecondContinuation() + } continue(): void { - if (this.continued) return - this.continued = true - this.resolveContinuation() + this.grow() + this.finish() } override async *stream(options: GenerateOptions): AsyncIterable { yield { type: 'block-start', index: 0, blockType: 'text' } - yield { type: 'text-delta', index: 0, text: OPEN_REPLY } - this.resolvePaused() - await this.continuation + yield { type: 'text-delta', index: 0, text: FIRST_REPLY } + this.resolveFirstPaused() + await this.firstContinuation + yield { type: 'text-delta', index: 0, text: OPEN_REPLY.slice(FIRST_REPLY.length) } + this.resolveSecondPaused() + await this.secondContinuation if (options.signal?.aborted === true) throw options.signal.reason yield { type: 'text-delta', index: 0, text: '\n```' } yield { type: 'block-end', index: 0, block: { type: 'text', text: REPLY } } @@ -115,12 +135,26 @@ describe.skipIf(MODE === 'record')('web e2e: streaming code-fence highlighting', const settled = scaffold.whenTurnSettled(30_000) await writeComposerDraft(page, input, PROMPT) await input.press('Enter') - await adapter.paused + await adapter.firstPaused const streaming = page.locator('[data-streaming="true"]') await streaming.waitFor({ timeout: 10_000 }) const block = streaming.locator('.md-code-block').filter({ hasText: 'const first' }) await block.locator('pre.shiki span[style]').first().waitFor({ timeout: 10_000 }) + await block.evaluate((element) => { + element.setAttribute('data-stream-block-retained', 'true') + element.querySelector('pre.shiki')?.setAttribute('data-stream-pre-retained', 'true') + element.querySelector('pre.shiki .line')?.setAttribute('data-stream-line-retained', 'true') + }) + + adapter.grow() + await adapter.secondPaused + await expect.poll(() => block.locator('pre.shiki .line').count()).toBe(3) + expect(await block.evaluate(element => ({ + block: element.getAttribute('data-stream-block-retained'), + pre: element.querySelector('pre.shiki')?.getAttribute('data-stream-pre-retained'), + line: element.querySelector('pre.shiki .line')?.getAttribute('data-stream-line-retained'), + }))).toEqual({ block: 'true', pre: 'true', line: 'true' }) const midTree = await fenceTree(block) expect(midTree.language).toBe('ts') expect(midTree.lines).toHaveLength(3) @@ -133,12 +167,17 @@ describe.skipIf(MODE === 'record')('web e2e: streaming code-fence highlighting', MODE, ) - adapter.continue() + adapter.finish() await settled await expect.poll(() => page.locator('[data-streaming="true"]').count(), { timeout: 10_000 }).toBe(0) const settledBlock = page.locator('.md-code-block').filter({ hasText: 'const first' }) await settledBlock.locator('pre.shiki').waitFor({ timeout: 10_000 }) expect(await fenceTree(settledBlock)).toEqual(midTree) + expect(await settledBlock.evaluate(element => ({ + block: element.getAttribute('data-stream-block-retained'), + pre: element.querySelector('pre.shiki')?.getAttribute('data-stream-pre-retained'), + line: element.querySelector('pre.shiki .line')?.getAttribute('data-stream-line-retained'), + }))).toEqual({ block: 'true', pre: 'true', line: 'true' }) expect(tripwire.pageErrors).toEqual([]) expect(tripwire.warnings).toEqual([]) await assertFixtureInventory(SNAPSHOT_DIR, ['mid-stream.expected.md']) diff --git a/packages/client/ui-primitives/src/markdown/CodeBlock.tsx b/packages/client/ui-primitives/src/markdown/CodeBlock.tsx index 04bc7c2062..2a42092020 100644 --- a/packages/client/ui-primitives/src/markdown/CodeBlock.tsx +++ b/packages/client/ui-primitives/src/markdown/CodeBlock.tsx @@ -117,7 +117,7 @@ export function CodeBlock({ code, lang, streaming, className, copyLabel, copiedL pending = [] } const tail = frame.tail.map((line, index) => renderLine(line, nextLine + index)) - const tailGroup = {pending}{tail} + const tailGroup = {[...pending, ...tail]} const body =
{groups}{tailGroup}
lineCacheRef.current = { code: trimmed, lang, generation: frame.generation, frame, groups, pending, nextLine, body, diff --git a/packages/client/ui-primitives/tests/streaming-code-block.client.spec.tsx b/packages/client/ui-primitives/tests/streaming-code-block.client.spec.tsx index 3fe0847693..25cd22dcb9 100644 --- a/packages/client/ui-primitives/tests/streaming-code-block.client.spec.tsx +++ b/packages/client/ui-primitives/tests/streaming-code-block.client.spec.tsx @@ -80,6 +80,26 @@ describe('StreamingHighlightSession', () => { expect(session.updateFrame('const a = 1\nlet b = 2\n// tail', 'ts')).toBe(second) }) + it('emits one completed line per frame across an 800-line stream', () => { + const session = new StreamingHighlightSession() + let code = '' + let generation: number | undefined + let appended = 0 + for (let index = 0; index < 800; index += 1) { + const line = `const value${String(index)} = ${String(index)}` + code += `${line}\n` + const frame = session.updateFrame(code, 'ts') + expect(frame?.appended).toHaveLength(1) + expect(frame?.appended[0]?.map(span => span.text).join('')).toBe(line) + generation ??= frame?.generation + expect(frame?.generation).toBe(generation) + appended += frame?.appended.length ?? 0 + } + // Frame cardinality is stable across CI hosts; wall-clock thresholds are + // diagnostics owned by the manual Web performance inventory. + expect(appended).toBe(800) + }) + it('is idempotent per input: repeated calls return the identical result array', () => { const session = new StreamingHighlightSession() const result = session.update('const a = 1', 'ts') @@ -224,6 +244,16 @@ describe('CodeBlock streaming arm', () => { expect(view.container.querySelector('pre.shiki')?.textContent).toBe('const a = 1\nlet partial = 2\n// tail') }) + it('keeps a tail line mounted when the next frame completes it', () => { + const view = render() + const firstLine = view.container.querySelector('pre.shiki .line') + expect(firstLine).not.toBeNull() + view.rerender( + , + ) + expect(view.container.querySelector('pre.shiki .line')).toBe(firstLine) + }) + it('keeps completed line groups mounted while later groups grow', () => { const code = (count: number) => Array.from({ length: count }, (_, index) => `const v${String(index)} = ${String(index)}`).join('\n') const view = render() From 7e2eacb1fe6496b1b4cd5a3d68d29e07dba89fc8 Mon Sep 17 00:00:00 2001 From: Yichen Jiang Date: Sun, 30 Aug 2026 12:50:56 +0800 Subject: [PATCH 04/26] feat(session-turn-outline): whole-log turn outline projection New turnOutline projection unit serving every started turn's number, turn/start seq, and bounded first-prompt preview through the session-projection seam, mounted in the web-app bundle for the chat turn rail. Entries stay strictly increasing; previews mirror the rail's loaded-turn preview budget. --- docs/config-catalog.i18n.yaml | 4 +- docs/config-catalog.md | 1 + docs/config-catalog.zh.md | 1 + docs/module-graph.i18n.yaml | 4 +- docs/module-graph.md | 6 + docs/module-graph.zh.md | 6 + packages/bundle/web-app/cordis.patch.yml | 5 + packages/bundle/web-app/package.json | 1 + packages/session/README.i18n.yaml | 4 +- packages/session/README.md | 1 + packages/session/README.zh.md | 1 + .../session-turn-outline/README.i18n.yaml | 6 + .../session/session-turn-outline/README.md | 124 +++++++++++++ .../session/session-turn-outline/README.zh.md | 124 +++++++++++++ .../session/session-turn-outline/package.json | 62 +++++++ .../session-turn-outline/src/client.ts | 10 ++ .../session/session-turn-outline/src/index.ts | 29 +++ .../session-turn-outline/src/invariant.ts | 35 ++++ .../session-turn-outline/src/projection.ts | 91 ++++++++++ .../session/session-turn-outline/src/types.ts | 37 ++++ .../tests/loader-composition.spec.ts | 88 ++++++++++ .../tests/projection.spec.ts | 165 ++++++++++++++++++ .../session-turn-outline/tsconfig.json | 30 ++++ pnpm-lock.yaml | 31 ++++ .../verify-package-readme-model-experience.ts | 1 + tsconfig.base.json | 4 + tsconfig.host.json | 1 + 27 files changed, 866 insertions(+), 6 deletions(-) create mode 100644 packages/session/session-turn-outline/README.i18n.yaml create mode 100644 packages/session/session-turn-outline/README.md create mode 100644 packages/session/session-turn-outline/README.zh.md create mode 100644 packages/session/session-turn-outline/package.json create mode 100644 packages/session/session-turn-outline/src/client.ts create mode 100644 packages/session/session-turn-outline/src/index.ts create mode 100644 packages/session/session-turn-outline/src/invariant.ts create mode 100644 packages/session/session-turn-outline/src/projection.ts create mode 100644 packages/session/session-turn-outline/src/types.ts create mode 100644 packages/session/session-turn-outline/tests/loader-composition.spec.ts create mode 100644 packages/session/session-turn-outline/tests/projection.spec.ts create mode 100644 packages/session/session-turn-outline/tsconfig.json diff --git a/docs/config-catalog.i18n.yaml b/docs/config-catalog.i18n.yaml index 49cb7bb2c7..8a605e9add 100644 --- a/docs/config-catalog.i18n.yaml +++ b/docs/config-catalog.i18n.yaml @@ -2,5 +2,5 @@ # side as of the last confirmed-consistent state. Both languages carry equal authority; # after editing either side, bring the other along and re-record with: # pnpm run verify-translation-pairing --write docs/config-catalog.md -config-catalog.md: ec077edd10962f324db242698b1d652563c3ac2f -config-catalog.zh.md: d349575cb2884bd2e80097c8345db8d0227107c7 +config-catalog.md: 5d19ab42f0423cd92fd6227bf1c169db1269d9d4 +config-catalog.zh.md: 77fdabb9da9b78aba6c9704fd0ec5c095ea14679 diff --git a/docs/config-catalog.md b/docs/config-catalog.md index ec077edd10..5d19ab42f0 100644 --- a/docs/config-catalog.md +++ b/docs/config-catalog.md @@ -3353,6 +3353,7 @@ These load from a `cordis.yml` entry with no `config:` block; they declare no co - `@deepseek-ai/dsh-session-checkpoint-policy` — requires `llm` · `sessionPersistence` · `sessions` · `tools` ([`packages/session/session-checkpoint-policy/src/index.ts`](../packages/session/session-checkpoint-policy/src/index.ts)) - `@deepseek-ai/dsh-session-projection` ([`packages/session/session-projection/src/index.ts`](../packages/session/session-projection/src/index.ts)) - `@deepseek-ai/dsh-session-stats` — requires `sessionProjections` ([`packages/session/session-stats/src/index.ts`](../packages/session/session-stats/src/index.ts)) +- `@deepseek-ai/dsh-session-turn-outline` — requires `sessionProjections` ([`packages/session/session-turn-outline/src/index.ts`](../packages/session/session-turn-outline/src/index.ts)) - `@deepseek-ai/dsh-skill-badge` — requires `skills` ([`packages/skill/skill-badge/src/index.ts`](../packages/skill/skill-badge/src/index.ts)) - `@deepseek-ai/dsh-storage` ([`packages/storage/storage/src/index.ts`](../packages/storage/storage/src/index.ts)) - `@deepseek-ai/dsh-subagent` ([`packages/subagent/subagent/src/index.ts`](../packages/subagent/subagent/src/index.ts)) diff --git a/docs/config-catalog.zh.md b/docs/config-catalog.zh.md index d349575cb2..77fdabb9da 100644 --- a/docs/config-catalog.zh.md +++ b/docs/config-catalog.zh.md @@ -3355,6 +3355,7 @@ export interface Config { - `@deepseek-ai/dsh-session-checkpoint-policy` — 需要 `llm` · `sessionPersistence` · `sessions` · `tools`([`packages/session/session-checkpoint-policy/src/index.ts`](../packages/session/session-checkpoint-policy/src/index.ts)) - `@deepseek-ai/dsh-session-projection`([`packages/session/session-projection/src/index.ts`](../packages/session/session-projection/src/index.ts)) - `@deepseek-ai/dsh-session-stats` — 需要 `sessionProjections`([`packages/session/session-stats/src/index.ts`](../packages/session/session-stats/src/index.ts)) +- `@deepseek-ai/dsh-session-turn-outline` — 需要 `sessionProjections`([`packages/session/session-turn-outline/src/index.ts`](../packages/session/session-turn-outline/src/index.ts)) - `@deepseek-ai/dsh-skill-badge` — 需要 `skills`([`packages/skill/skill-badge/src/index.ts`](../packages/skill/skill-badge/src/index.ts)) - `@deepseek-ai/dsh-storage`([`packages/storage/storage/src/index.ts`](../packages/storage/storage/src/index.ts)) - `@deepseek-ai/dsh-subagent`([`packages/subagent/subagent/src/index.ts`](../packages/subagent/subagent/src/index.ts)) diff --git a/docs/module-graph.i18n.yaml b/docs/module-graph.i18n.yaml index cbec50a70c..6486a6d319 100644 --- a/docs/module-graph.i18n.yaml +++ b/docs/module-graph.i18n.yaml @@ -2,5 +2,5 @@ # side as of the last confirmed-consistent state. Both languages carry equal authority; # after editing either side, bring the other along and re-record with: # pnpm run verify-translation-pairing --write docs/module-graph.md -module-graph.md: 2229efcd7e76b3b224eb307ee7de9ecea0ad85d7 -module-graph.zh.md: 3edca4ea261f68593973149b21e72e4a25d7a504 +module-graph.md: 1fa0aec5cf88f8deaa4e3bfd6687c7dc8c06f669 +module-graph.zh.md: a9da000b8966fa8daaca13c95af097e4b342d633 diff --git a/docs/module-graph.md b/docs/module-graph.md index 2229efcd7e..1fa0aec5cf 100644 --- a/docs/module-graph.md +++ b/docs/module-graph.md @@ -296,6 +296,7 @@ flowchart TD pkg_session_title_all_prompts_llm["session-title-all-prompts-llm"] pkg_session_title_first_prompt_llm["session-title-first-prompt-llm"] pkg_session_title_llm["session-title-llm"] + pkg_session_turn_outline["session-turn-outline"] end subgraph group_settings["packages/settings"] pkg_settings["settings"] @@ -530,6 +531,10 @@ flowchart TD pkg_session_stats --> pkg_llm pkg_session_stats --> pkg_session pkg_session_stats --> pkg_session_projection + pkg_session_turn_outline --> pkg_invariants + pkg_session_turn_outline --> pkg_llm + pkg_session_turn_outline --> pkg_session + pkg_session_turn_outline --> pkg_session_projection pkg_settings_file --> pkg_atomic_write pkg_settings_file --> pkg_home_paths pkg_settings_file --> pkg_invariants @@ -1431,6 +1436,7 @@ flowchart TD | [`session-persistence-jsonl`](../packages/session/session-persistence-jsonl) | `session` | [`invariants`](../packages/runtime-diagnostics/invariants), [`session`](../packages/core/session), [`session-persistence`](../packages/session/session-persistence) | | [`session-projection-cache`](../packages/session/session-projection-cache) | `session` | [`invariants`](../packages/runtime-diagnostics/invariants), [`session`](../packages/core/session), [`session-projection`](../packages/session/session-projection), [`storage-domain`](../packages/storage/storage-domain) | | [`session-stats`](../packages/session/session-stats) | `session` | [`invariants`](../packages/runtime-diagnostics/invariants), [`llm`](../packages/llm/llm), [`session`](../packages/core/session), [`session-projection`](../packages/session/session-projection) | +| [`session-turn-outline`](../packages/session/session-turn-outline) | `session` | [`invariants`](../packages/runtime-diagnostics/invariants), [`llm`](../packages/llm/llm), [`session`](../packages/core/session), [`session-projection`](../packages/session/session-projection) | | [`settings-file`](../packages/settings/settings-file) | `settings` | [`atomic-write`](../packages/util/atomic-write), [`home-paths`](../packages/util/home-paths), [`invariants`](../packages/runtime-diagnostics/invariants), [`settings`](../packages/settings/settings) | | [`shell`](../packages/shell/shell) | `shell` | [`invariants`](../packages/runtime-diagnostics/invariants), [`sandbox`](../packages/sandbox/sandbox), [`settings`](../packages/settings/settings), [`subprocess`](../packages/subprocess/subprocess) | | [`workspace`](../packages/workspace/workspace) | `workspace` | [`invariants`](../packages/runtime-diagnostics/invariants), [`session`](../packages/core/session), [`session-persistence`](../packages/session/session-persistence), [`storage`](../packages/storage/storage), [`storage-domain`](../packages/storage/storage-domain), [`typert-protocol`](../packages/typert/protocol) | diff --git a/docs/module-graph.zh.md b/docs/module-graph.zh.md index 3edca4ea26..a9da000b89 100644 --- a/docs/module-graph.zh.md +++ b/docs/module-graph.zh.md @@ -298,6 +298,7 @@ flowchart TD pkg_session_title_all_prompts_llm["session-title-all-prompts-llm"] pkg_session_title_first_prompt_llm["session-title-first-prompt-llm"] pkg_session_title_llm["session-title-llm"] + pkg_session_turn_outline["session-turn-outline"] end subgraph group_settings["packages/settings"] pkg_settings["settings"] @@ -532,6 +533,10 @@ flowchart TD pkg_session_stats --> pkg_llm pkg_session_stats --> pkg_session pkg_session_stats --> pkg_session_projection + pkg_session_turn_outline --> pkg_invariants + pkg_session_turn_outline --> pkg_llm + pkg_session_turn_outline --> pkg_session + pkg_session_turn_outline --> pkg_session_projection pkg_settings_file --> pkg_atomic_write pkg_settings_file --> pkg_home_paths pkg_settings_file --> pkg_invariants @@ -1433,6 +1438,7 @@ flowchart TD | [`session-persistence-jsonl`](../packages/session/session-persistence-jsonl) | `session` | [`invariants`](../packages/runtime-diagnostics/invariants), [`session`](../packages/core/session), [`session-persistence`](../packages/session/session-persistence) | | [`session-projection-cache`](../packages/session/session-projection-cache) | `session` | [`invariants`](../packages/runtime-diagnostics/invariants), [`session`](../packages/core/session), [`session-projection`](../packages/session/session-projection), [`storage-domain`](../packages/storage/storage-domain) | | [`session-stats`](../packages/session/session-stats) | `session` | [`invariants`](../packages/runtime-diagnostics/invariants), [`llm`](../packages/llm/llm), [`session`](../packages/core/session), [`session-projection`](../packages/session/session-projection) | +| [`session-turn-outline`](../packages/session/session-turn-outline) | `session` | [`invariants`](../packages/runtime-diagnostics/invariants), [`llm`](../packages/llm/llm), [`session`](../packages/core/session), [`session-projection`](../packages/session/session-projection) | | [`settings-file`](../packages/settings/settings-file) | `settings` | [`atomic-write`](../packages/util/atomic-write), [`home-paths`](../packages/util/home-paths), [`invariants`](../packages/runtime-diagnostics/invariants), [`settings`](../packages/settings/settings) | | [`shell`](../packages/shell/shell) | `shell` | [`invariants`](../packages/runtime-diagnostics/invariants), [`sandbox`](../packages/sandbox/sandbox), [`settings`](../packages/settings/settings), [`subprocess`](../packages/subprocess/subprocess) | | [`workspace`](../packages/workspace/workspace) | `workspace` | [`invariants`](../packages/runtime-diagnostics/invariants), [`session`](../packages/core/session), [`session-persistence`](../packages/session/session-persistence), [`storage`](../packages/storage/storage), [`storage-domain`](../packages/storage/storage-domain), [`typert-protocol`](../packages/typert/protocol) | diff --git a/packages/bundle/web-app/cordis.patch.yml b/packages/bundle/web-app/cordis.patch.yml index 15a5df12cc..79c62a6e20 100644 --- a/packages/bundle/web-app/cordis.patch.yml +++ b/packages/bundle/web-app/cordis.patch.yml @@ -72,6 +72,11 @@ - id: session-stats name: '@deepseek-ai/dsh-session-stats' + # Whole-log turn outline for the chat turn rail (the turnOutline + # projection key): every turn stays navigable before its events page in. + - id: session-turn-outline + name: '@deepseek-ai/dsh-session-turn-outline' + # Resolve bind host, SSH launch, and display once at boot, then mount the # matching dual-face directory picker. Mount -native or -browse directly in # an overlay to pin the interaction. diff --git a/packages/bundle/web-app/package.json b/packages/bundle/web-app/package.json index 2643f13062..0ba57ce2b9 100644 --- a/packages/bundle/web-app/package.json +++ b/packages/bundle/web-app/package.json @@ -107,6 +107,7 @@ "@deepseek-ai/dsh-session-reference": "workspace:^", "@deepseek-ai/dsh-session-log-export": "workspace:^", "@deepseek-ai/dsh-session-stats": "workspace:^", + "@deepseek-ai/dsh-session-turn-outline": "workspace:^", "@deepseek-ai/dsh-api-session-controller": "workspace:^", "@deepseek-ai/dsh-api-settings-controller": "workspace:^", "@deepseek-ai/dsh-api-workspace-controller": "workspace:^", diff --git a/packages/session/README.i18n.yaml b/packages/session/README.i18n.yaml index 6a8abb968a..ec8aaf2ef0 100644 --- a/packages/session/README.i18n.yaml +++ b/packages/session/README.i18n.yaml @@ -2,5 +2,5 @@ # side as of the last confirmed-consistent state. Both languages carry equal authority; # after editing either side, bring the other along and re-record with: # pnpm run verify-translation-pairing --write packages/session/README.md -README.md: 63cc118decffaec1073c75d9d8c5967f866016fa -README.zh.md: f24883518d779dd4cd069e828d4d6ba01d8caa07 +README.md: b47bd7e6384919af4add2746417b232f6873aaf0 +README.zh.md: fa5bc08fc04d32de15f9fe357e7b18b23bb084d3 diff --git a/packages/session/README.md b/packages/session/README.md index 63cc118dec..b47bd7e638 100644 --- a/packages/session/README.md +++ b/packages/session/README.md @@ -40,6 +40,7 @@ The group splits into four families: durable storage (persistence seam, backends | [`session-projection/`](session-projection/README.md) | Defines and drives projection units that fold committed events into whole current values | `ctx.sessionProjections` | | [`session-projection-cache/`](session-projection-cache/README.md) | Persists projection checkpoints so cold reads skip full log loads | `ctx.sessionProjectionCache` | | [`session-stats/`](session-stats/README.md) | Serves whole-log conversation counts and wall times through the `sessionStats` unit | registers on `ctx.sessionProjections` | +| [`session-turn-outline/`](session-turn-outline/README.md) | Serves the whole-log turn outline (turn, `turn/start` seq, prompt preview) through the `turnOutline` unit | registers on `ctx.sessionProjections` | ### Titles diff --git a/packages/session/README.zh.md b/packages/session/README.zh.md index f24883518d..fa5bc08fc0 100644 --- a/packages/session/README.zh.md +++ b/packages/session/README.zh.md @@ -40,6 +40,7 @@ session 组让 agent(智能体)的对话在实时 loop 之外持久可复用 | [`session-projection/`](session-projection/README.zh.md) | 定义并驱动把已提交事件折叠为完整当前值的投影单元 | `ctx.sessionProjections` | | [`session-projection-cache/`](session-projection-cache/README.zh.md) | 持久化投影检查点,使冷读跳过全量日志加载 | `ctx.sessionProjectionCache` | | [`session-stats/`](session-stats/README.zh.md) | 通过 `sessionStats` 单元提供全日志会话计数与墙钟时间 | 注册到 `ctx.sessionProjections` | +| [`session-turn-outline/`](session-turn-outline/README.zh.md) | 通过 `turnOutline` 单元提供全日志轮次大纲(轮次号、`turn/start` seq、提示词预览) | 注册到 `ctx.sessionProjections` | ### 标题 diff --git a/packages/session/session-turn-outline/README.i18n.yaml b/packages/session/session-turn-outline/README.i18n.yaml new file mode 100644 index 0000000000..c27b36d44a --- /dev/null +++ b/packages/session/session-turn-outline/README.i18n.yaml @@ -0,0 +1,6 @@ +# Bilingual-pair consistency record (docs/i18n/README.md): the git blob hash of each +# side as of the last confirmed-consistent state. Both languages carry equal authority; +# after editing either side, bring the other along and re-record with: +# pnpm run verify-translation-pairing --write packages/session/session-turn-outline/README.md +README.md: f56445df70fcfd637657c4f7640dd5c415af7063 +README.zh.md: f10a0a61d9df6534d8e2f9566814c6112e2e678e diff --git a/packages/session/session-turn-outline/README.md b/packages/session/session-turn-outline/README.md new file mode 100644 index 0000000000..f56445df70 --- /dev/null +++ b/packages/session/session-turn-outline/README.md @@ -0,0 +1,124 @@ +--- +description: "Whole-log turn outline for clients and maintainers composing or debugging the turnOutline projection unit behind full-session turn navigation." +kind: "package-reference" +--- + +# @deepseek-ai/dsh-session-turn-outline + +English | [中文](README.zh.md) + +## Summary + +`dsh-session-turn-outline` serves the whole-log turn outline — every started turn with its `turn/start` seq and a bounded first-prompt preview — as the `turnOutline` projection unit. A client that pages history in windows reads the outline to offer every turn of the session (loaded or not) and to target its backwards paging at the exact seq that brings a turn's events in. Choose it in compositions that already mount the projection registry, such as the web app bundle whose chat turn rail is the reference consumer; assemblies without the registry are unaffected and their consumers fall back to loaded-window navigation. Setup and entry semantics come first; the fold internals live in a collapsible developer section below. + +## Table of Contents + +- [Use this package](#use-this-package) +- [Understand the implementation](#understand-the-implementation) +- [Further Exploration](#further-exploration) +- [Model Experience](#model-experience) +- [Known Limitations and Deferred Work](#known-limitations-and-deferred-work) +- [Dev Note](#dev-note) + +----- + + +## Use this package + +Mount the plugin beside the session store and the projection registry when clients should navigate every turn of a session without holding its complete event log. The unit registers only when the registry is present. + +### Composition + +```yaml +- name: '@deepseek-ai/dsh-session' +- name: '@deepseek-ai/dsh-session-projection' +- name: '@deepseek-ai/dsh-session-turn-outline' +``` + +### What an entry means + +| Field | Meaning | +|---|---| +| `turn` | Host-assigned turn number from the `turn/start` payload | +| `seq` | The turn's `turn/start` event seq — paging a window back through this seq loads the whole turn | +| `prompt` | Preview of the turn's first human prompt (space-joined text blocks, collapsed whitespace, 160-character cap); `''` until an eligible prompt lands | + +Entries are strictly increasing by `turn`, and the wire value is the complete outline (whole-value rule): consumers replace, never merge. Only `user/message` events with the human `user` source fill previews, so injected context and tool results never leak into navigation; a turn whose prompt is images-only keeps `''` and consumers label it by number. The preview budget matches the chat rail's loaded-turn preview, so a turn shows the same words before and after its events load. + +### Failures and recovery + +The unit is inert without the projection registry: `inject` keeps the fiber pending and nothing registers, so other assemblies lack the `turnOutline` key. Unmounting the plugin removes the key, because registrations are effects on the mounting fiber. Persisted-cache rows are schema-validated on restore — including the strictly-increasing turn order — so a corrupt row is discarded instead of seeding a broken fold. + +----- + + +## Understand the implementation + +
+Implementation internals — click to expand + +This section explains the fold behind the outline; the observable behavior is fully covered in [Use this package](#use-this-package). + +### Design concept + +The unit is a pure fold over committed session events. `turn/start` — not the prompt `user/message` — anchors each entry because its seq is the load-through target for a jump: the agent loop logs `turn/start` before the turn's prompt and steps, so a window paged back through that seq contains the whole turn. The preview then fills from the first human `user/message`, and only while the newest entry is still empty — later human messages in the same turn (steering) keep the first preview. + +### Source map + +| File | Role | +|---|---| +| [`src/index.ts`](src/index.ts) | Plugin entry: `inject`, unit registration on the mounting fiber | +| [`src/projection.ts`](src/projection.ts) | The fold: entry append, preview fill, wire view | +| [`src/types.ts`](src/types.ts) | One home of the `turnOutline` projection-key declaration and entry types | + +### Fold rules + +- Uninteresting events return the same state reference; the registry's `Object.is` gate keeps the change feed quiet — the outline moves at most twice per turn. +- A `turn/start` that does not advance the turn number is skipped, keeping the outline sorted; a retried boundary's prompt then lands on the standing entry. +- State and wire view are the same value, so the persisted-cache state schema is the wire schema. + +
+ +----- + + +## Further Exploration + +Read these pages when the unit's contract is not enough. They move from the registry that drives units to adjacent session packages. + +- [Session projection subsystem](../../../docs/subsystems/session-projection.md) — the registry that drives units and serves snapshot and change-feed values. +- [Session projection registry package](../session-projection/README.md) — the registry contract units register against. +- [Session package map](../README.md) — adjacent persistence, projection, title, and telemetry packages. + +----- + + +## Model Experience + +None, as the turnOutline unit folds already-logged turn boundaries into a client-facing read model and registers nothing model-facing. + +#### KV Cache effect + +None; the package never assembles or sends provider requests. + +## Known Limitations and Deferred Work + + + + +These limits define what the outline describes and when the unit is absent. They are current package constraints. + +- **The wire value grows with the session** — every change pushes the complete outline (whole-value rule), roughly 200 bytes per turn; splitting previews into an on-demand read is deferred until sessions with many thousands of turns need it. +- **Previews carry the prompt only** — assistant-response previews stay window-scoped in the consumer; the outline never re-reads message bodies. +- **A turn without an eligible text prompt keeps `''`** — images-only and command-only turns are navigable but labeled by number. +- **Mounted only where the projection registry is composed** — other assemblies serve no `turnOutline` key, and their consumers fall back to loaded-window navigation. + + +### Dev Note + +
+Working context for maintainers — click to expand + +None. + +
diff --git a/packages/session/session-turn-outline/README.zh.md b/packages/session/session-turn-outline/README.zh.md new file mode 100644 index 0000000000..f10a0a61d9 --- /dev/null +++ b/packages/session/session-turn-outline/README.zh.md @@ -0,0 +1,124 @@ +--- +description: "面向组合或调试 turnOutline 投影单元的客户端与维护者的全量轮次大纲说明,支撑整会话轮次导航。" +kind: "package-reference" +--- + +# @deepseek-ai/dsh-session-turn-outline + +[English](README.md) | 中文 + +## 概述 + +`dsh-session-turn-outline` 以 `turnOutline` 投影单元提供全日志的轮次大纲——每个已开始的轮次连同其 `turn/start` seq 与有界的首条提示词预览。按窗口分页历史的客户端读取大纲即可提供会话的每一轮(无论是否已加载),并把向后分页精确定位到能载入某轮事件的 seq。在已挂载投影注册表的组合中选择它,例如以聊天轮次导航栏为参考消费者的 Web 应用包;没有注册表的装配不受影响,其消费者回退到仅按已加载窗口导航。用法与条目语义在前;折叠内部细节放在下方可折叠的开发者章节中。 + +## 目录 + +- [使用本包](#use-this-package) +- [理解实现](#understand-the-implementation) +- [进一步探索](#further-exploration) +- [模型体验](#model-experience) +- [已知限制与延期工作](#known-limitations-and-deferred-work) +- [开发备注](#dev-note) + +----- + + +## 使用本包 + +当客户端需要在不持有完整事件日志的情况下导航会话的每一轮时,在会话存储与投影注册表旁挂载此插件。只有存在注册表时单元才会注册。 + +### 组合 + +```yaml +- name: '@deepseek-ai/dsh-session' +- name: '@deepseek-ai/dsh-session-projection' +- name: '@deepseek-ai/dsh-session-turn-outline' +``` + +### 各字段含义 + +| 字段 | 含义 | +|---|---| +| `turn` | `turn/start` 载荷里的宿主分配轮次号 | +| `seq` | 该轮 `turn/start` 事件的 seq——窗口向后分页越过此 seq 即载入整轮 | +| `prompt` | 该轮首条人类提示词的预览(文本块以空格连接、空白折叠、160 字符封顶);合格提示词落日志前为 `''` | + +条目按 `turn` 严格递增,wire 值是完整大纲(整值规则):消费者整体替换,从不合并。只有带人类 `user` 来源的 `user/message` 事件才会填充预览,注入的上下文与工具结果绝不进入导航;纯图片提示词的轮次保持 `''`,消费者按轮次号标注。预览预算与聊天导航栏已加载轮次的预览一致,同一轮在事件载入前后显示相同的文字。 + +### 失败与恢复 + +没有投影注册表时单元是惰性的:`inject` 使 fiber 保持挂起,不注册任何内容,因此其他装配缺少 `turnOutline` 键。卸载插件会移除该键,因为注册是挂载 fiber 上的 effect。持久缓存行在恢复时经受 schema 校验——包括轮次严格递增的顺序——损坏的行被丢弃而不会喂坏折叠。 + +----- + + +## 理解实现 + +
+实现细节——点击展开 + +本节解释大纲背后的折叠;可观察行为已在[使用本包](#use-this-package)中完整说明。 + +### 设计理念 + +该单元是对已提交会话事件的纯折叠。锚定每个条目的是 `turn/start` 而非提示词 `user/message`,因为它的 seq 就是跳转的载入目标:agent loop 先记 `turn/start` 再记该轮的提示词与步骤,窗口向后分页越过该 seq 即包含整轮。预览随后由首条人类 `user/message` 填充,且仅当最新条目仍为空时——同一轮内后续的人类消息(steering)保留首个预览。 + +### 源码地图 + +| 文件 | 职责 | +|---|---| +| [`src/index.ts`](src/index.ts) | 插件入口:`inject`、在挂载 fiber 上注册单元 | +| [`src/projection.ts`](src/projection.ts) | 折叠:条目追加、预览填充、wire 视图 | +| [`src/types.ts`](src/types.ts) | `turnOutline` 投影键声明与条目类型的唯一归属 | + +### 折叠规则 + +- 不相关事件返回同一状态引用;注册表的 `Object.is` 门禁保持变更流安静——大纲每轮至多变动两次。 +- 未推进轮次号的 `turn/start` 被跳过,保持大纲有序;重试边界的提示词随后落在既有条目上。 +- 状态与 wire 视图是同一个值,因此持久缓存的状态 schema 就是 wire schema。 + +
+ +----- + + +## 进一步探索 + +当单元约定不够用时阅读以下页面。它们从驱动单元的注册表逐步进入相邻的会话包。 + +- [会话投影子系统](../../../docs/subsystems/session-projection.zh.md)——驱动单元并提供快照与变更流值的注册表。 +- [会话投影注册表包](../session-projection/README.zh.md)——单元注册所依据的注册表约定。 +- [会话包映射](../README.zh.md)——相邻的持久化、投影、标题与遥测包。 + +----- + + +## 模型体验 + +无,因为 turnOutline 单元把已写入日志的轮次边界折叠成面向客户端的读模型,不注册任何面向模型的内容。 + +#### KV Cache 影响 + +无;本包从不组装或发送提供方请求。 + +## 已知限制与延期工作 + + + + +这些限制说明大纲描述什么、单元何时缺失。它们是当前包约束。 + +- **wire 值随会话增长**——每次变更推送完整大纲(整值规则),约每轮 200 字节;把预览拆成按需读取推迟到数千轮量级的会话真正需要时。 +- **预览只含提示词**——助手回复预览仍由消费者按窗口提供;大纲从不回读消息正文。 +- **没有合格文本提示词的轮次保持 `''`**——纯图片、纯命令的轮次可导航但按轮次号标注。 +- **仅在组合了投影注册表时挂载**——其他装配不提供 `turnOutline` 键,其消费者回退到仅按已加载窗口导航。 + + +### 开发备注 + +
+维护者的工作上下文——点击展开 + +无。 + +
diff --git a/packages/session/session-turn-outline/package.json b/packages/session/session-turn-outline/package.json new file mode 100644 index 0000000000..7c12ba5162 --- /dev/null +++ b/packages/session/session-turn-outline/package.json @@ -0,0 +1,62 @@ +{ + "name": "@deepseek-ai/dsh-session-turn-outline", + "description": "Whole-log turn outline projection (turnOutline) for the DeepSeek Harness", + "version": "0.1.2-alpha.1", + "publishConfig": { + "access": "public" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/deepseek-ai/deepseek-harness.git", + "directory": "packages/session/session-turn-outline" + }, + "type": "module", + "main": "lib/index.js", + "types": "lib/types/index.d.ts", + "exports": { + ".": { + "types": "./lib/types/index.d.ts", + "default": "./lib/index.js" + }, + "./invariant": { + "types": "./lib/types/invariant.d.ts", + "default": "./lib/invariant.js" + }, + "./types": { + "types": "./lib/types/types.d.ts", + "default": "./lib/types/types.js" + }, + "./client": { + "types": "./lib/types/client.d.ts", + "default": "./lib/types/client.js" + }, + "./src/*": "./src/*", + "./package.json": "./package.json" + }, + "files": [ + "lib/index.js", + "lib/invariant.js", + "lib/types/**/*.js", + "lib/types/**/*.d.ts" + ], + "license": "MIT", + "peerDependencies": { + "@deepseek-ai/cordis": "workspace:^", + "@deepseek-ai/dsh-invariants": "workspace:^", + "@deepseek-ai/dsh-llm": "workspace:^", + "@deepseek-ai/dsh-session": "workspace:^", + "@deepseek-ai/dsh-session-projection": "workspace:^" + }, + "dependencies": { + "zod": "^4.4.3" + }, + "devDependencies": { + "@deepseek-ai/cordis": "workspace:^", + "@deepseek-ai/cordis-plugin-include": "workspace:^", + "@deepseek-ai/cordis-plugin-loader": "workspace:^", + "@deepseek-ai/dsh-invariants": "workspace:^", + "@deepseek-ai/dsh-llm": "workspace:^", + "@deepseek-ai/dsh-session": "workspace:^", + "@deepseek-ai/dsh-session-projection": "workspace:^" + } +} diff --git a/packages/session/session-turn-outline/src/client.ts b/packages/session/session-turn-outline/src/client.ts new file mode 100644 index 0000000000..9d15affea0 --- /dev/null +++ b/packages/session/session-turn-outline/src/client.ts @@ -0,0 +1,10 @@ +/** + * Client-namespace projection of the turn-outline domain: a pure re-export + * of the package's types outlet. Client code imports ONLY the client + * namespace (repo discipline), so `./client` projects the same single-source + * content `./types` serves to host consumers — zero duplication. + * + * @module @deepseek-ai/dsh-session-turn-outline/client + */ + +export type * from './types.ts' diff --git a/packages/session/session-turn-outline/src/index.ts b/packages/session/session-turn-outline/src/index.ts new file mode 100644 index 0000000000..0105e7c186 --- /dev/null +++ b/packages/session/session-turn-outline/src/index.ts @@ -0,0 +1,29 @@ +/** + * Function plugin registering the `turnOutline` projection unit: the + * whole-log turn outline (turn number, `turn/start` seq, bounded prompt + * preview) served through the session-projection seam — registry snapshot, + * change feed, and every projection carrier — so a client can offer every + * turn of a session and target history paging at exact seqs without holding + * the events. The plugin owns only the fold; delivery is the seam's. + * + * @module @deepseek-ai/dsh-session-turn-outline + */ + +import type { Context } from '@deepseek-ai/cordis' +import { turnOutlineProjectionDefinition } from './projection.ts' + +export type * from './types.ts' + +/** Cordis plugin name. */ +export const name = 'session-turn-outline' +/** The projection registry is the plugin's whole purpose; without it the fiber stays pending. */ +export const inject = ['sessionProjections'] + +/** + * Register the `turnOutline` unit; the registration is an effect on this + * plugin's fiber, so unloading removes the key. + * @param ctx - registrant context carrying the projection registry. + */ +export function apply(ctx: Context): void { + ctx.sessionProjections.register(turnOutlineProjectionDefinition) +} diff --git a/packages/session/session-turn-outline/src/invariant.ts b/packages/session/session-turn-outline/src/invariant.ts new file mode 100644 index 0000000000..82f1c94ccc --- /dev/null +++ b/packages/session/session-turn-outline/src/invariant.ts @@ -0,0 +1,35 @@ +/** + * Package-owned invariant companion for `@deepseek-ai/dsh-session-turn-outline`. + * @module @deepseek-ai/dsh-session-turn-outline/invariant + */ + +/* jscpd:ignore-start */ +import type { Context } from '@deepseek-ai/cordis' +import type { InvariantInstaller } from '@deepseek-ai/dsh-invariants' + +const PACKAGE_NAME = '@deepseek-ai/dsh-session-turn-outline' + +/** Cordis companion plugin name. */ +export const name = 'session-turn-outline-invariant' +/** Service required before the companion can reserve package ownership. */ +export const inject = ['invariants'] + +/** + * No runtime invariant: the package owns a single pure projection fold whose + * wire payload is schema-validated by the projection registry at every + * snapshot and change-feed emission (including the strictly-increasing turn + * order the fold maintains), and the event relations the fold relies on + * (host-assigned monotonic turn numbers on `turn/start`, the turn's prompt + * `user/message` logged after its boundary) are owned and runtime-checked by + * dsh-agent-loop and the session surface, not here. + */ +const install: InvariantInstaller = () => {} + +/** + * Register this package's invariant companion. + * @param ctx - Cordis context carrying the invariant service. + * @returns the installed registration's disposer after setup succeeds. + */ +export const apply = (ctx: Context): Promise<() => void> => + Promise.resolve(ctx.invariants.register(PACKAGE_NAME, install)) +/* jscpd:ignore-end */ diff --git a/packages/session/session-turn-outline/src/projection.ts b/packages/session/session-turn-outline/src/projection.ts new file mode 100644 index 0000000000..53a405134e --- /dev/null +++ b/packages/session/session-turn-outline/src/projection.ts @@ -0,0 +1,91 @@ +/** + * The `turnOutline` projection unit: a pure fold of `turn/start` boundaries + * and first human prompts into the whole-log turn outline the chat rail + * renders for turns outside a client's paged event window. + * + * `turn/start` — not the prompt `user/message` — anchors each entry because + * its seq is the load-through target for a jump: the loop logs `turn/start` + * before the turn's prompt and steps, so a window paged back through that seq + * contains the whole turn. The preview mirrors the rail's loaded-turn preview + * (space-joined text blocks, collapsed whitespace, 160-character cap) so a + * turn shows the same words before and after its events load. + * + * @module @deepseek-ai/dsh-session-turn-outline/projection + */ + +import { z } from 'zod' +import type { ZodType } from 'zod' +import type { SessionEvent } from '@deepseek-ai/dsh-session' +import type { ProjectionDefinition } from '@deepseek-ai/dsh-session-projection' +import type { TurnOutlineProjection } from './types.ts' + +/** Preview budget per entry, matching the rail's loaded-turn preview clamp. */ +const PREVIEW_LIMIT = 160 + +/** Space-join text blocks until the budget is met, then normalize and cap. */ +function promptPreview(content: SessionEvent<'user/message'>['data']['content']): string { + let text = '' + for (const block of content) { + if (block.type !== 'text') continue + text += text === '' ? block.text : ` ${block.text}` + if (text.length >= PREVIEW_LIMIT) break + } + return text.replace(/\s+/g, ' ').trim().slice(0, PREVIEW_LIMIT) +} + +const turnOutlineSchema: ZodType = z.object({ + turns: z.array(z.object({ + turn: z.number().int().nonnegative(), + seq: z.number().int().nonnegative(), + prompt: z.string().max(PREVIEW_LIMIT), + }).strict()), +}).strict().superRefine((state, context) => { + let previous = -1 + for (const entry of state.turns) { + if (entry.turn <= previous) { + context.addIssue({ code: 'custom', message: 'turn outline entries must be strictly increasing by turn' }) + return + } + previous = entry.turn + } +}) + +const EMPTY_OUTLINE: TurnOutlineProjection = { turns: [] } + +/** The `turnOutline` unit registered on `ctx.sessionProjections` (exported for the unit spec). */ +export const turnOutlineProjectionDefinition = { + key: 'turnOutline', + stateVersion: 1, + stateSchema: turnOutlineSchema, + init: () => EMPTY_OUTLINE, + apply: (state, event) => { + // Every uninteresting event returns the same reference (Object.is gates the change feed). + switch (event.type) { + case 'turn/start': { + const last = state.turns.at(-1) + // Order guard: a boundary that does not advance the turn number keeps + // the outline sorted, and a retried turn's prompt lands on the + // standing entry. + if (last !== undefined && event.data.turn <= last.turn) return state + return { turns: [...state.turns, { turn: event.data.turn, seq: event.seq, prompt: '' }] } + } + case 'user/message': { + // Only the newest turn can still be waiting for its opening human + // prompt; later human messages in the same turn (steering) keep the + // first preview. + if (event.data.source.kind !== 'user') return state + const last = state.turns.at(-1) + if (last === undefined || last.prompt !== '') return state + const prompt = promptPreview(event.data.content) + if (prompt === '') return state + return { turns: [...state.turns.slice(0, -1), { ...last, prompt }] } + } + default: + return state + } + }, + wire: { + viewSchema: turnOutlineSchema, + view: state => state, + }, +} satisfies ProjectionDefinition<'turnOutline', TurnOutlineProjection> diff --git a/packages/session/session-turn-outline/src/types.ts b/packages/session/session-turn-outline/src/types.ts new file mode 100644 index 0000000000..7746c58558 --- /dev/null +++ b/packages/session/session-turn-outline/src/types.ts @@ -0,0 +1,37 @@ +/** + * Pure types of the turn-outline domain: the ONE home of the `turnOutline` + * projection-key declaration, free of this package's host-side value imports + * (zod, the projection definition). Host consumers import `./types`; client + * aggregates import `./client`, which re-exports this module. + * + * @module @deepseek-ai/dsh-session-turn-outline/types + */ + +export {} + +/** One started turn's outline facts, independent of what a client has paged in. */ +export interface TurnOutlineEntry { + /** Host-assigned turn number (the `turn/start` payload). */ + readonly turn: number + /** The turn's `turn/start` event seq — paging a window back through this seq loads the whole turn. */ + readonly seq: number + /** Bounded preview of the turn's first human prompt; `''` until an eligible prompt lands. */ + readonly prompt: string +} + +/** Whole-log turn outline: every started turn, strictly increasing by `turn`. */ +export interface TurnOutlineProjection { + /** Started turns in ascending turn order. */ + readonly turns: readonly TurnOutlineEntry[] +} + +declare module '@deepseek-ai/dsh-session-projection/types' { + interface SessionProjectionStateMap { + /** Whole-log turn outline fold state (identical to the wire view). */ + turnOutline: TurnOutlineProjection + } + interface SessionProjectionMap { + /** Every started turn with its `turn/start` seq and bounded prompt preview; see {@link TurnOutlineProjection}. */ + turnOutline: TurnOutlineProjection + } +} diff --git a/packages/session/session-turn-outline/tests/loader-composition.spec.ts b/packages/session/session-turn-outline/tests/loader-composition.spec.ts new file mode 100644 index 0000000000..9568cb83c6 --- /dev/null +++ b/packages/session/session-turn-outline/tests/loader-composition.spec.ts @@ -0,0 +1,88 @@ +/** + * REAL-composition proof: the shipped YAML shape (session + projection + * registry + session-turn-outline) boots through the vendored Loader, the + * function plugin's namespace survives (no default export), and a logged turn + * with its prompt serves the outline through the composed registry. + */ + +import { mkdtemp, rm, writeFile } from 'node:fs/promises' +import { tmpdir } from 'node:os' +import { join } from 'node:path' +import { pathToFileURL } from 'node:url' +import { afterEach, describe, expect, it } from 'vitest' +import { Context } from '@deepseek-ai/cordis' +import Loader from '@deepseek-ai/cordis-plugin-loader' +import Include from '@deepseek-ai/cordis-plugin-include' +import { createUserMessage } from '@deepseek-ai/dsh-llm' +import SessionStore, { SessionId } from '@deepseek-ai/dsh-session' +import SessionProjectionRegistry from '@deepseek-ai/dsh-session-projection' +import * as SessionTurnOutlinePlugin from '@deepseek-ai/dsh-session-turn-outline' + +let root: string | undefined +let context: Context | undefined + +afterEach(async () => { + await context?.fiber.dispose() + context = undefined + if (root !== undefined) await rm(root, { recursive: true, force: true }) + root = undefined +}) + +async function loadYaml(lines: readonly string[]): Promise { + root = await mkdtemp(join(tmpdir(), 'dsh-session-turn-outline-loader-')) + const configPath = join(root, 'cordis.yml') + await writeFile(configPath, [...lines, ''].join('\n')) + + context = new Context() + context.baseUrl = pathToFileURL(root).href + '/' + await context.plugin(Loader) + context.loader.builtins.include = Include + const modules = new Map([ + ['@deepseek-ai/dsh-session', SessionStore], + ['@deepseek-ai/dsh-session-projection', SessionProjectionRegistry], + ['@deepseek-ai/dsh-session-turn-outline', SessionTurnOutlinePlugin], + ]) + context.loader.internal = { + version: 'v2', + async import(specifier: string) { + if (!modules.has(specifier)) throw new Error(`unexpected Loader import: ${specifier}`) + return modules.get(specifier) + }, + } as unknown as NonNullable + await context.loader.create({ + name: 'cordis:include', + config: { path: pathToFileURL(configPath).href }, + }) + await context.loader.await() + return context +} + +describe('real Loader composition', () => { + it('loads the shipped session-turn-outline YAML shape and serves the outline', async () => { + const loaded = await loadYaml([ + "- name: '@deepseek-ai/dsh-session'", + "- name: '@deepseek-ai/dsh-session-projection'", + "- name: '@deepseek-ai/dsh-session-turn-outline'", + ]) + + const unloaded = [...loaded.loader.entries()] + .filter(entry => entry.fiber === undefined && !entry.disabled) + .map(entry => entry.options.name) + expect(unloaded).toEqual([]) + + const session = loaded.sessions.create(SessionId('composed')) + const boundary = session.append('turn/start', { turn: 1 }).seq + session.append('user/message', createUserMessage({ + content: [{ type: 'text', text: 'composed prompt' }], + source: { kind: 'user' }, + }), { surfaceOp: 'append' }) + expect(loaded.sessionProjections.snapshot(session).values.turnOutline) + .toEqual({ turns: [{ turn: 1, seq: boundary, prompt: 'composed prompt' }] }) + }) + + it('keeps the function-plugin namespace free of a default export', () => { + // A default export beside the named form makes the Loader discard the + // namespace (postmortem 0001) — pin its absence. + expect('default' in SessionTurnOutlinePlugin).toBe(false) + }) +}) diff --git a/packages/session/session-turn-outline/tests/projection.spec.ts b/packages/session/session-turn-outline/tests/projection.spec.ts new file mode 100644 index 0000000000..80703ce778 --- /dev/null +++ b/packages/session/session-turn-outline/tests/projection.spec.ts @@ -0,0 +1,165 @@ +/** + * The `turnOutline` projection unit: mounting the plugin beside the + * projection registry serves the whole-log turn outline (turn number, + * `turn/start` seq, bounded first-prompt preview); compositions without the + * registry are unaffected; unmounting the plugin removes the key (HMR + * safety). Narrow fold paths with fabricated envelopes (non-human sources, + * regressive turn numbers) run against the exported definition directly. + */ + +import { describe, expect, it } from 'vitest' +import { Context } from '@deepseek-ai/cordis' +import { createUserMessage } from '@deepseek-ai/dsh-llm' +import SessionStore, { SessionId } from '@deepseek-ai/dsh-session' +import type { Session, SessionEvent } from '@deepseek-ai/dsh-session' +import SessionProjectionRegistry from '@deepseek-ai/dsh-session-projection' +import * as SessionTurnOutlinePlugin from '@deepseek-ai/dsh-session-turn-outline' +import { turnOutlineProjectionDefinition } from '@deepseek-ai/dsh-session-turn-outline/src/projection.ts' +import type { TurnOutlineProjection } from '@deepseek-ai/dsh-session-turn-outline/types' + +async function harness(withOutlinePlugin: boolean): Promise<{ ctx: Context; session: Session }> { + const ctx = new Context() + await ctx.plugin(SessionStore) + await ctx.plugin(SessionProjectionRegistry) + if (withOutlinePlugin) await ctx.plugin(SessionTurnOutlinePlugin) + return { ctx, session: ctx.sessions.create(SessionId('outlined')) } +} + +/** Append one human prompt; returns its seq. */ +function appendPrompt(session: Session, text: string): number { + return session.append('user/message', createUserMessage({ + content: [{ type: 'text', text }], + source: { kind: 'user' }, + }), { surfaceOp: 'append' }).seq +} + +function outlineOf(ctx: Context, session: Session): TurnOutlineProjection { + return ctx.sessionProjections.snapshot(session).values.turnOutline as TurnOutlineProjection +} + +describe('turn outline projection unit', () => { + it('serves an empty outline before any turn starts', async () => { + const { ctx, session } = await harness(true) + expect(outlineOf(ctx, session)).toEqual({ turns: [] }) + expect(ctx.sessionProjections.checkpoint(session).turnOutline) + .toEqual({ ver: 1, seq: -1, val: { turns: [] } }) + }) + + it('folds each started turn with its boundary seq and first human prompt only', async () => { + const { ctx, session } = await harness(true) + const firstBoundary = session.append('turn/start', { turn: 1 }).seq + appendPrompt(session, 'hello world') + appendPrompt(session, 'a later steer must not replace the prompt') + const secondBoundary = session.append('turn/start', { turn: 2 }).seq + appendPrompt(session, 'second prompt') + expect(outlineOf(ctx, session)).toEqual({ + turns: [ + { turn: 1, seq: firstBoundary, prompt: 'hello world' }, + { turn: 2, seq: secondBoundary, prompt: 'second prompt' }, + ], + }) + }) + + it('keeps an empty preview for a turn whose prompt never lands', async () => { + const { ctx, session } = await harness(true) + const boundary = session.append('turn/start', { turn: 1 }).seq + session.append('step/start', { turn: 1, step: 1 }) + expect(outlineOf(ctx, session)).toEqual({ turns: [{ turn: 1, seq: boundary, prompt: '' }] }) + }) + + it('collapses whitespace, joins text blocks, and caps the preview at 160 characters', async () => { + const { ctx, session } = await harness(true) + session.append('turn/start', { turn: 1 }) + session.append('user/message', createUserMessage({ + content: [ + { type: 'text', text: ` first\n\nline\t${'x'.repeat(200)}` }, + { type: 'text', text: 'never reached past the budget' }, + ], + source: { kind: 'user' }, + }), { surfaceOp: 'append' }) + const preview = outlineOf(ctx, session).turns[0]?.prompt + expect(preview).toBeDefined() + expect(preview).toMatch(/^first line x+$/) + expect(preview).toHaveLength(160) + }) + + it('ignores non-human user/message sources and pre-turn prompts', async () => { + const { ctx, session } = await harness(true) + appendPrompt(session, 'queued before any turn') + session.append('turn/start', { turn: 1 }) + session.append('user/message', createUserMessage({ + content: [{ type: 'text', text: 'injected context' }], + source: { kind: 'plugin', plugin: 'test-injector', form: 'relay' }, + }), { surfaceOp: 'append' }) + expect(outlineOf(ctx, session)).toEqual({ + turns: [{ turn: 1, seq: 1, prompt: '' }], + }) + }) + + it('notifies the change feed only when the outline actually moves', async () => { + const { ctx, session } = await harness(true) + const changes: { key: string; seq: number }[] = [] + ctx.sessionProjections.onChanged((_session, key, _value, seq) => { + if (key === 'turnOutline') changes.push({ key, seq }) + }) + const boundarySeq = session.append('turn/start', { turn: 1 }).seq + session.append('step/start', { turn: 1, step: 1 }) + const promptSeq = appendPrompt(session, 'hello') + appendPrompt(session, 'second human message in the same turn') + session.append('step/end', { turn: 1, step: 1 }) + expect(changes).toEqual([ + { key: 'turnOutline', seq: boundarySeq }, + { key: 'turnOutline', seq: promptSeq }, + ]) + }) + + it('skips a boundary that does not advance the turn number (fabricated envelope)', () => { + const state: TurnOutlineProjection = { turns: [{ turn: 2, seq: 5, prompt: 'kept' }] } + const regressive = { + type: 'turn/start', + seq: 9, + time: 0, + data: { turn: 2 }, + } as unknown as SessionEvent + expect(turnOutlineProjectionDefinition.apply(state, regressive)).toBe(state) + }) + + it('folds turns already in the log when the plugin mounts late (lazy cell build)', async () => { + const { ctx, session } = await harness(false) + session.append('turn/start', { turn: 1 }) + appendPrompt(session, 'pre-mount prompt') + await ctx.plugin(SessionTurnOutlinePlugin) + expect(outlineOf(ctx, session).turns).toEqual([{ turn: 1, seq: 0, prompt: 'pre-mount prompt' }]) + }) + + it('has no key without the plugin and drops it when the plugin unloads (HMR safety)', async () => { + const { ctx, session } = await harness(false) + expect('turnOutline' in ctx.sessionProjections.snapshot(session).values).toBe(false) + const fiber = await ctx.plugin(SessionTurnOutlinePlugin) + session.append('turn/start', { turn: 1 }) + expect('turnOutline' in ctx.sessionProjections.snapshot(session).values).toBe(true) + await fiber.dispose() + expect('turnOutline' in ctx.sessionProjections.snapshot(session).values).toBe(false) + }) + + it('rejects a persisted checkpoint whose turns are not strictly increasing', async () => { + const { ctx, session } = await harness(true) + const checkpoint = ctx.sessionProjections.checkpoint(session) + const row = checkpoint.turnOutline + expect(row).toBeDefined() + expect(() => ctx.sessionProjections.restore({ + ...checkpoint, + turnOutline: { + ...row!, + val: { turns: [{ turn: 2, seq: 1, prompt: '' }, { turn: 2, seq: 4, prompt: '' }] }, + }, + }, [], 0, session.header)).toThrow(/strictly increasing/) + expect(() => ctx.sessionProjections.restore({ + ...checkpoint, + turnOutline: { + ...row!, + val: { turns: [{ turn: 1, seq: 1, prompt: 'ok' }, { turn: 2, seq: 4, prompt: '' }] }, + }, + }, [], 0, session.header)).not.toThrow() + }) +}) diff --git a/packages/session/session-turn-outline/tsconfig.json b/packages/session/session-turn-outline/tsconfig.json new file mode 100644 index 0000000000..c87ec78f8b --- /dev/null +++ b/packages/session/session-turn-outline/tsconfig.json @@ -0,0 +1,30 @@ +{ + "extends": "../../../tsconfig.base.json", + "compilerOptions": { + "rootDir": "src", + "outDir": "lib/types" + }, + "include": [ + "src" + ], + "references": [ + { + "path": "../../../vendor/cosmokit" + }, + { + "path": "../../../vendor/cordis" + }, + { + "path": "../../runtime-diagnostics/invariants" + }, + { + "path": "../../llm/llm" + }, + { + "path": "../../core/session" + }, + { + "path": "../session-projection" + } + ] +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 326595dfff..022f00b2f2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1680,6 +1680,9 @@ importers: '@deepseek-ai/dsh-session-stats': specifier: workspace:^ version: link:../../session/session-stats + '@deepseek-ai/dsh-session-turn-outline': + specifier: workspace:^ + version: link:../../session/session-turn-outline '@deepseek-ai/dsh-subprocess': specifier: workspace:^ version: link:../../subprocess/subprocess @@ -7796,6 +7799,34 @@ importers: specifier: workspace:^ version: link:../../util/timeout + packages/session/session-turn-outline: + dependencies: + zod: + specifier: ^4.4.3 + version: 4.4.3 + devDependencies: + '@deepseek-ai/cordis': + specifier: workspace:^ + version: link:../../../vendor/cordis + '@deepseek-ai/cordis-plugin-include': + specifier: workspace:^ + version: link:../../../vendor/include + '@deepseek-ai/cordis-plugin-loader': + specifier: workspace:^ + version: link:../../../vendor/loader + '@deepseek-ai/dsh-invariants': + specifier: workspace:^ + version: link:../../runtime-diagnostics/invariants + '@deepseek-ai/dsh-llm': + specifier: workspace:^ + version: link:../../llm/llm + '@deepseek-ai/dsh-session': + specifier: workspace:^ + version: link:../../core/session + '@deepseek-ai/dsh-session-projection': + specifier: workspace:^ + version: link:../session-projection + packages/settings/settings: dependencies: '@deepseek-ai/dsh-util-values': diff --git a/scripts/verify-package-readme-model-experience.ts b/scripts/verify-package-readme-model-experience.ts index cb30c6a387..3b02f00d6b 100644 --- a/scripts/verify-package-readme-model-experience.ts +++ b/scripts/verify-package-readme-model-experience.ts @@ -141,6 +141,7 @@ const SENTENCE_MODEL_EXPERIENCE: Readonly> = { 'packages/session/session-projection': { kind: 'none', reason: 'The projection registry serves client-facing read models of already-logged session state and registers nothing model-facing.' }, 'packages/session/session-projection-cache': { kind: 'none', reason: 'The persisted cache accelerates host-side cold reads of projection state and registers nothing model-facing.' }, 'packages/session/session-stats': { kind: 'none', reason: 'The sessionStats unit folds already-logged step boundaries into a client-facing read model and registers nothing model-facing.' }, + 'packages/session/session-turn-outline': { kind: 'none', reason: 'The turnOutline unit folds already-logged turn boundaries into a client-facing read model and registers nothing model-facing.' }, 'packages/session-query/session-query': { kind: 'none', reason: 'The trusted query service exposes cloned records only to callers and registers nothing model-facing.' }, 'packages/session-query/session-query-sqlite': { kind: 'none', reason: 'The search backend returns hits only to callers and registers nothing model-facing.' }, 'packages/settings/settings': { kind: 'indirect', reason: 'The seam stores and resolves user settings; consumer plugins own any model-facing content fed by a value.' }, diff --git a/tsconfig.base.json b/tsconfig.base.json index 3c6bc168d0..5a9bc4a4b0 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -79,6 +79,8 @@ "@deepseek-ai/dsh-util-workspace-path": ["./packages/util/workspace-path/src/index.ts"], "@deepseek-ai/dsh-session-stats/types": ["./packages/session/session-stats/src/types.ts"], "@deepseek-ai/dsh-session-stats/client": ["./packages/session/session-stats/src/client.ts"], + "@deepseek-ai/dsh-session-turn-outline/types": ["./packages/session/session-turn-outline/src/types.ts"], + "@deepseek-ai/dsh-session-turn-outline/client": ["./packages/session/session-turn-outline/src/client.ts"], "@deepseek-ai/dsh-token-meter/client": ["./packages/llm/token-meter/src/client.ts"], "@deepseek-ai/dsh-plan-mode/types": ["./packages/plan/plan-mode/src/types.ts"], "@deepseek-ai/dsh-plan-mode/client": ["./packages/plan/plan-mode/src/client.ts"], @@ -438,6 +440,8 @@ "@deepseek-ai/dsh-session-title-first-prompt-llm/invariant": ["./packages/session/session-title-first-prompt-llm/src/invariant.ts"], "@deepseek-ai/dsh-session-title-llm": ["./packages/session/session-title-llm/src"], "@deepseek-ai/dsh-session-title-llm/invariant": ["./packages/session/session-title-llm/src/invariant.ts"], + "@deepseek-ai/dsh-session-turn-outline": ["./packages/session/session-turn-outline/src"], + "@deepseek-ai/dsh-session-turn-outline/invariant": ["./packages/session/session-turn-outline/src/invariant.ts"], "@deepseek-ai/dsh-settings": ["./packages/settings/settings/src"], "@deepseek-ai/dsh-settings/invariant": ["./packages/settings/settings/src/invariant.ts"], "@deepseek-ai/dsh-settings-file": ["./packages/settings/settings-file/src"], diff --git a/tsconfig.host.json b/tsconfig.host.json index e21c47c805..2d9dc3513c 100644 --- a/tsconfig.host.json +++ b/tsconfig.host.json @@ -180,6 +180,7 @@ { "path": "./packages/session/session-title-llm" }, { "path": "./packages/session/session-title-first-prompt-llm" }, { "path": "./packages/session/session-title-all-prompts-llm" }, + { "path": "./packages/session/session-turn-outline" }, { "path": "./packages/session/session-telemetry" }, { "path": "./packages/identity/anonymous-user-id" }, { "path": "./packages/session/session-telemetry-otel" }, From 218bb7f6452793de50c53e39cdbb5e8db463a4b1 Mon Sep 17 00:00:00 2001 From: Yichen Jiang Date: Sun, 30 Aug 2026 12:54:52 +0800 Subject: [PATCH 05/26] feat(session-controller): loadThrough deep history paging Session.loadThrough(seq) loops the existing prepend pager (200-message pages) until the window covers the target seq, with a shared low-water retarget for repeated calls, a no-progress guard against empty pages still claiming history, and loadOlder's fail-soft error posture. Busy state rides the existing loadingOlder snapshot bit. --- .../src/client/contract/session.ts | 9 ++ .../src/client/sessions/session.ts | 42 +++++++++ .../tests/session.client.spec.ts | 90 ++++++++++++++++++- .../conversation-registry.client.spec.ts | 1 + .../client-runtime/src/sessions.ts | 8 ++ 5 files changed, 149 insertions(+), 1 deletion(-) diff --git a/packages/api/session-controller/src/client/contract/session.ts b/packages/api/session-controller/src/client/contract/session.ts index 02214bb872..71cc72e0ab 100644 --- a/packages/api/session-controller/src/client/contract/session.ts +++ b/packages/api/session-controller/src/client/contract/session.ts @@ -119,6 +119,15 @@ export interface ISession { * @returns completion; failures land in snapshot.openState/loadingOlder. */ loadOlder(): Promise + /** + * Page history backwards until the window covers `seq` (inclusive) — the + * turn-jump loader. Repeated calls while a jump is paging lower its shared + * target and return the in-flight completion; `snapshot.loadingOlder` is + * the busy signal for the whole jump. + * @param seq - durable event seq the window must reach (a turn's `turn/start` seq). + * @returns completion once covered, exhausted, superseded, or failed soft. + */ + loadThrough(seq: number): Promise /** * Execute one slash-command line against this session's agent — pure * admission semantics (the host executor durably logs the lifecycle). diff --git a/packages/api/session-controller/src/client/sessions/session.ts b/packages/api/session-controller/src/client/sessions/session.ts index 25d5e61082..294f33f3aa 100644 --- a/packages/api/session-controller/src/client/sessions/session.ts +++ b/packages/api/session-controller/src/client/sessions/session.ts @@ -38,6 +38,9 @@ import { SessionQueueMirror } from './queue-mirror.ts' /** Messages requested per history page. */ export const PAGE_MESSAGES = 50 +/** Messages requested per page while a turn jump loops backwards (fewer, larger round trips). */ +export const JUMP_PAGE_MESSAGES = 200 + /** Manager-owned observers of a Session object's local state edges. */ export interface SessionOptions { /** Catalog-discovered address selecting non-activating subagent transport. */ @@ -78,6 +81,10 @@ export class Session implements SessionFace { * passes drop all writes once the generation moves on. */ private openGeneration = 0 private loadingOlder = false + /** Shared low-water target of the running jump loop; null when no jump is paging. */ + private jumpTargetSeq: number | null = null + /** The running jump loop's completion, shared by retargeting callers. */ + private jumpPromise: Promise | null = null /** Authoritative stream-only inbox snapshot; pending work never hits history. */ private readonly queueMirror = new SessionQueueMirror() private running = false @@ -369,6 +376,41 @@ export class Session implements SessionFace { } } + /** Jump loader: page backwards until the window covers seq (see ISession.loadThrough). */ + loadThrough(seq: number): Promise { + if (this.openState !== 'open' || !this.hasMore || this.baseSeq <= seq) return Promise.resolve() + this.jumpTargetSeq = Math.min(this.jumpTargetSeq ?? seq, seq) + if (this.jumpPromise !== null) return this.jumpPromise + // A plain single-page pull owns the busy flag; the jump does not queue + // behind it (the caller may retry once it settles). + if (this.loadingOlder) return Promise.resolve() + this.loadingOlder = true + this.notifier.markDirty() + this.jumpPromise = (async () => { + try { + while (this.hasMore && this.jumpTargetSeq !== null && this.baseSeq > this.jumpTargetSeq) { + const events = this.events + if (events === undefined) return + const before = this.baseSeq + await events.prepend({ beforeSeq: this.baseSeq, maxMessages: JUMP_PAGE_MESSAGES }) + // No-progress guard: an empty or dropped page that still claims more + // history must end the loop, not spin it. + if (this.baseSeq >= before) return + } + } catch (error) { + if (!isRemoteFailure(error)) { + console.error('[session-controller] loadThrough failed:', error) + } + } finally { + this.jumpTargetSeq = null + this.jumpPromise = null + this.loadingOlder = false + this.notifier.markDirty() + } + })() + return this.jumpPromise + } + /** Rebuild an opened history source after address replacement. * Invalidates any in-flight open first; queue state belongs to the independently * reconnecting control stream and remains untouched. */ diff --git a/packages/api/session-controller/tests/session.client.spec.ts b/packages/api/session-controller/tests/session.client.spec.ts index 319c315873..2bee7d33b4 100644 --- a/packages/api/session-controller/tests/session.client.spec.ts +++ b/packages/api/session-controller/tests/session.client.spec.ts @@ -5,7 +5,7 @@ import type { SessionEvent } from '@deepseek-ai/dsh-session/types' import type { SessionId } from '@deepseek-ai/dsh-api-remotes/client' import { RemoteStreamCarrierError } from '@deepseek-ai/dsh-api-gateway/client' import { RemoteError } from '@deepseek-ai/dsh-typert-protocol' -import { Session, type SessionOptions } from '../src/client/sessions/session.ts' +import { JUMP_PAGE_MESSAGES, Session, type SessionOptions } from '../src/client/sessions/session.ts' import { FakeApiClient, deferred, err, fakeRemote, ok } from './fake-api.client.ts' import { entries, ev, historyValue, plainTurn } from './event-script.client.ts' @@ -254,6 +254,94 @@ describe('paging', () => { } }) + it('loadThrough pages repeatedly until the window covers the target seq', async () => { + const oldest = plainTurn(0, 0, '最旧问', '最旧答') + const middle = plainTurn(6, 1, '中问', '中答') + const newest = plainTurn(12, 2, '新问', '新答') + const { api, session } = makeSession() + api.onHistory = (payload) => { + if (payload.beforeSeq === undefined) return histResponse(newest, true) + return payload.beforeSeq === 12 ? histResponse(middle, true) : histResponse(oldest, false) + } + await session.open() + + const gate = deferred>>() + api.onHistory = (payload) => { + api.onHistory = payload2 => payload2.beforeSeq === 12 ? histResponse(middle, true) : histResponse(oldest, false) + void payload + return gate.promise + } + const jump = session.loadThrough(0) + expect(session.getSnapshot().loadingOlder).toBe(true) + gate.resolve(ok(historyValue(middle, true))) + await jump + const snapshot = session.getSnapshot() + expect(snapshot.loadingOlder).toBe(false) + expect(eventSeqs(session)).toEqual([...oldest, ...middle, ...newest].map(event => event.seq)) + expect(api.callsOf('session.history')).toMatchObject([ + { beforeSeq: 12, maxMessages: JUMP_PAGE_MESSAGES }, + { beforeSeq: 6, maxMessages: JUMP_PAGE_MESSAGES }, + ]) + }) + + it('loadThrough is a no-op when the window already covers the target or the session is not open', async () => { + const { api, session } = makeSession() + await session.loadThrough(0) // cold: no-op + expect(api.calls).toEqual([]) + api.onHistory = () => histResponse(plainTurn(6, 1, 'x', 'y'), true) + await session.open() + const calls = api.calls.length + await session.loadThrough(6) // baseSeq is already 6 + await session.loadThrough(9) // inside the window + expect(api.calls.length).toBe(calls) + }) + + it('loadThrough retargets a running jump to the lowest requested seq and shares its completion', async () => { + const oldest = plainTurn(0, 0, 'a', 'b') + const middle = plainTurn(6, 1, 'c', 'd') + const { api, session } = makeSession() + api.onHistory = () => histResponse(plainTurn(12, 2, 'e', 'f'), true) + await session.open() + + const gate = deferred>>() + api.onHistory = () => { + api.onHistory = () => histResponse(oldest, false) + return gate.promise + } + const first = session.loadThrough(6) + const second = session.loadThrough(0) + gate.resolve(ok(historyValue(middle, true))) + await Promise.all([first, second]) + expect(eventSeqs(session)).toEqual([...oldest, ...middle].map(event => event.seq).concat([12, 13, 14, 15, 16, 17])) + expect(api.callsOf('session.history')).toHaveLength(2) + }) + + it('loadThrough stops on a page that makes no progress instead of looping', async () => { + const { api, session } = makeSession() + api.onHistory = payload => payload.beforeSeq === undefined + ? histResponse(plainTurn(12, 2, 'x', 'y'), true) + : histResponse([], true) // empty page still claiming more history + await session.open() + await session.loadThrough(0) + expect(session.getSnapshot().loadingOlder).toBe(false) + expect(api.callsOf('session.history')).toHaveLength(1) + }) + + it('loadThrough fails soft on a thrown page and clears its busy state', async () => { + const { api, session } = makeSession() + api.onHistory = () => histResponse(plainTurn(12, 2, 'x', 'y'), true) + await session.open() + api.onHistory = () => Promise.reject(new Error('page wire down')) + const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => undefined) + try { + await session.loadThrough(0) + expect(errorSpy).toHaveBeenCalled() + expect(session.getSnapshot().loadingOlder).toBe(false) + } finally { + errorSpy.mockRestore() + } + }) + it('ignores loadOlder while one is in flight (single request)', async () => { const { api, session } = makeSession() api.onHistory = () => histResponse(plainTurn(6, 1, 'x', 'y'), true) diff --git a/packages/client/ui-conversation/tests/conversation-registry.client.spec.ts b/packages/client/ui-conversation/tests/conversation-registry.client.spec.ts index 63b2c22146..ba52e36ba6 100644 --- a/packages/client/ui-conversation/tests/conversation-registry.client.spec.ts +++ b/packages/client/ui-conversation/tests/conversation-registry.client.spec.ts @@ -51,6 +51,7 @@ function fakeSession(): SessionFace { cancel: () => Promise.reject(new Error('unused fake Session operation')), rename: () => Promise.reject(new Error('unused fake Session operation')), loadOlder: () => Promise.reject(new Error('unused fake Session operation')), + loadThrough: () => Promise.reject(new Error('unused fake Session operation')), command: () => Promise.reject(new Error('unused fake Session operation')), } } diff --git a/packages/test-support/client-runtime/src/sessions.ts b/packages/test-support/client-runtime/src/sessions.ts index da67718820..419e155af7 100644 --- a/packages/test-support/client-runtime/src/sessions.ts +++ b/packages/test-support/client-runtime/src/sessions.ts @@ -152,6 +152,14 @@ export class FixtureSession implements SessionFace { throw new Error(`test session "${this.sessionId}": loadOlder is not stubbed — supply it on the fixture's session face`) } + /** + * Fail-loud stub; supply `loadThrough` on the fixture's session face to exercise it. + * @returns never — always throws. + */ + loadThrough(): never { + throw new Error(`test session "${this.sessionId}": loadThrough is not stubbed — supply it on the fixture's session face`) + } + /** * Fail-loud stub; supply `rename` on the fixture's session face to exercise it. * @returns never — always throws. From b3064cca771aaa116190388e38946c06f7b8c062 Mon Sep 17 00:00:00 2001 From: Yichen Jiang Date: Sun, 30 Aug 2026 13:08:14 +0800 Subject: [PATCH 06/26] feat(ui-chat): full-session turn rail with load-and-jump MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The rail now merges the turnOutline projection with loaded-window items (view-layer only; loaded wins, outline fills mid-turn prompt previews), renders unloaded turns as dimmer marks, and clicking one holds the reader's place, pages history through the turn's seq, and lands on its row after the commit — no height estimation. Settlement repages once per head movement, then falls back to the nearest rendered turn. --- packages/client/ui-chat/package.json | 1 + packages/client/ui-chat/src/client/apply.ts | 1 + .../ui-chat/src/client/chat/ChatView.tsx | 138 +++++++++++++++--- .../src/client/chat/TurnNavigator.module.css | 17 +++ .../ui-chat/src/client/chat/TurnNavigator.tsx | 35 +++-- .../src/client/chat/turn-rail-items.ts | 79 ++++++++++ .../ui-chat/src/client/contract/slots.ts | 2 + packages/client/ui-chat/src/client/locale.ts | 2 + .../ui-chat/tests/chat-view.client.spec.tsx | 69 ++++++++- .../tests/turn-rail-items.client.spec.ts | 74 ++++++++++ packages/client/ui-chat/tsconfig.json | 3 + pnpm-lock.yaml | 3 + 12 files changed, 391 insertions(+), 33 deletions(-) create mode 100644 packages/client/ui-chat/src/client/chat/turn-rail-items.ts create mode 100644 packages/client/ui-chat/tests/turn-rail-items.client.spec.ts diff --git a/packages/client/ui-chat/package.json b/packages/client/ui-chat/package.json index 2121f5f804..56b3e2a888 100644 --- a/packages/client/ui-chat/package.json +++ b/packages/client/ui-chat/package.json @@ -78,6 +78,7 @@ "@deepseek-ai/dsh-llm-retry": "workspace:^", "@deepseek-ai/dsh-session": "workspace:^", "@deepseek-ai/dsh-session-stats": "workspace:^", + "@deepseek-ai/dsh-session-turn-outline": "workspace:^", "@deepseek-ai/dsh-token-meter": "workspace:^", "@deepseek-ai/dsh-tools": "workspace:^", "@deepseek-ai/dsh-util-workspace-path": "workspace:^", diff --git a/packages/client/ui-chat/src/client/apply.ts b/packages/client/ui-chat/src/client/apply.ts index be061dff13..a23ada43d7 100644 --- a/packages/client/ui-chat/src/client/apply.ts +++ b/packages/client/ui-chat/src/client/apply.ts @@ -125,6 +125,7 @@ export function apply(ctx: Context): void { if (!result.ok) throw new Error(`path open failed: ${result.error.message}`) }, loadOlder: () => { void session.loadOlder() }, + loadThrough: seq => session.loadThrough(seq), loadImage: Object.assign( (attachment: ImageAttachmentRef) => ctx.uiConversation.imageUrl(sessionId, attachment), { peek: (attachment: ImageAttachmentRef) => ctx.uiConversation.peekImageUrl(sessionId, attachment) }, diff --git a/packages/client/ui-chat/src/client/chat/ChatView.tsx b/packages/client/ui-chat/src/client/chat/ChatView.tsx index 517dccfeb3..2c41dbd057 100644 --- a/packages/client/ui-chat/src/client/chat/ChatView.tsx +++ b/packages/client/ui-chat/src/client/chat/ChatView.tsx @@ -7,10 +7,11 @@ import type { } from '@deepseek-ai/dsh-client-ui-conversation/client' import { Button, IconChevronDownOutline14, Modal } from '@deepseek-ai/dsh-client-ui-primitives' import type { ChatViewSlotProps } from '../contract/slots.ts' -import type { ChatSnapshot, TurnNavigationItem } from '../contract/snapshot.ts' +import type { ChatSnapshot } from '../contract/snapshot.ts' import { PendingSteeringBubble, PendingSubmissionBubble } from './MessageItem.tsx' import { ChatNodeSeat } from './ChatNodeSeat.tsx' import { TurnNavigator } from './TurnNavigator.tsx' +import { mergeTurnRailItems, type TurnRailItem } from './turn-rail-items.ts' import { formatRunDuration } from './message-chrome.ts' import css from './ChatView.module.css' @@ -202,8 +203,8 @@ function TurnStatus({ startTime, t }: { * ordered business Node crosses the keyed renderer seat. */ export function ChatView({ - useSession, useChat, useSessions, useStore, actions, renderSlot, sessionId, openFile, loadOlder, loadImage, openView, chatScroll, forkAt, - fileMentions, useTranscriptView, t, + useSession, useChat, useSessions, useStore, actions, renderSlot, sessionId, openFile, loadOlder, loadThrough, + loadImage, openView, chatScroll, forkAt, fileMentions, useTranscriptView, useProjection, t, }: ChatViewSlotProps) { const order = useChat(s => s.order) const nodeStore = useChat(s => s.nodes) @@ -211,6 +212,13 @@ export function ChatView({ // both the data and its change signal: the array identity moves only when a // Turn enters, leaves, or changes its preview. const turnNavigationItems = useChat(s => s.navigation.items()) + // Host-computed whole-log outline; the merge is view-layer only (the + // conversation snapshot never carries projection values). + const turnOutline = useProjection('turnOutline') + const railItems = useMemo( + () => mergeTurnRailItems(turnNavigationItems, turnOutline), + [turnNavigationItems, turnOutline], + ) const timeline = useChat(s => s.timeline) const inbox = useSession(s => s.queue) // Workspace root off the session list row: path summaries display relative to it. @@ -295,6 +303,13 @@ export function ChatView({ /** Paging anchor: semantic row/position at click, updated by reader scrolls * while the request is pending and restored after the prepend lands. */ const anchorRef = useRef(null) + /** Unloaded-turn jump in flight: target turn plus its load-through seq. */ + const pendingJumpRef = useRef<{ turn: number; seq: number } | null>(null) + const [busyJumpTurn, setBusyJumpTurn] = useState(null) + /** Bumped when a loadThrough completion settles, after its last page's commit. */ + const [jumpSettleTick, setJumpSettleTick] = useState(0) + /** Window head at the last settle-time repage; an unmoved head falls back instead of repaging forever. */ + const jumpRepageHeadRef = useRef(null) const firstSeqRef = useRef(null) const openedRef = useRef(false) const lastKeyRef = useRef(null) @@ -369,6 +384,9 @@ export function ChatView({ const toBottom = (el: HTMLElement): void => { anchorRef.current = null + // Returning to the live tail supersedes a jump still landing. + pendingJumpRef.current = null + setBusyJumpTurn(current => current === null ? current : null) el.scrollTop = el.scrollHeight observedTopRef.current = el.scrollTop atBottomRef.current = true @@ -377,6 +395,38 @@ export function ChatView({ setActiveTurn(turnNavigationItems.at(-1)?.turn ?? null) } + // Land a row at the reading line and republish scroll-derived state. A + // latest-ref, so navigateToTurn's identity stays stable for the memoized rail. + const landOnRowRef = useRef<(local: HTMLElement, el: HTMLElement, row: HTMLElement, turn: number) => void>( + () => {}, + ) + landOnRowRef.current = (local, el, row, turn) => { + el.scrollTop += flowTop(row, el) - 24 + observedTopRef.current = el.scrollTop + const isAtBottom = el.scrollHeight - el.scrollTop - el.clientHeight <= FOLLOW_THRESHOLD + 1 + atBottomRef.current = isAtBottom + setAtBottom(isAtBottom) + setActiveTurn(turn) + const position = isAtBottom ? null : scrollPosition(local, el) + if (isAtBottom) chatScroll.save(null) + else if (position !== null) chatScroll.save(position) + } + + /** Land the pending jump once its Turn has a rendered anchor row; false while it must keep waiting. */ + const realizePendingJump = (local: HTMLElement, el: HTMLElement): boolean => { + const pending = pendingJumpRef.current + if (pending === null) return true + const item = railItems.find(candidate => candidate.turn === pending.turn) + if (item === undefined || item.anchor.kind !== 'loaded') return false + const row = anchorElement(local, item.anchor.key) + if (row === null) return false + pendingJumpRef.current = null + setBusyJumpTurn(null) + anchorRef.current = null + landOnRowRef.current(local, el, row, pending.turn) + return true + } + useLayoutEffect(() => { const local = listRef.current /* v8 ignore next -- ref-null guard: React attaches the ref before layout effects run. */ @@ -418,6 +468,11 @@ export function ChatView({ const row = anchorElement(local, anchor.key) if (row !== null) el.scrollTop += flowTop(row, el) - anchor.top observedTopRef.current = el.scrollTop + // A jump chunk lands here: scroll to the target once its rows exist; + // until then keep holding the reader's row for the next chunk. + if (!realizePendingJump(local, el) && row !== null) { + anchorRef.current = { key: anchor.key, top: flowTop(row, el) } + } firstSeqRef.current = firstSeq /* v8 ignore next -- ?? arm: a prepend adds nodes, so the flow list here is never empty. */ lastKeyRef.current = lastKey @@ -439,7 +494,13 @@ export function ChatView({ followSigRef.current = followSig // Follow new flow content while pinned; do NOT re-pin on every render // merely because atBottomRef is true (scroll threshold → setState → snap). - if (appendedUser || appendedSteering || appendedSubmission || (tipMoved && atBottomRef.current)) toBottom(el) + if (appendedUser || appendedSteering || appendedSubmission || (tipMoved && atBottomRef.current)) { + toBottom(el) + return + } + // A jump whose target committed outside the anchored-prepend path (for + // example after a mid-jump toBottom dropped the held anchor) lands here. + if (pendingJumpRef.current !== null) realizePendingJump(local, el) }) const onScrollRef = useRef(() => {}) @@ -533,6 +594,38 @@ export function ChatView({ if (!loadingOlder) anchorRef.current = null }, [loadingOlder]) + // Jump settlement: every loadThrough completion bumps the tick after its + // last page's commit. A still-pending jump is either realized now, repaged + // once per head movement (its own paging can be refused while a plain pull + // holds the busy flag), or landed on the nearest rendered Turn at or after + // the target (failure, exhausted history, or a Turn with no visible row). + useEffect(() => { + const pending = pendingJumpRef.current + const local = listRef.current + if (pending === null || local === null) return + const el = scrollerOf(local) + if (realizePendingJump(local, el)) return + const uncovered = firstSeq === null || firstSeq > pending.seq + if (uncovered && hasMore && !loadingOlder && jumpRepageHeadRef.current !== firstSeq) { + jumpRepageHeadRef.current = firstSeq + const held = pagingAnchor(local, el) + if (held !== null && held.dataset.chatAnchorKey !== undefined) { + anchorRef.current = { key: held.dataset.chatAnchorKey, top: flowTop(held, el) } + } + void loadThrough(pending.seq).finally(() => { setJumpSettleTick(tick => tick + 1) }) + return + } + for (const row of local.querySelectorAll('[data-chat-turn]:not([hidden])')) { + const turn = Number(row.dataset.chatTurn) + if (!Number.isSafeInteger(turn) || turn < pending.turn) continue + landOnRowRef.current(local, el, row, turn) + break + } + pendingJumpRef.current = null + setBusyJumpTurn(null) + // Snapshot values are read at settle time; the completion tick is the trigger. + }, [jumpSettleTick]) + const loadOlderAnchored = (): void => { const local = listRef.current /* v8 ignore next -- ref-null guard: the paging button renders inside the list tree. */ @@ -550,35 +643,44 @@ export function ChatView({ } // Identity feeds the memoized rail; a fresh closure per render would defeat it. - const navigateToTurn = useCallback((item: TurnNavigationItem): void => { + const navigateToTurn = useCallback((item: TurnRailItem): void => { const local = listRef.current if (local === null) return - const row = anchorElement(local, item.anchorKey) - if (row === null) return const el = scrollerOf(local) - el.scrollTop += flowTop(row, el) - 24 - observedTopRef.current = el.scrollTop + if (item.anchor.kind === 'unloaded') { + // Hold the reader's place through the paging chunks; the layout effect + // lands on the target once its rows commit. + const held = pagingAnchor(local, el) + if (held !== null && held.dataset.chatAnchorKey !== undefined) { + anchorRef.current = { key: held.dataset.chatAnchorKey, top: flowTop(held, el) } + } + pendingJumpRef.current = { turn: item.turn, seq: item.anchor.seq } + jumpRepageHeadRef.current = null + setBusyJumpTurn(item.turn) + void loadThrough(item.anchor.seq).finally(() => { setJumpSettleTick(tick => tick + 1) }) + return + } + const row = anchorElement(local, item.anchor.key) + if (row === null) return + // A loaded-mark click supersedes any jump still landing. + pendingJumpRef.current = null + setBusyJumpTurn(current => current === null ? current : null) + landOnRowRef.current(local, el, row, item.turn) // A pending older page still has to compensate the prepended height, so // navigation moves that anchor to the new position instead of dropping it. const landed = loadingOlder ? pagingAnchor(local, el) : null anchorRef.current = landed === null || landed.dataset.chatAnchorKey === undefined ? null : { key: landed.dataset.chatAnchorKey, top: flowTop(landed, el) } - const isAtBottom = el.scrollHeight - el.scrollTop - el.clientHeight <= FOLLOW_THRESHOLD + 1 - atBottomRef.current = isAtBottom - setAtBottom(isAtBottom) - setActiveTurn(item.turn) - const position = isAtBottom ? null : scrollPosition(local, el) - if (isAtBottom) chatScroll.save(null) - else if (position !== null) chatScroll.save(position) - }, [loadingOlder, chatScroll]) + }, [loadingOlder, loadThrough]) return (
diff --git a/packages/client/ui-chat/src/client/chat/TurnNavigator.module.css b/packages/client/ui-chat/src/client/chat/TurnNavigator.module.css index 76a7b73e9c..af13b07ba0 100644 --- a/packages/client/ui-chat/src/client/chat/TurnNavigator.module.css +++ b/packages/client/ui-chat/src/client/chat/TurnNavigator.module.css @@ -83,11 +83,21 @@ transition: width 140ms ease, background-color 140ms ease; } +/* Ordered before hover/active so those states keep their stronger tick. */ +.markUnloaded::before { + width: 8px; + opacity: 0.6; +} + .markPreview::before { width: 18px; background: var(--dsw-alias-label-tertiary); } +.markBusy::before { + animation: dsh-turn-mark-busy 1s ease-in-out infinite; +} + .markActive::before { width: 20px; background: var(--dsw-alias-label-primary); @@ -163,6 +173,12 @@ to { opacity: 1; transform: translateX(0); } } +@keyframes dsh-turn-mark-busy { + 0%, + 100% { opacity: 1; } + 50% { opacity: 0.35; } +} + @container (max-width: 900px) { .slot { display: none; @@ -173,6 +189,7 @@ .rail, .markPosition, .mark::before, + .markBusy::before, .preview { transition: none; animation: none; diff --git a/packages/client/ui-chat/src/client/chat/TurnNavigator.tsx b/packages/client/ui-chat/src/client/chat/TurnNavigator.tsx index 55818f85cd..3eef55269a 100644 --- a/packages/client/ui-chat/src/client/chat/TurnNavigator.tsx +++ b/packages/client/ui-chat/src/client/chat/TurnNavigator.tsx @@ -2,13 +2,15 @@ import { memo, useId, useState, type CSSProperties, type MouseEvent, type PointerEvent, } from 'react' import type { ChatViewSlotProps } from '../contract/slots.ts' -import type { TurnNavigationItem } from '../contract/snapshot.ts' +import type { TurnRailItem } from './turn-rail-items.ts' import css from './TurnNavigator.module.css' interface TurnNavigatorProps { - readonly items: readonly TurnNavigationItem[] + readonly items: readonly TurnRailItem[] readonly activeTurn: number | null - readonly onNavigate: (item: TurnNavigationItem) => void + /** Turn whose jump is still paging history in; its mark pulses. */ + readonly busyTurn: number | null + readonly onNavigate: (item: TurnRailItem) => void readonly t: ChatViewSlotProps['t'] } @@ -43,17 +45,17 @@ function railSize(count: number): TurnRailStyle { } function itemAtPointer( - items: readonly TurnNavigationItem[], + items: readonly TurnRailItem[], rail: HTMLElement, clientY: number, -): TurnNavigationItem | undefined { +): TurnRailItem | undefined { const rect = rail.getBoundingClientRect() const usableHeight = Math.max(1, rect.height - 2 * RAIL_INSET_PX) const ratio = Math.max(0, Math.min(1, (clientY - rect.top - RAIL_INSET_PX) / usableHeight)) return items[Math.round(ratio * (items.length - 1))] } -function TurnNavigatorRail({ items, activeTurn, onNavigate, t }: TurnNavigatorProps) { +function TurnNavigatorRail({ items, activeTurn, busyTurn, onNavigate, t }: TurnNavigatorProps) { const [previewTurn, setPreviewTurn] = useState(null) const previewId = useId() if (items.length < 2) return null @@ -81,16 +83,22 @@ function TurnNavigatorRail({ items, activeTurn, onNavigate, t }: TurnNavigatorPr {items.map((item, index) => { const active = item.turn === activeTurn const showingPreview = item.turn === previewTurn - const markClass = active - ? `${css.mark} ${css.markActive}` - : showingPreview ? `${css.mark} ${css.markPreview}` : css.mark + const classes = [css.mark] + if (item.anchor.kind === 'unloaded') classes.push(css.markUnloaded) + if (active) classes.push(css.markActive) + else if (showingPreview) classes.push(css.markPreview) + if (item.turn === busyTurn) classes.push(css.markBusy) return (
- ) - })} +
{ syncScrollState() }} + > +
+ {items.map((item, index) => { + const active = item.turn === activeTurn + const showingPreview = item.turn === previewTurn + const classes = [css.mark] + if (item.anchor.kind === 'unloaded') classes.push(css.markUnloaded) + if (active) classes.push(css.markActive) + else if (showingPreview) classes.push(css.markPreview) + if (item.turn === busyTurn) classes.push(css.markBusy) + return ( +
+
+ ) + })} +
{preview !== undefined && previewPosition !== undefined && (