fix(notes): 选区菜单失效清理/快照锚点/复制与弹层加固（批8 审查）

Author: Aparencia

app/src/components/NoteReadingView.test.tsx

@@ -116,4 +116,48 @@ describe("阅读态正文选区右键菜单（批 8 REQ-317）", () => {
     fireEvent.click(screen.getByTestId("note-sel-toQuestion"));
     expect(onSelectionAction).toHaveBeenCalledWith("toQuestion", "选中段落文本");
   });
+
+  it("进编辑再退出（Ctrl+E→ESC 往返）：旧菜单不复活——状态随 editing 失效（审查 P2-12）", () => {
+    const { rerender } = renderSel({});
+    const openMenu = () => {
+      const body = document.querySelector("[data-note-read-body]");
+      const para = body!.querySelector("p");
+      const selStub = {
+        isCollapsed: false,
+        rangeCount: 1,
+        anchorNode: para!.firstChild,
+        focusNode: para!.firstChild,
+        toString: () => "旧快照文本",
+      };
+      vi.spyOn(window, "getSelection").mockReturnValue(selStub as unknown as Selection);
+      fireEvent.contextMenu(para!, { clientX: 80, clientY: 80 });
+    };
+    openMenu();
+    expect(screen.getByTestId("note-sel-menu")).toBeTruthy();
+    // Ctrl+E 进编辑（编辑态替换正文区）→ 退出编辑回阅读
+    rerender(<NoteReadingView note={baseNote()} editing={true} onEdit={noop} onPinToggle={noop} onDelete={noop} onTagClick={noop} onOpenSession={noop} onTaskToggle={noop} onImageOpen={noop} />);
+    expect(screen.queryByTestId("note-sel-menu")).toBeNull();
+    rerender(<NoteReadingView note={baseNote()} editing={false} onEdit={noop} onPinToggle={noop} onDelete={noop} onTagClick={noop} onOpenSession={noop} onTaskToggle={noop} onImageOpen={noop} />);
+    // 旧菜单（旧快照）不得随 `!editing` 门控复活
+    expect(screen.queryByTestId("note-sel-menu")).toBeNull();
+  });
+
+  it("切笔记后旧菜单不复活（防旧快照文本 + 新 note 上下文错配——审查 P2-12）", () => {
+    const second = { ...baseNote(), id: 2, title: "另一篇", content: "别的正文" };
+    const { rerender } = renderSel({});
+    const body = document.querySelector("[data-note-read-body]");
+    const para = body!.querySelector("p");
+    const selStub = {
+      isCollapsed: false,
+      rangeCount: 1,
+      anchorNode: para!.firstChild,
+      focusNode: para!.firstChild,
+      toString: () => "甲笔记的选中文本",
+    };
+    vi.spyOn(window, "getSelection").mockReturnValue(selStub as unknown as Selection);
+    fireEvent.contextMenu(para!, { clientX: 80, clientY: 80 });
+    expect(screen.getByTestId("note-sel-menu")).toBeTruthy();
+    rerender(<NoteReadingView note={second} editing={false} onEdit={noop} onPinToggle={noop} onDelete={noop} onTagClick={noop} onOpenSession={noop} onTaskToggle={noop} onImageOpen={noop} />);
+    expect(screen.queryByTestId("note-sel-menu")).toBeNull();
+  });
 });

app/src/components/NoteReadingView.tsx

