修复评审器跨组件修改项跳转丢失并展开完整文档视图

- DiffView 聚焦 effect 依赖补上 before/after:stage 文本到达、
  MergeView 重建后重新应用选区和滚动,跨组件点击不再停在顶部;
- 非可编辑面板加 drawSelection,聚焦范围在浏览器中可见;
- 移除 collapseUnchanged,评审始终可读完整未改动段落;
- 滚动容器移到 .cm-mergeView 外层,编辑器高度自适应内容;
- 新增 3 项 Vitest 覆盖折叠移除与聚焦时序,共 9 项通过;
- README 与 explanation 同步当前检查数量。
This commit is contained in:
2026-08-24 08:56:46 +08:00
parent ac798a2610
commit efc1313d87
6 changed files with 99 additions and 14 deletions
+78
View File
@@ -1,8 +1,22 @@
import { render, screen } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import { EditorView } from "@codemirror/view";
import { DiffView } from "../src/client/DiffView.js";
function leftPaneSelection(): { from: number; to: number } | null {
const pane = document.querySelector(".diff-host .cm-editor");
if (pane === null) {
return null;
}
const view = EditorView.findFromDOM(pane as HTMLElement);
if (view === null) {
return null;
}
const { from, to } = view.state.selection.main;
return { from, to };
}
describe("DiffView", () => {
it("keeps Markdown and raw HTML as inert editor text", () => {
render(
@@ -18,4 +32,68 @@ describe("DiffView", () => {
expect(document.querySelector("img")).toBeNull();
expect(document.querySelector("script")).toBeNull();
});
it("keeps long unchanged sections available in the full document view", () => {
const before = Array.from({ length: 30 }, (_, index) => `line ${index + 1}`);
const after = [...before];
after[14] = "changed line 15";
render(
<DiffView
before={before.join("\n")}
after={after.join("\n")}
beforeLabel="清洗前"
afterLabel="清洗后"
/>,
);
expect(document.querySelector(".cm-collapsedLines")).toBeNull();
});
it("re-applies the focus selection after the compared texts change", () => {
const longText = (mark: string) =>
Array.from({ length: 30 }, (_, index) => (index === 14 ? mark : `line ${index + 1}`)).join("\n");
const { rerender } = render(
<DiffView before={longText("old")} after={longText("new")} beforeLabel="清洗前" afterLabel="清洗后" />,
);
// 模拟点击跨组件修改项:focusRange 先落在旧文本上,stage 文本随后到达。
rerender(
<DiffView
before={longText("old")}
after={longText("new")}
beforeLabel="组件 1 执行前"
afterLabel="组件 1 执行后"
focusRange={{ start: 58, end: 61 }}
/>,
);
rerender(
<DiffView
before={longText("stage before")}
after={longText("stage after")}
beforeLabel="组件 2 执行前"
afterLabel="组件 2 执行后"
focusRange={{ start: 58, end: 71 }}
/>,
);
// 最终视图必须是组件 2 的文本,且选区重新落在新文本的目标范围上。
expect(screen.getByRole("region", { name: "组件 2 执行前与组件 2 执行后对比" })).toBeInTheDocument();
expect(leftPaneSelection()).toEqual({ from: 58, to: 71 });
});
it("applies the focus selection when it arrives with the initial texts", () => {
render(
<DiffView
before={"a\nb"}
after={"a\nc"}
beforeLabel="清洗前"
afterLabel="清洗后"
focusRange={{ start: 0, end: 1 }}
/>,
);
expect(leftPaneSelection()).toEqual({ from: 0, to: 1 });
});
});