mirror of
https://github.com/multica-ai/multica.git
synced 2026-07-26 12:35:35 +02:00
* feat(editor): support text highlight (==text==) in description & comments Adds a single-color (yellow) text highlight mark to the shared rich-text editor, round-tripped through stored Markdown as ==text==. - HighlightExtension: @tiptap/extension-highlight + @tiptap/markdown hooks (markdownTokenizer/parseMarkdown/renderMarkdown) so ==text== <-> <mark> round-trips; inner inline formatting preserved via inlineTokens. - Bubble menu: highlight toggle button (Mod-Shift-H), i18n in 4 locales. - Read-only renderer: highlightToHtml lowers ==text== -> <mark> (skips code and math); rehype-sanitize schema whitelists <mark>. Nested Markdown inside a highlight still parses via the existing rehype-raw step. - prose.css: single yellow <mark> style, legible in light/dark. Pinned @tiptap/extension-highlight to exact 3.22.1 to match @tiptap/core (>=3.23 expects a getStyleProperty export core 3.22.1 doesn't have). Web/desktop only. Mobile (native md4c, no == syntax, no custom renderers) is tracked as a follow-up. MUL-2934. Tests: editor round-trip (cross-process serialization protocol), readonly <mark> rendering + sanitize, and the ==->mark transform incl. code-skip. Co-authored-by: multica-agent <github@multica.ai> * fix(editor): align highlight boundary rules across editor & readonly Addresses two boundary bugs from review (PR #3661): 1. A == inside inline code/math could close a highlight when the opening == was outside the literal span (e.g. ==a `b==c` d== wrongly became <mark>a `b</mark>c` d==). Both the editor tokenizer's lazy regex and the readonly transform only guarded the opening fence, not the closing one. 2. The readonly transform matched across blank lines (==a\n\nb==) while the editor lexes those as two literal paragraphs — a storage↔editor↔readonly mismatch. Fix: extract one shared matcher (utils/highlight-match.ts) used by BOTH the editor tokenizer and the readonly lowering, so the rules can't drift. It skips fences that fall inside code/math literal ranges (open or close) and caps the inner span at the first blank line. Tests: shared-matcher unit tests + both repros covered on the editor (round-trip/HTML) and readonly (transform + rendered DOM) sides. Co-authored-by: multica-agent <github@multica.ai> * fix(editor): handle CRLF in highlight blank-line boundary BLANK_LINE_RE only matched LF, so a CRLF blank line (==a\r\n\r\nb==) was not recognized as a block boundary and got highlighted. Widen to \r?\n[ \t]*\r?\n. Tests: CRLF blank-line (no highlight) + CRLF soft-break (still highlights) on the matcher, readonly transform, and editor sides. Co-authored-by: multica-agent <github@multica.ai> --------- Co-authored-by: Lambda <lambda@multica.ai> Co-authored-by: multica-agent <github@multica.ai>
73 lines
2.2 KiB
TypeScript
73 lines
2.2 KiB
TypeScript
import { describe, it, expect } from "vitest";
|
|
import { matchHighlightAt, findLiteralRanges } from "./highlight-match";
|
|
|
|
/** Convenience: match at the first `==` and return the inner text, or null. */
|
|
function inner(text: string): string | null {
|
|
const i = text.indexOf("==");
|
|
if (i === -1) return null;
|
|
const m = matchHighlightAt(text, i);
|
|
return m ? m.inner : null;
|
|
}
|
|
|
|
describe("matchHighlightAt", () => {
|
|
it("matches a basic highlight at the opening fence", () => {
|
|
const m = matchHighlightAt("==hi==", 0);
|
|
expect(m).toEqual({ end: 6, inner: "hi" });
|
|
});
|
|
|
|
it("returns null when the opening fence is not at i", () => {
|
|
expect(matchHighlightAt("x==hi==", 0)).toBeNull();
|
|
});
|
|
|
|
it("rejects whitespace directly inside the fences", () => {
|
|
expect(inner("== x ==")).toBeNull();
|
|
});
|
|
|
|
it("rejects empty content", () => {
|
|
expect(inner("====")).toBeNull();
|
|
});
|
|
|
|
it("skips a closing == that sits inside inline code", () => {
|
|
// ==a `b==c` d== → inner is the whole `a `b==c` d`, not `a `b`
|
|
expect(inner("==a `b==c` d==")).toBe("a `b==c` d");
|
|
});
|
|
|
|
it("skips a closing == that sits inside inline math", () => {
|
|
expect(inner("==a $b==c$ d==")).toBe("a $b==c$ d");
|
|
});
|
|
|
|
it("does not open a highlight whose opening == is inside inline code", () => {
|
|
expect(inner("`x==y==z`")).toBeNull();
|
|
});
|
|
|
|
it("does not cross a blank line", () => {
|
|
expect(inner("==a\n\nb==")).toBeNull();
|
|
});
|
|
|
|
it("allows a soft line break inside a block", () => {
|
|
expect(inner("==a\nb==")).toBe("a\nb");
|
|
});
|
|
|
|
it("does not cross a CRLF blank line", () => {
|
|
expect(inner("==a\r\n\r\nb==")).toBeNull();
|
|
});
|
|
|
|
it("allows a CRLF soft line break inside a block", () => {
|
|
expect(inner("==a\r\nb==")).toBe("a\r\nb");
|
|
});
|
|
|
|
it("matches the nearest valid closing fence", () => {
|
|
// first valid close wins; trailing == is left over
|
|
expect(matchHighlightAt("==a==b==", 0)).toEqual({ end: 5, inner: "a" });
|
|
});
|
|
});
|
|
|
|
describe("findLiteralRanges", () => {
|
|
it("treats == inside a fenced block as literal", () => {
|
|
const text = "```\n==x==\n```";
|
|
const ranges = findLiteralRanges(text);
|
|
const fencePos = text.indexOf("==x==");
|
|
expect(ranges.some((r) => fencePos >= r.start && fencePos < r.end)).toBe(true);
|
|
});
|
|
});
|