memos/web/tests/editor-controller.test.ts
johnnyjoygh 5a73d7d3e5 refactor: rebuild the editor on CodeMirror as decorated source
Rebuild the memo editor as a single CodeMirror 6 "decorated source"
editor. The document is the raw markdown, stored verbatim and styled in
place (markers stay visible), so the editor never serializes a tree back
to markdown — removing the round-trip fidelity bug class (inline images,
setext headings, ordered-list indentation, HTML entities) that the old
editor needed per-case patches for.

- MemoEditor/Editor: CodeMirror 6 + lang-markdown (GFM). Tokens, heading
  lines, #tag/@mention, and the autocomplete popover are styled in plain
  CSS (Editor/editor.css) with theme tokens, not a CSS-in-JS theme.
- Tab/Shift-Tab nest/outdent list items (marker-aware, ordered items
  renumbered so nesting is CommonMark-valid); Escape blurs; #tag
  autocomplete sourced from useTagCounts.
- Focus-mode toolbar reimplemented as markdown-text ops; active state read
  from the Lezer tree via the backend-agnostic formatting/commands catalog.
- Remove the old serialize-back-to-markdown editor (its Editor dir,
  PlainEditor, the editor-mode system) and its now-unused dependencies
  (marked, textarea-caret, and the rich-text editor packages).
- Consolidate toolbar components under Toolbar/. Read-only MemoContent
  rendering is unchanged.
2026-06-28 22:59:14 +08:00

32 lines
1.1 KiB
TypeScript

import { EditorState } from "@codemirror/state";
import { EditorView } from "@codemirror/view";
import { describe, expect, it } from "vitest";
import { createController } from "@/components/MemoEditor/Editor/controller";
function view(doc = "") {
return new EditorView({ state: EditorState.create({ doc }) });
}
describe("source editor controller", () => {
it("round-trips markdown verbatim, including previously-lossy inputs", () => {
const v = view();
const c = createController(v, {} as never);
for (const md of ["![a](x.png)", "Title\n===", "1. a\n 1. b\n 1. c", "a b"]) {
c.setMarkdown(md);
expect(c.getMarkdown()).toBe(md);
}
});
it("reports emptiness on whitespace", () => {
const c = createController(view(" \n "), {} as never);
expect(c.isEmpty()).toBe(true);
});
it("inserts markdown as its own block", () => {
const v = view("alpha");
const c = createController(v, {} as never);
v.dispatch({ selection: { anchor: 5 } });
c.insertMarkdown("beta");
expect(c.getMarkdown()).toBe("alpha\n\nbeta");
});
});