dsh-edit-turn 0.3.1 → 0.3.3

package/README.md

@@ -164,7 +164,7 @@ ctx.sessions.registerMessageProjection({
 | 运行中的实例是否真的挂载了本插件（只读路由守卫探针，无需 token） | `npm run probe:loaded [端口]` | 通过：`/state` 返 400、`/apply` 返 405 —— 这两个状态码只有本插件会返回 |
 | 浏览器半部到底问了什么、拿回了什么（只读诊断，含失败记录） | `GET /dsh-edit-turn/debug` | 通过：真实浏览器里确认客户端确实拿到 replies；并复现了旧 v3 会话的 session-not-found |
 | 官方 append **与读取**契约（真实校验器，进程内） | `npm run verify:contract` | 96 项通过（每段写入后都用加载器重读整份日志）：替换事件被接受、派生历史真的收缩、日志 append-only、工具结果与调用同进同退、空 developer 载体不产生模型消息、**连续两次回退都被接受**、**编辑模型回答的完整机制被接受**、**回复编辑后的尾部重放（后续提问/回答/tool 调用与结果按新 turn 号回到修正回答之后，顺序正确、日志仍可加载）**、**跨插件依赖的不变量（单节点窗口 / 同事件类型 / 全窗口 sourceEventSeqs / 每个替换都带 `editedBy` 标记 / 改写后的 `source.kind` 不是 `user` / 修正回复不带 `sourceEventSeqs`）**，以及**就地补丁：一条 ignorable 记录、surface 不变、去掉投影后原文回来、后续轮次与 tool 结果不动、第二条记录可叠加** |
-| 纯逻辑 + 宿主集成 + 客户端 DOM 行为（真 HTTP、真校验器、桩服务、DOM 桩） | `npm test` | 210 项通过（含回复编辑的尾部重放用例：窗口/重放区间、新 turn 号与新 messageId、tool 调用与结果成对重映射、上一轮修正可再次编辑，以及与 `dsh-rerun-turn` builder 的逐字段对照；另含「文本没变 → 不写」的四条，以及块随消息一起改的 35 条：未动的块逐字节保留、删块少一块、文字位置不变、no-op 语义升级、附件服务缺失时降级且不写坏数据、自定义 `quote-card` 块的通用性、录用与拒绝、`/state` 的块描述与能力、附件字节路由、编辑器芯片/删除/添加/缩略图/降级警告） |
+| 纯逻辑 + 宿主集成 + 客户端 DOM 行为（真 HTTP、真校验器、桩服务、DOM 桩） | `npm test` | 213 项通过（含回复编辑的尾部重放用例：窗口/重放区间、新 turn 号与新 messageId、tool 调用与结果成对重映射、上一轮修正可再次编辑，以及与 `dsh-rerun-turn` builder 的逐字段对照；另含「文本没变 → 不写」的四条，以及块随消息一起改的 35 条：未动的块逐字节保留、删块少一块、文字位置不变、no-op 语义升级、附件服务缺失时降级且不写坏数据、自定义 `quote-card` 块的通用性、录用与拒绝、`/state` 的块描述与能力、附件字节路由、编辑器芯片/删除/添加/缩略图/降级警告） |
 | 客户端半部静态检查（注册、i18n 完整性、样式、皮肤可读性、版本三处同步、线协议、块契约） | `npm run verify:client` | 184 项全部通过（含 12 条块契约检查：能力上报、服务现场探测、录用是唯一建块路径、录用先于 append、**两侧都不特判块类型**、块逐字节复制、文字归位、`dropped` 上报、只在无服务时警告、芯片靠 `error` 事件自证） |
 | 实机前端产物校验（运行中的 DSH 是否在下发当前代码） | `npm run verify:live -- --token-file ~/path/to/dsh.log` | 全部通过（含**宿主节点形状锚点**） |
 | **真实浏览器渲染冒烟**（CDP 驱动已开着的标签页，只读） | `npm run verify:ui` | 全部通过：下发的字节就是刚改的字节、无槽位崩溃留下的空占位、回复铅笔在平台动作条里、被回滚的行保住动作条、**被回滚的用户行一定显示替代文本（消息不会凭空消失）**、**替代气泡一定排在时间/复制之上（顺序与正常消息一致）**、**改写后那颗铅笔一定在还活着的动作条末尾（已在原始会话、切走的会话、切回后三处现场确认）**、**回复铅笔一定排在动作条最左（复制之前，已现场确认）**、气泡上没有 `.dshet-floating` 压着文字、切走再切回入口仍在 |
@@ -250,6 +250,19 @@ ln -s /path/to/dsh-install/node_modules ./node_modules
 
 ### 更新日志
 
+**0.3.3** —— 编辑器锚定到刚按下的铅笔，位置不再跑到屏幕另一端。
+
+- 回复的编辑按钮在 turn-tail 操作条里，而编辑器的锚点行可能是比屏幕还高的回答行；0.3.2 会把它钳到视口顶部，按钮可达但离点击处很远。现在把锚点记为按下的按钮本身：优先贴在按钮下方，放不下就贴在按钮上方，再按视口钳制。
+- 长草稿仍由编辑器自身滚动、footer sticky，保存/取消始终可见。
+- **测试**：`npm test` **213/213**、`npm run verify:contract` **96** 项、`npm run verify:client` **184** 项。
+
+**0.3.2** —— 修复编辑器在长回答或页面底部时位置错误、按钮点不到的问题。
+
+- **视口钳制**：编辑框优先放在行下方；放不下就翻到行上方；行比屏幕高、底部在视口外时钉在视口底部，不再跟着行跑到屏幕外。
+- **自身滚动**：编辑框有 `max-height` 和 `overflow-y:auto`，保存/取消所在的 footer 用 `position:sticky` 固定，长草稿也能滚到按钮。
+- **宽度/左边界**也按视口钳制，窄窗口不会被推出屏幕。
+- **测试**：`npm test` **213/213**、`npm run verify:contract` **96** 项、`npm run verify:client` **184** 项。
+
 **0.3.1** —— 修复 0.3.0 的显示与跨插件清理问题。
 
 - **编辑后看不到变化**：`turn-process` 行和 `assistant-step` 行都覆盖同一个 seq，旧的 DOM 映射按文档顺序先拿到过程行，补丁落到没有正文的行上。现在优先 assistant 行；极短回答是裸文本节点时也有兜底。

package/lib/client.js

@@ -42,7 +42,7 @@ window.__ModuleLoader__.load({
     const RERUN_PREFIX = '/dsh-rerun-turn'
 
     /** Keep in sync with package.json and lib/index.js. */
-    const PLUGIN_VERSION = '0.3.1'
+    const PLUGIN_VERSION = '0.3.3'
 
     // --- copy -----------------------------------------------------------------
 
@@ -262,7 +262,7 @@ window.__ModuleLoader__.load({
       // positioned under its row by `placeEditor`.
       '.dshet-layer{position:fixed;left:0;top:0;right:0;bottom:0;pointer-events:none;z-index:40}',
       '.dshet-layer .dshet-editor{position:absolute;pointer-events:auto}',
-      '.dshet-editor{margin:0;border:1px solid var(--dshet-line);border-radius:16px;background:var(--dshet-panel);backdrop-filter:blur(18px) saturate(1.2);box-shadow:var(--dshet-shadow);color:var(--dshet-ink);transition:border-color .12s}',
+      '.dshet-editor{display:flex;flex-direction:column;max-height:calc(100vh - 16px);overflow-y:auto;overscroll-behavior:contain;margin:0;border:1px solid var(--dshet-line);border-radius:16px;background:var(--dshet-panel);backdrop-filter:blur(18px) saturate(1.2);box-shadow:var(--dshet-shadow);color:var(--dshet-ink);transition:border-color .12s}',
       '.dshet-editor:focus-within{border-color:var(--dsw-alias-button-primary-fill,var(--dshet-accent))}',
       '.dshet-editor textarea{display:block;width:100%;min-height:47px;max-height:46vh;overflow-y:auto;resize:none;box-sizing:border-box;padding:11px 14px 0;border:0;background:transparent;color:inherit;font:inherit;font-size:var(--dsh-content-font-size,14px);line-height:calc(22px + var(--dsh-content-font-delta,0px));outline:none}',
       '.dshet-editor textarea::placeholder{color:var(--dshet-ink-dim)}',
@@ -290,7 +290,7 @@ window.__ModuleLoader__.load({
       '.dshet-note{color:var(--dshet-ink-dim)}',
       '.dshet-warn{color:var(--dsw-alias-state-warning-primary,#a2650a)}',
       '.dshet-error{color:var(--dsw-alias-state-error-primary,#c93a31)}',
-      '.dshet-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:4px 10px 10px}',
+      '.dshet-footer{position:sticky;bottom:0;z-index:1;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:4px 10px 10px;background:var(--dshet-panel);backdrop-filter:blur(18px) saturate(1.2)}',
       '.dshet-btn{padding:6px 16px;border:1px solid var(--dshet-line);border-radius:999px;background:var(--dshet-field);color:var(--dshet-ink);font:inherit;font-size:13px;line-height:20px;cursor:pointer;transition:background-color .12s,border-color .12s}',
       '.dshet-btn:hover:not(:disabled){background:var(--dshet-hover)}',
       '.dshet-btn:focus-visible{outline:2px solid var(--dsw-alias-button-primary-fill,var(--dshet-accent));outline-offset:2px}',
@@ -364,6 +364,7 @@ window.__ModuleLoader__.load({
         this.editorElement = null
         this.editorBox = null
         this.editorRow = null
+        this.editorAnchor = null
         this.editorFocus = false
         this.editorDraft = ''
         // The block list being edited: what the carrier will be rebuilt from.
@@ -563,6 +564,9 @@ window.__ModuleLoader__.load({
             }
           : target
         this.editor = normalized
+        this.editorAnchor = target.anchor !== undefined && target.anchor !== null && target.anchor.isConnected === true
+          ? target.anchor
+          : null
         this.editorBlocks = replyBlocks
         this.editorBlockIndex = chosen === undefined ? null : chosen.index
         this.editorBlockKind = chosen === undefined ? null : chosen.kind
@@ -644,6 +648,7 @@ window.__ModuleLoader__.load({
         this.editorElement = null
         this.editorBox = null
         this.editorRow = null
+        this.editorAnchor = null
         this.editorFocus = false
         this.editor = null
         this.editorDraft = ''
@@ -1197,9 +1202,9 @@ window.__ModuleLoader__.load({
      * at all and reads exactly like a dead pencil.
      */
     function wireAction(button) {
-      pressable(button, () => {
+      pressable(button, (event) => {
         const activate = button[ACTIVATE]
-        if (typeof activate === 'function') activate()
+        if (typeof activate === 'function') activate(event)
       })
     }
 
@@ -1815,7 +1820,14 @@ window.__ModuleLoader__.load({
       } else if (button.dataset !== undefined && button.dataset.dshetFallback !== undefined) {
         delete button.dataset.dshetFallback
       }
-      button[ACTIVATE] = () => controller.open(entry.target)
+      button[ACTIVATE] = (event) => controller.open({
+        ...entry.target,
+        // The editor belongs beside the pencil the user just pressed, not at the
+        // top of a row that may be taller than the screen.
+        anchor: event !== undefined && event !== null && event.currentTarget !== undefined
+          ? event.currentTarget
+          : button,
+      })
       liveHosts.add(host)
       if (button.getAttribute('aria-label') !== label) {
         button.setAttribute('aria-label', label)
@@ -1945,13 +1957,57 @@ window.__ModuleLoader__.load({
     // Put the box under the row it belongs to: same width, just below its lower
     // edge. Called on render and whenever the page scrolls or resizes, since
     // the layer is fixed to the viewport.
-    function placeEditor(row, box) {
+    function viewportSize() {
+      const win = typeof window === 'undefined' ? undefined : window
+      const doc = typeof document === 'undefined' ? undefined : document
+      const width = (win !== undefined && win.innerWidth) ||
+        (doc !== undefined && doc.documentElement && doc.documentElement.clientWidth) || 0
+      const height = (win !== undefined && win.innerHeight) ||
+        (doc !== undefined && doc.documentElement && doc.documentElement.clientHeight) || 0
+      return { width, height }
+    }
+
+    // Put the box under the row it belongs to: same width, just below its lower
+    // edge. The layer is fixed to the viewport, so a row near the bottom (or one
+    // taller than the screen) used to push the footer - and its save button -
+    // past the bottom edge where nothing could reach it. Flip above the row when
+    // there is room, otherwise pin the box to the bottom of the viewport and let
+    // its own scrollbar carry the content; the footer stays sticky either way.
+    function placeEditor(row, box, anchor = null) {
       const layer = ensureEditorLayer()
       if (box.parentElement !== layer) layer.appendChild(box)
       const rect = row.getBoundingClientRect()
-      box.style.left = `${Math.round(rect.left)}px`
-      box.style.top = `${Math.round(rect.bottom + 6)}px`
-      box.style.width = `${Math.round(rect.width)}px`
+      let anchorRect = null
+      if (anchor !== null && anchor !== undefined && anchor.isConnected === true && typeof anchor.getBoundingClientRect === 'function') {
+        const candidate = anchor.getBoundingClientRect()
+        if (candidate.width > 0 && candidate.height > 0) anchorRect = candidate
+      }
+      const vertical = anchorRect === null ? rect : anchorRect
+      const viewport = viewportSize()
+      const margin = 8
+      const width = viewport.width > 0
+        ? Math.max(1, Math.min(Math.max(200, rect.width || 0), viewport.width - margin * 2))
+        : Math.max(200, rect.width || 0)
+      box.style.width = `${Math.round(width)}px`
+      const measured = box.getBoundingClientRect()
+      const height = (measured && measured.height) || box.offsetHeight || 0
+      let top = vertical.bottom + 6
+      if (viewport.height > 0 && height > 0) {
+        const maxTop = Math.max(margin, viewport.height - height - margin)
+        if (top + height > viewport.height - margin) {
+          const above = vertical.top - height - 6
+          top = above >= margin ? above : maxTop
+        }
+        // A row taller than the screen has its bottom above the viewport after
+        // the user scrolls to its action bar; without this clamp the box follows
+        // it off-screen and the buttons become unreachable again.
+        top = Math.max(margin, Math.min(top, maxTop))
+      }
+      let left = rect.left
+      if (viewport.width > 0 && left + width > viewport.width - margin) left = viewport.width - width - margin
+      if (left < margin) left = margin
+      box.style.left = `${Math.round(left)}px`
+      box.style.top = `${Math.round(top)}px`
     }
 
     // Grow the textarea to its content, the way a normal input box behaves.
@@ -1981,7 +2037,7 @@ window.__ModuleLoader__.load({
         pressed = true
         event.preventDefault()
         event.stopPropagation()
-        action()
+        action(event)
       }
       button.onclick = (event) => {
         event.preventDefault()
@@ -1990,7 +2046,7 @@ window.__ModuleLoader__.load({
           pressed = false
           return
         }
-        action()
+        action(event)
       }
     }
 
@@ -2232,7 +2288,7 @@ window.__ModuleLoader__.load({
         ? controller.editorBox
         : null
       if (existing && existing.dataset.dshetFor === marker) {
-        placeEditor(row, existing)
+        placeEditor(row, existing, controller.editorAnchor)
         return
       }
 
@@ -2297,8 +2353,16 @@ window.__ModuleLoader__.load({
         // "eats" pinyin.
         if (event.isComposing === true) return
         fitEditorHeight(area)
+        const row = controller.editorRow
+        const box = controller.editorBox
+        if (row !== null && box !== null && box.isConnected === true) placeEditor(row, box, controller.editorAnchor)
+      })
+      area.addEventListener('compositionend', () => {
+        fitEditorHeight(area)
+        const row = controller.editorRow
+        const box = controller.editorBox
+        if (row !== null && box !== null && box.isConnected === true) placeEditor(row, box, controller.editorAnchor)
       })
-      area.addEventListener('compositionend', () => fitEditorHeight(area))
       area.addEventListener('focus', () => {
         controller.editorFocus = true
       })
@@ -2408,11 +2472,11 @@ window.__ModuleLoader__.load({
       footer.appendChild(submit)
       box.appendChild(footer)
 
-      placeEditor(row, box)
       controller.editorBox = box
       controller.editorRow = row
       controller.editorElement = area
       fitEditorHeight(area)
+      placeEditor(row, box, controller.editorAnchor)
       if (!view.confirming && !view.pending && (fresh || wasFocused)) {
         try {
           area.focus()
@@ -2886,6 +2950,7 @@ window.__ModuleLoader__.load({
         event.preventDefault()
         event.stopPropagation()
         controller.open({
+          anchor: event.currentTarget,
           seq: entry.seq,
           mode: 'reply',
           turn: entry.turn,
@@ -2939,7 +3004,7 @@ window.__ModuleLoader__.load({
         const keepPlaced = () => {
           const row = controller.editorRow
           const box = controller.editorBox
-          if (row !== null && box !== null && box.isConnected === true) placeEditor(row, box)
+          if (row !== null && box !== null && box.isConnected === true) placeEditor(row, box, controller.editorAnchor)
         }
         document.addEventListener('pointerdown', onPointerDown, true)
         // Scroll events do not bubble; capture reaches the inner scroller too.

package/lib/index.js

@@ -80,7 +80,7 @@ export const PLUGIN_ID = 'dsh-edit-turn'
 export const name = PLUGIN_ID
 
 /** Keep in sync with package.json and lib/client.js. */
-export const PLUGIN_VERSION = '0.3.1'
+export const PLUGIN_VERSION = '0.3.3'
 
 // A ring of the last few requests, answering "did the browser half even ask, and
 // what did it get?" without needing its console. Read-only diagnostics: the

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-edit-turn",
-  "version": "0.3.1",
+  "version": "0.3.3",
   "description": "Edit any message in DeepSeek Harness in place: a prompt is replaced where it stands; a model reply block (answer text or reasoning) is patched through a plugin record and a message projection, so the turn stays where it is, later turns are untouched and the log grows by one small record. Falls back to the replay splice on hosts without the projection API. The append-only session log is never rewritten.",
   "type": "module",
   "main": "lib/index.js",