@@ -74,6 +74,12 @@ export default function NoteReadingView({
   // 用户关闭搜索/离开笔记再普通打开同一笔记时，旧命中词不得自动重现
   const injectedRef = useRef<{ noteId: number; key: number } | null>(null);
 
+  // 批 8 审查 P2-12：菜单快照属"打开瞬间"——切笔记/进出编辑后旧快照作废
+  // （只靠 `!editing && selMenu` 渲染门控会让旧菜单在退出编辑/切笔记后复活，
+  // "转问题"会以旧文本 + 新 note 上下文错配）。状态清理而非仅渲染隐藏：
+  // 复活路径（Ctrl+E 进编辑→ESC 退出）与切笔记路径都被本条 effect 覆盖。
+  useEffect(() => { setSelMenu(null); }, [note.id, editing]);
+
   // v0.19.1：外部命中词搜索（引用跳转自动激活——key 递增允许同词重触发；
   // 编辑态不注入（审查 M2——高亮只属于阅读视图，且搜索框 autoFocus 不得抢
   // 编辑器焦点）；编辑退出后同一请求可再次注入）

app/src/components/RichEditorView.test.tsx

@@ -124,6 +124,34 @@ describe("RichEditorView 选区右键菜单（批 8 REQ-317）", () => {
     fireEvent.click(await screen.findByTestId("note-sel-toQuestion"));
     expect(onSelectionAction).toHaveBeenCalledWith("toQuestion", "第一行\n第二行");
   });
+
+  it("菜单打开后光标移走 → 加入行动仍插在快照 to（不用点击瞬间光标——审查 P2-13）", async () => {
+    render(<RichEditorView note={baseNote} onCancel={vi.fn()} />);
+    await waitFor(() => expect(cmContent().textContent).toContain("第一行"));
+    // Ctrl+A 全选 → 右键开菜单（快照 to=doc 末 7）
+    fireEvent.keyDown(cmContent(), { key: "a", ctrlKey: true });
+    fireEvent.contextMenu(cmContent(), { clientX: 120, clientY: 120 });
+    expect(await screen.findByTestId("note-sel-menu")).toBeTruthy();
+    // 菜单开着时把光标移到文首（连按 ←——任何一次都会离开末位，快照 to 不变）
+    for (let i = 0; i < 20; i += 1) fireEvent.keyDown(cmContent(), { key: "ArrowLeft" });
+    fireEvent.click(screen.getByTestId("note-sel-addTask"));
+    // 断言：插在快照 to（末行行尾），而非点击瞬间光标处（文首→首行尾）——
+    // 若用点击瞬间光标，任务行会插进「第一行」之后（textContent 出现行间任务）
+    await waitFor(() => {
+      expect(cmContent().textContent).toBe("第一行第二行- [ ] 第一行 第二行");
+    });
+  });
+
+  it("荧光笔色板开着时正文右键 → 选区菜单打开且色板随机关闭（互斥——审查 P3-2）", async () => {
+    render(<RichEditorView note={baseNote} onCancel={vi.fn()} />);
+    await waitFor(() => expect(cmContent().textContent).toContain("第一行"));
+    fireEvent.click(screen.getByTestId("highlight-open"));
+    expect(screen.getByTestId("highlight-pop")).toBeTruthy();
+    fireEvent.keyDown(cmContent(), { key: "a", ctrlKey: true });
+    fireEvent.contextMenu(cmContent(), { clientX: 120, clientY: 120 });
+    expect(await screen.findByTestId("note-sel-menu")).toBeTruthy();
+    expect(screen.queryByTestId("highlight-pop")).toBeNull();
+  });
 });
 
 describe("RichEditorView 草稿恢复层", () => {

app/src/components/RichEditorView.tsx

@@ -68,9 +68,10 @@ const RichEditorView = forwardRef<NoteEditHandle, Props>(function RichEditorView
   const [draftPrompt, setDraftPrompt] = useState<{ title: string; content: string } | null>(null);
   // v0.16.1：荧光笔色板弹层开合（受控——选色/默认黄/点击外部关闭）
   const [highlightOpen, setHighlightOpen] = useState(false);
-  // 批 8（REQ-317）：编辑态选区右键菜单态（CM 选区文本快照——点击动作不再
-  // 依赖“点击瞬间选区仍在”，快照语义与阅读态 SelectionActionMenu 一致）
-  const [selMenu, setSelMenu] = useState<{ x: number; y: number; text: string } | null>(null);
+  // 批 8（REQ-317）：编辑态选区右键菜单态——CM 选区在菜单打开瞬间的**快照**
+  // （text + to：文本与插入锚点同源同刻捕获，菜单内点击不依赖“点击瞬间的
+  // CM 选区仍存活”——审查 P2-13：键盘移动光标后加入行动仍插在快照 to）
+  const [selMenu, setSelMenu] = useState<{ x: number; y: number; text: string; to: number } | null>(null);
 
   // refs 快照（卸载/定时器闭包取最新值，防 state 闭包过期——同 NoteEditView）
   const titleRef = useRef(title);
@@ -153,10 +154,14 @@ const RichEditorView = forwardRef<NoteEditHandle, Props>(function RichEditorView
       return;
     }
     if (action === "addTask") {
-      // 加入行动：以「选区结束处所在行」为锚插入 `- [ ] <快照文本>` 独立任务行；
-      // dispatch → 既有 onChange → 自动保存/草稿/任务索引重扫通道（不 bypass）
+      // 加入行动：以「快照 to（菜单打开瞬间选区结束处）」所在行为锚插入
+      // `- [ ] <快照文本>` 独立任务行；不用点击瞬间的 view.state.selection——
+      // 菜单打开后键盘移动光标会改变主选区（快照 to 才是动作时有效的锚点，
+      // 审查 P2-13）；dispatch → 既有 onChange → 自动保存/草稿/任务索引重扫
+      // 通道（不 bypass 保存）
       if (!view || !snapshotText) return;
-      const plan = planTaskLineInsert(view.state.doc.toString(), view.state.selection.main.to, snapshotText);
+      const snapshotTo = selMenu?.to ?? view.state.selection.main.to;
+      const plan = planTaskLineInsert(view.state.doc.toString(), snapshotTo, snapshotText);
       if (!plan) return;
       view.dispatch({
         changes: { from: plan.from, insert: plan.insert },
@@ -195,7 +200,11 @@ const RichEditorView = forwardRef<NoteEditHandle, Props>(function RichEditorView
         if (!t.trim()) return false;
         e.preventDefault();
         e.stopPropagation(); // 自绘菜单范式：到 window 前截停（原生兜底同在）
-        setSelMenu({ x: e.clientX, y: e.clientY, text: t });
+        // 审查 P3-2：选区菜单打开时顺带关荧光笔色板（互斥——色板弹层 z30 在
+        // 菜单背板 z60 之下，留开会形成视觉残留且只能靠点背板被动关闭）
+        setHighlightOpen(false);
+        // 快照含选区结束 offset（P2-13：加入行动锚点=打开瞬间，非点击瞬间）
+        setSelMenu({ x: e.clientX, y: e.clientY, text: t, to: main.to });
         return true;
       },
     }),

app/src/components/note-selection/SelectionActionMenu.test.tsx

@@ -0,0 +1,67 @@
+// @vitest-environment jsdom
+/**
+ * SelectionActionMenu.test.tsx — 共享选区菜单（批 8 REQ-317）补测。
+ *
+ * @ai-context: 覆盖审查 P3-4——坐标钳制一次性：位置在打开瞬间按「含状态行区」
+ *              的最终高度计算（复制成功状态行出现不再重钳上跳）；贴底场景下
+ *              style.top 从打开到状态行出现全程不变。invoke 无依赖（复制走
+ *              navigator.clipboard mock；菜单组件自身零后端调用）。
+ */
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { cleanup, fireEvent, render, screen, waitFor } from "@testing-library/react";
+import SelectionActionMenu from "./SelectionActionMenu";
+
+const { writeText } = vi.hoisted(() => ({ writeText: vi.fn() }));
+
+const originalInner = { w: window.innerWidth, h: window.innerHeight };
+const originalClipboard = navigator.clipboard;
+
+const baseProps = {
+  x: 500,
+  y: 500,
+  mode: "editing" as const,
+  text: "选中文字快照",
+  onClose: vi.fn(),
+  onAction: vi.fn(),
+};
+
+beforeEach(() => {
+  writeText.mockReset();
+  writeText.mockResolvedValue(undefined);
+  // jsdom 无 navigator.clipboard——按可用注入（configurable 属性，afterEach 还原）
+  Object.defineProperty(navigator, "clipboard", { configurable: true, value: { writeText } });
+  // 小视口：底部钳制必命中（贴底 y=500 > vh-h-4）
+  Object.defineProperty(window, "innerWidth", { configurable: true, value: 640 });
+  Object.defineProperty(window, "innerHeight", { configurable: true, value: 480 });
+});
+
+afterEach(() => {
+  cleanup();
+  Object.defineProperty(window, "innerWidth", { configurable: true, value: originalInner.w });
+  Object.defineProperty(window, "innerHeight", { configurable: true, value: originalInner.h });
+  Object.defineProperty(navigator, "clipboard", { configurable: true, value: originalClipboard });
+});
+
+describe("SelectionActionMenu 坐标钳制一次性（审查 P3-4）", () => {
+  it("贴底场景：打开位置即终位——复制状态行出现后 top 不变（预留状态行区钳制）", async () => {
+    // 编辑态 5 项：HEAD(34) + 5×ROW(30) + 状态行预留(26) + padding(8) = 218
+    // 视口 480 → clamp 上限 = 480 - 218 - 4 = 258；y=500 贴底 → top=258
+    const { baseElement } = render(<SelectionActionMenu {...baseProps} />);
+    const menu = screen.getByTestId("note-sel-menu");
+    expect(menu.style.top).toBe("258px");
+    // 点击复制 → 状态行出现（菜单保持打开）——位置不得因高度重算而位移
+    fireEvent.click(screen.getByTestId("note-sel-copy"));
+    expect(await screen.findByTestId("note-sel-copy-status")).toBeTruthy();
+    await waitFor(() => expect(writeText).toHaveBeenCalledWith("选中文字快照"));
+    expect(menu.style.top).toBe("258px");
+    expect(baseElement.querySelector('[data-testid="note-sel-copy-status"]')?.textContent).toContain("已复制");
+  });
+
+  it("常规位置不受预留影响（上方不越界时按请求坐标定位）", () => {
+    Object.defineProperty(window, "innerHeight", { configurable: true, value: 1000 });
+    render(<SelectionActionMenu {...baseProps} x={120} y={200} />);
+    const menu = screen.getByTestId("note-sel-menu");
+    expect(menu.style.top).toBe("200px");
+    expect(menu.style.left).toBe("120px");
+  });
+});

app/src/components/note-selection/SelectionActionMenu.tsx

@@ -39,6 +39,10 @@ const MENU_W = 224;
 /** 行高/头/状态行余量的高度估算（钳制用；菜单自身不溢出视口） */
 const ROW_H = 30;
 const HEAD_H = 34;
+/** 状态行高度（复制成功后出现；`已复制…` 反馈行 ≈18px 字高 + 8px 纵向留白） */
+const STATUS_H = 26;
+/** 面板上下 padding 合计（style padding: 4） */
+const PANEL_PAD = 8;
 
 const ITEM: React.CSSProperties = {
   display: "flex",
@@ -94,8 +98,13 @@ export default function SelectionActionMenu({ x, y, mode, text, onClose, onActio
     };
   }, [onClose]);
 
-  const menuH = HEAD_H + items.length * ROW_H + (statusShown ? 26 : 8);
-  const pos = clampMenuXY(x, y, MENU_W, menuH, window.innerWidth, window.innerHeight);
+  // 坐标钳制（审查 P3-4 取舍）：高度按「含状态行区」的最终形态**一次性**计算
+  // ——Why 不随 statusShown 重算：贴底菜单在复制成功、状态行出现时会因高度
+  // 增加（+18px 净增）被重钳上跳（位置抖动）；预留后位置=终位，复制只增高
+  // 不位移。代价：未触发状态行时菜单可比内容高出一截（多预留在上方空白），
+  // 视觉可接受且换取“打开即终位”的稳定性。实际渲染高度仍随内容伸缩。
+  const clampH = HEAD_H + items.length * ROW_H + STATUS_H + PANEL_PAD;
+  const pos = clampMenuXY(x, y, MENU_W, clampH, window.innerWidth, window.innerHeight);
 
   const copy = () => {
     void writeClipboardText(text).then((ok) => {

app/src/hooks/useNoteSelectionActions.test.ts

@@ -73,4 +73,27 @@ describe("useNoteSelectionActions", () => {
     expect(invokeMock).not.toHaveBeenCalled();
     expect(notify).not.toHaveBeenCalled();
   });
+
+  it("选中笔记变化 → 模型卡对话框随旧笔记快照关闭（旧 excerpt 不配新 noteId——审查 P2-12）", () => {
+    const { result, rerender } = renderHook<ReturnType<typeof useNoteSelectionActions>, { noteId: number | null }>(
+      ({ noteId }) =>
+        useNoteSelectionActions({ noteId, onChanged: vi.fn(), notify: vi.fn() }),
+      { initialProps: { noteId: 1 } },
+    );
+    act(() => result.current.handleSelectionAction("toModelCard", "甲笔记选中片段"));
+    expect(result.current.modelDialog).toEqual({ excerpt: "甲笔记选中片段" });
+    // 切笔记（列表选择另一篇——右栏 note 对象更换）
+    rerender({ noteId: 2 });
+    expect(result.current.modelDialog).toBeNull();
+    // 关闭选中（selected→null：删除/切空态）同样关闭
+    act(() => result.current.openModelCard());
+    expect(result.current.modelDialog).toEqual({ excerpt: "" });
+    rerender({ noteId: null });
+    expect(result.current.modelDialog).toBeNull();
+    // noteId 不变时打开/关闭照常（对话框生命周期不受 effect 干扰）
+    act(() => result.current.openModelCard());
+    expect(result.current.modelDialog).toEqual({ excerpt: "" });
+    act(() => result.current.closeModelCard());
+    expect(result.current.modelDialog).toBeNull();
+  });
 });

app/src/hooks/useNoteSelectionActions.ts

@@ -10,7 +10,7 @@
  *              预填**（≤200 单行化截断，组内 model 卡唯一生成链防双轨不变）。
  *              复制/全选/加入行动是宿主就地动作，不经本 hook。
  */
-import { useCallback, useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import {
   SNIPPET_MAX,
@@ -33,6 +33,11 @@ export function useNoteSelectionActions({ noteId, onChanged, notify }: Options)
   // 转问题幂等闸（连点菜单项防双写——命令本身无副作用需求，纯 UI 防抖）
   const questionBusyRef = useRef(false);
 
+  // 批 8 审查 P2-12：对话框快照（excerpt + noteId 上下文）随选中笔记失效——
+  // 切笔记后旧 excerpt 不得配新 noteId 打开（ModelCardDialogSlot 只做接线，
+  // 关闭语义必须收敛在状态持有者）；含 selected→null（关闭/删除笔记）路径
+  useEffect(() => { setModelDialog(null); }, [noteId]);
+
   /** header 🧠 模型卡入口（无选区上下文——excerpt 空预填保持原行为） */
   const openModelCard = useCallback(() => setModelDialog({ excerpt: "" }), []);
 

app/src/utils/clipboardWrite.test.ts

@@ -55,4 +55,27 @@ describe("writeClipboardText", () => {
     });
     await expect(writeClipboardText("x")).resolves.toBe(false);
   });
+
+  it("兜底路径不毁宿主选区：removeChild 后原 Range 恢复（审查 P3-1）", async () => {
+    Object.defineProperty(navigator, "clipboard", { configurable: true, value: undefined });
+    stubExecCommand(() => true);
+    // 宿主预置文档选区（阅读态正文高亮 / 编辑态光标锚定同经文档 Selection）
+    const host = document.createElement("div");
+    host.textContent = "宿主选中文字";
+    document.body.appendChild(host);
+    const sel = window.getSelection();
+    expect(sel).toBeTruthy();
+    const range = document.createRange();
+    range.selectNodeContents(host);
+    sel!.removeAllRanges();
+    sel!.addRange(range);
+    expect(sel!.toString()).toBe("宿主选中文字");
+    await expect(writeClipboardText("片段")).resolves.toBe(true);
+    // ta.select() 覆盖 + 兜底 textarea 移除后——原选区按快照恢复，无残留
+    expect(sel!.rangeCount).toBe(1);
+    expect(sel!.toString()).toBe("宿主选中文字");
+    expect(sel!.anchorNode).toBe(host);
+    expect(document.querySelectorAll("textarea")).toHaveLength(0);
+    document.body.removeChild(host);
+  });
 });