@moda-editor/core 0.1.3 → 0.2.0

package/dist/conformance.js

@@ -1,1749 +1,4 @@
-import { describe, expect, it } from "vitest";
-import { createEditor } from "./editor/editor.js";
-import { createDoc, createText } from "./model/node.js";
-import { parseHTML } from "./parse/html.js";
-import { starterExtensions } from "./presets/starter.js";
-import { point, pointEq, textSelection } from "./state/selection.js";
-import { leafPoint } from "./state/apply.js";
-/** 마운트 헬퍼 — 매 테스트마다 새 픽스처+새 인스턴스 */
-async function mountSpecWidget(mount) {
-    const items = [
-        { id: 1, label: "사과" },
-        { id: 2, label: "바나나" },
-        { id: 3, label: "사과파이" },
-    ];
-    const m = await mount({
-        items,
-        getItemText: (i) => i.label,
-    });
-    const flush = async () => {
-        await m.flush?.();
-    };
-    return { ...m, items, flush };
-}
-export function runWidgetConformance(label, mount) {
-    describe(`${label} 렌더 계약`, () => {
-        it("검색 입력·목록·카운터를 렌더한다", async () => {
-            const { el, destroy } = await mountSpecWidget(mount);
-            expect(el.querySelector(".me-search")).toBeTruthy();
-            expect(el.querySelectorAll(".me-item").length).toBe(3);
-            expect(el.querySelector(".me-count")?.textContent).toContain("3");
-            destroy();
-        });
-        it("검색 입력에 타이핑하면 목록이 필터된다", async () => {
-            const { el, flush, destroy } = await mountSpecWidget(mount);
-            const input = el.querySelector(".me-search");
-            // React의 controlled input은 .value 직접 대입을 추적하지 못한다 —
-            // 네이티브 setter로 우회해 input 이벤트가 실제 타이핑처럼 보이게 한다
-            const setValue = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value").set;
-            setValue.call(input, "사과");
-            input.dispatchEvent(new Event("input", { bubbles: true }));
-            await flush();
-            // Vue2는 보간 주변에 공백을 렌더한다 — trim으로 렌더러 편차를 흡수
-            const labels = [...el.querySelectorAll(".me-item")].map((n) => n.textContent?.trim());
-            expect(labels).toEqual(["사과", "사과파이"]);
-            expect(el.querySelector(".me-count")?.textContent).toContain("2");
-            destroy();
-        });
-        it("destroy 후 루트를 제거한다", async () => {
-            const { el, destroy } = await mountSpecWidget(mount);
-            destroy();
-            expect(el.querySelector(".me-list")).toBeNull();
-        });
-    });
-}
-/** 스펙용 에디터 픽스처 — 스타터 스키마 + 2블록 문서 */
-function specEditor() {
-    const doc = createDoc([
-        {
-            type: "paragraph",
-            content: [createText("안녕"), createText(" 굵게", [{ type: "bold" }])],
-        },
-        { type: "paragraph", content: [createText("둘째")] },
-    ]);
-    return createEditor({ doc, extensions: starterExtensions() });
-}
-/**
- * 에디터 어댑터 공통 DOM 계약 — 5개 렌더러가 같은 구조를 출력한다:
- *   .me-root > .me-editor[contenteditable][data-me-path=""]
- *     > [data-me-path="0"], [data-me-path="1"] … 블록 엘리먼트
- * 트랜잭션 디스패치 → DOM 갱신, destroy → 정리까지 검증한다.
- */
-export function runEditorConformance(label, mount) {
-    describe(`${label} 에디터 렌더 계약`, () => {
-        it("contenteditable 영역과 블록 엘리먼트를 렌더한다", async () => {
-            const editor = specEditor();
-            const { el, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            expect(editable).toBeTruthy();
-            expect(editable.getAttribute("contenteditable")).toBe("true");
-            expect(editable.getAttribute("data-me-path")).toBe("");
-            // 직계 자식만 — 텍스트 노드에도 data-me-path가 붙으므로
-            const blocks = editable.querySelectorAll(":scope > [data-me-path]");
-            expect(blocks.length).toBe(2);
-            expect(blocks[0].getAttribute("data-me-path")).toBe("0");
-            expect(blocks[0].textContent).toBe("안녕 굵게");
-            destroy();
-        });
-        it("bold 마크가 <strong>으로 렌더된다", async () => {
-            const editor = specEditor();
-            const { el, destroy } = await mount({ editor });
-            const strong = el.querySelector("[data-me-path='0,1']");
-            expect(strong?.tagName.toLowerCase()).toBe("strong");
-            expect(strong?.textContent).toBe(" 굵게");
-            destroy();
-        });
-        it("디스패치한 텍스트 삽입이 DOM에 반영된다", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([0, 0], 2)))
-                .insertText("!"));
-            await flush?.();
-            const para = el.querySelector("[data-me-path='0']");
-            expect(para.textContent).toBe("안녕! 굵게");
-            destroy();
-        });
-        it("캐럿의 최상위 블록에 활성 라인이 달린다 (Ace me-line-active)", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([1, 0], 0))));
-            await flush?.();
-            let active = el.querySelectorAll(".me-editor > .me-line-active");
-            expect(active.length).toBe(1);
-            expect(active[0].getAttribute("data-me-path")).toBe("1");
-            // 캐럿이 다른 블록으로 가면 이전 블록의 표시는 지워진다
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([0, 0], 0))));
-            await flush?.();
-            active = el.querySelectorAll(".me-editor > .me-line-active");
-            expect(active.length).toBe(1);
-            expect(active[0].getAttribute("data-me-path")).toBe("0");
-            destroy();
-        });
-        it("Enter(split)로 블록이 둘로 나뉜다", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([0, 0], 1)))
-                .split());
-            await flush?.();
-            const blocks = el.querySelectorAll(".me-editor > [data-me-path]");
-            expect(blocks.length).toBe(3);
-            destroy();
-        });
-        it("빈 블록은 br 자리표시자로 렌더된다 (높이/캐럿 자리 확보)", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = editor.state.doc;
-            const last = doc.content.length - 1;
-            // 문서 끝에 빈 문단 삽입 — 보이지 않는 빈 블록 회귀 계약
-            editor.dispatch(editor.state
-                .tr()
-                .insertNode({ path: [], offset: last + 1 }, { type: "paragraph", content: [] }));
-            await flush?.();
-            const empty = el.querySelector(`[data-me-path='${last + 1}']`);
-            expect(empty.querySelector("br")).not.toBeNull();
-            destroy();
-        });
-        it("HTML 붙여넣기는 sanitize+파싱되어 인라인으로 삽입된다", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const nodes = parseHTML(`<p><b>외부</b>텍스트<script>alert(1)</script><i>기울임</i></p>`, editor.state.schema);
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([1, 0], 2)))
-                .insertSlice(point([1, 0], 2), nodes));
-            await flush?.();
-            const para = el.querySelector("[data-me-path='1']");
-            // 스크립트는 걸러지고 마크는 보존된다
-            expect(para.textContent).toBe("둘째외부텍스트기울임");
-            expect(para.querySelector("strong")?.textContent).toBe("외부");
-            expect(para.querySelector("em")?.textContent).toBe("기울임");
-            expect(para.querySelector("script")).toBeNull();
-            destroy();
-        });
-        it("undo/redo로 DOM이 되돌아간다", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const para = () => el.querySelector("[data-me-path='1']");
-            const before = para().textContent;
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([1, 0], 2)))
-                .insertText("X"));
-            await flush?.();
-            expect(para().textContent).toBe("둘째X");
-            editor.commands.undo();
-            await flush?.();
-            expect(para().textContent).toBe(before);
-            editor.commands.redo();
-            await flush?.();
-            expect(para().textContent).toBe("둘째X");
-            destroy();
-        });
-        it("IME 조합 텍스트가 doc에 흡수된다", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            const doc = el.ownerDocument;
-            const sel = doc.getSelection();
-            // 브라우저가 조합 중 하듯: compositionstart → DOM 직접 변경 →
-            // 캐럿 이동 → compositionend (조합 중 selectionchange는 무시된다)
-            editable.dispatchEvent(new Event("compositionstart"));
-            const holder = editable.querySelector("[data-me-path='1,0']");
-            // 렌더러마다 빈 텍스트/주석 노드가 섞일 수 있어 내용 있는
-            // 텍스트 노드를 찾는다
-            const walker = doc.createTreeWalker(holder, 4 /* NodeFilter.SHOW_TEXT */);
-            let text = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent)
-                    text = n;
-            }
-            expect(text).toBeTruthy();
-            sel.setBaseAndExtent(text, 2, text, 2);
-            text.textContent = "둘째한글";
-            sel.setBaseAndExtent(text, 4, text, 4);
-            editable.dispatchEvent(new Event("compositionend"));
-            // 흡수는 다음 태스크 — 타이머 + 어댑터 플러시 대기
-            await new Promise((r) => setTimeout(r, 0));
-            await flush?.();
-            expect(editor.state.doc.content[1]?.content?.[0]?.text).toBe("둘째한글");
-            expect(editable.querySelector("[data-me-path='1']").textContent).toBe("둘째한글");
-            destroy();
-        });
-        it("IME 커밋 Enter — 흡수 대기 중 insertParagraph는 doc 분할로 처리한다", async () => {
-            // Chromium은 조합 커밋 Enter에 compositionend 직후 insertParagraph
-            // beforeinput을 보낸다. composing 플래그가 아직 살아있는 이 창에
-            // 이 입력을 그냥 리턴하면 브라우저가 네이티브 split으로
-            // data-me-path가 복제된 블록을 만들고 doc과 영구히 어긋난다 —
-            // "Enter를 두 번 쳐야 내려간다" 회귀의 원인.
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            const doc = el.ownerDocument;
-            const sel = doc.getSelection();
-            editable.dispatchEvent(new Event("compositionstart"));
-            const holder = editable.querySelector("[data-me-path='1,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let text = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent)
-                    text = n;
-            }
-            text.textContent = "둘째한글";
-            sel.setBaseAndExtent(text, 4, text, 4);
-            editable.dispatchEvent(new Event("compositionend"));
-            // 흡수 타이머가 돌기 전 — 같은 태스크에 도착하는 커밋-Enter의
-            // insertParagraph를 시뮬레이션한다
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperty(ev, "inputType", {
-                value: "insertParagraph",
-            });
-            Object.defineProperty(ev, "data", { value: null });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            // 1) 커밋 텍스트가 doc에 흡수됐다
-            expect(editor.state.doc.content[1]?.content?.[0]?.text).toBe("둘째한글");
-            // 2) Enter가 한 번에 새 문단을 만들었다 — 커밋 끝점에서 분할
-            const para2 = editor.state.doc.content[2];
-            expect(para2?.type).toBe("paragraph");
-            expect((para2?.content ?? []).map((c) => c.text ?? "").join("")).toBe("");
-            // 3) 네이티브 split 흔적 — 복제된 data-me-path 블록이 없다
-            expect(editable.querySelectorAll("[data-me-path='2']").length).toBe(1);
-            destroy();
-        });
-        it("빈 블록의 IME — 브라우저가 br을 지워도 리렌더가 안정적이다", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            const doc = el.ownerDocument;
-            // 빈 문단 — <br> 자리표시자가 들어간다
-            editor.dispatch(editor.state
-                .tr()
-                .insertNode({ path: [], offset: 2 }, { type: "paragraph", content: [createText("")] }));
-            await flush?.();
-            const holder = editable.querySelector("[data-me-path='2,0']");
-            // 실제 Chromium IME 재현 — 브라우저가 조합 중 <br>을 직접 지우고
-            // 조합 텍스트를 넣는다. vnode와 어긋난 DOM 위에서 프레임워크
-            // 리컨실이 removeChild 크래시로 터졌던 회귀 (React).
-            editable.dispatchEvent(new Event("compositionstart"));
-            const text = doc.createTextNode("글씨");
-            const br = holder.querySelector("br");
-            if (br)
-                holder.replaceChild(text, br);
-            else
-                holder.appendChild(text);
-            doc.getSelection().setBaseAndExtent(text, 2, text, 2);
-            editable.dispatchEvent(new Event("compositionend"));
-            await new Promise((r) => setTimeout(r, 0));
-            await flush?.();
-            // 예외 없이 doc에 흡수 + DOM 일치까지 완료돼야 한다
-            expect(editor.state.doc.content[2]?.content?.[0]?.text).toBe("글씨");
-            expect(editable.querySelector("[data-me-path='2']").textContent).toBe("글씨");
-            destroy();
-        });
-        it("한 블록만 바뀌면 나머지 블록의 DOM 노드를 보존한다", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const p1 = el.querySelector("[data-me-path='1']");
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([0, 0], 0)))
-                .insertText("X"));
-            await flush?.();
-            // 구조 공유 + 참조 메모이즈 — 미변경 블록의 DOM 엘리먼트 재사용
-            expect(el.querySelector("[data-me-path='1']")).toBe(p1);
-            expect(el.querySelector("[data-me-path='0']").textContent).toContain("X안녕");
-            destroy();
-        });
-        it("셀렉션만 바뀌는 디스패치는 DOM 노드를 보존한다", async () => {
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const p0 = el.querySelector("[data-me-path='0']");
-            const p1 = el.querySelector("[data-me-path='1']");
-            editor.dispatch(editor.state.tr().setSelection(textSelection(point([1, 0], 1))));
-            await flush?.();
-            expect(el.querySelector("[data-me-path='0']")).toBe(p0);
-            expect(el.querySelector("[data-me-path='1']")).toBe(p1);
-            destroy();
-        });
-        it("커스텀 노드는 nodeView 컴포넌트로 렌더된다", async () => {
-            // testview 타입을 아는 스키마 + 해당 타입 블록이 있는 문서
-            const testview = {
-                name: "testview",
-                nodes: {
-                    testview: {
-                        group: "block",
-                        atom: true,
-                        attrs: { label: { default: "" } },
-                        toDOM: () => ({ tag: "div" }),
-                    },
-                },
-            };
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("앞")] },
-                    { type: "testview", attrs: { label: "커스텀노드" } },
-                ]),
-                extensions: [...starterExtensions(), testview],
-            });
-            const { el, destroy } = await mount({
-                editor,
-                nodeViews: { testview: true },
-            });
-            const wrap = el.querySelector(".me-node-view");
-            expect(wrap).toBeTruthy();
-            // 래퍼가 DOM 계약(data-me-path)을 유지한다
-            expect(wrap.getAttribute("data-me-path")).toBe("1");
-            expect(wrap.getAttribute("contenteditable")).toBe("false");
-            expect(wrap.querySelector(".me-custom-view")?.textContent).toContain("커스텀노드");
-            destroy();
-        });
-        it("콘텐츠 있는 노드 뷰는 .me-node-content 아울렛에 자식을 렌더한다", async () => {
-            // 비-atom 커스텀 블록 — 안쪽이 실제로 편집되는 영역이다.
-            // DOM 계약: .me-node-view(ce=false) > 크롬 >
-            //   .me-node-content[data-me-path](ce=true) > AST 자식 1:1
-            const blockview = {
-                name: "blockview",
-                nodes: {
-                    blockview: {
-                        group: "block",
-                        content: "block+",
-                        toDOM: () => ({ tag: "div" }),
-                    },
-                },
-            };
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("앞")] },
-                    {
-                        type: "blockview",
-                        content: [
-                            { type: "paragraph", content: [createText("안쪽")] },
-                        ],
-                    },
-                ]),
-                extensions: [...starterExtensions(), blockview],
-            });
-            const { el, flush, destroy } = await mount({
-                editor,
-                nodeViews: { blockview: true },
-            });
-            const wrap = el.querySelector(".me-node-view");
-            expect(wrap).toBeTruthy();
-            expect(wrap.getAttribute("contenteditable")).toBe("false");
-            // 래퍼는 data-me-path를 갖지 않는다 — 아울렛이 갖는다
-            expect(wrap.getAttribute("data-me-path")).toBeNull();
-            const content = wrap.querySelector(".me-node-content");
-            expect(content).toBeTruthy();
-            expect(content.getAttribute("data-me-path")).toBe("1");
-            expect(content.getAttribute("contenteditable")).toBe("true");
-            // AST 자식이 아울렛 직계 자식과 1:1
-            expect(content.children.length).toBe(1);
-            expect(content.querySelector("[data-me-path='1,0']").textContent).toBe("안쪽");
-            // 안쪽 자식에 디스패치한 편집이 DOM에 반영된다 — 렌더러마다 아울렛이
-            // 통째 교체될 수 있어 리렌더 후 재질의한다
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([1, 0, 0], 2)))
-                .insertText("!"));
-            await flush?.();
-            expect(el.querySelector(".me-node-content [data-me-path='1,0']")
-                .textContent).toBe("안쪽!");
-            destroy();
-        });
-        it("노드 뷰 아울렛은 toDOM 태그/속성을 쓴다 — codeBlock이면 pre[data-language]", async () => {
-            // 코드블록에 nodeView가 붙어도 pre[data-me-path]·data-language
-            // 계약이 유지돼야 구문 하이라이트·셀렉터가 그대로 동작한다
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("앞")] },
-                    {
-                        type: "codeBlock",
-                        attrs: { language: "js" },
-                        content: [createText("const a = 1")],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, destroy } = await mount({
-                editor,
-                nodeViews: { codeBlock: true },
-            });
-            const outlet = el.querySelector(".me-node-content");
-            expect(outlet).toBeTruthy();
-            expect(outlet.tagName).toBe("PRE");
-            expect(outlet.getAttribute("data-me-path")).toBe("1");
-            expect(outlet.getAttribute("data-language")).toBe("js");
-            expect(outlet.getAttribute("contenteditable")).toBe("true");
-            destroy();
-        });
-        it("마크다운 입력 규칙 — `## `는 제목으로, `**x**`는 굵게로 변환된다", async () => {
-            // beforeinput → insertText → applyInputRules의 전체 배선을 검증한다.
-            // happy-dom에는 InputEvent가 없어 프로퍼티를 직접 박은 Event로 대신한다
-            const type = async (el, text, data) => {
-                const doc = el.ownerDocument;
-                const editable = el.querySelector(".me-editor");
-                const holder = editable.querySelector("[data-me-path='0,0']");
-                const walker = doc.createTreeWalker(holder, 4 /* SHOW_TEXT */);
-                let t = null;
-                for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                    if (n.textContent === text)
-                        t = n;
-                }
-                doc.getSelection().setBaseAndExtent(t, text.length, t, text.length);
-                const ev = new Event("beforeinput", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                Object.defineProperties(ev, {
-                    inputType: { value: "insertText" },
-                    data: { value: data },
-                });
-                editable.dispatchEvent(ev);
-            };
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("##")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            await type(el, "##", " ");
-            await flush?.();
-            const h2 = el.querySelector(".me-editor > [data-me-path='0']");
-            expect(h2.tagName.toLowerCase()).toBe("h2");
-            expect(h2.textContent).toBe("");
-            destroy();
-            const editor2 = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("**x*")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const m2 = await mount({ editor: editor2 });
-            await type(m2.el, "**x*", "*");
-            await m2.flush?.();
-            const strong = m2.el.querySelector(".me-editor > [data-me-path='0'] strong");
-            expect(strong?.textContent).toBe("x");
-            m2.destroy();
-        });
-        it("스타터 블록 스키마를 렌더한다 — 목록/인용구/코드/hr/br/링크", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "bulletList",
-                        content: [
-                            {
-                                type: "listItem",
-                                content: [
-                                    { type: "paragraph", content: [createText("가")] },
-                                ],
-                            },
-                        ],
-                    },
-                    {
-                        type: "orderedList",
-                        attrs: { start: 3 },
-                        content: [
-                            {
-                                type: "listItem",
-                                content: [
-                                    { type: "paragraph", content: [createText("나")] },
-                                ],
-                            },
-                        ],
-                    },
-                    {
-                        type: "blockquote",
-                        content: [{ type: "paragraph", content: [createText("다")] }],
-                    },
-                    { type: "codeBlock", content: [createText("라인1\n라인2")] },
-                    { type: "horizontalRule" },
-                    {
-                        type: "paragraph",
-                        content: [
-                            {
-                                type: "text",
-                                text: "링크",
-                                marks: [{ type: "link", attrs: { href: "https://a.b" } }],
-                            },
-                        ],
-                    },
-                    {
-                        type: "paragraph",
-                        content: [
-                            createText("윗줄"),
-                            { type: "hardBreak" },
-                            createText("아랫줄"),
-                        ],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, destroy } = await mount({ editor });
-            expect(el.querySelector("ul[data-me-path='0'] > li > p")?.textContent).toBe("가");
-            const ol = el.querySelector("ol[data-me-path='1']");
-            expect(ol.querySelector("li > p")?.textContent).toBe("나");
-            expect(ol.getAttribute("start")).toBe("3");
-            expect(el.querySelector("blockquote[data-me-path='2'] > p")?.textContent).toBe("다");
-            expect(el.querySelector("pre[data-me-path='3']")?.textContent).toBe("라인1\n라인2");
-            expect(el.querySelector("hr[data-me-path='4']")).toBeTruthy();
-            expect(el.querySelector("a[href='https://a.b']")?.textContent).toBe("링크");
-            // 하드 브레이크는 data-me-path를 갖는 br — bogus br과 구분된다
-            expect(el.querySelector("br[data-me-path='6,1']")).toBeTruthy();
-            destroy();
-        });
-        it("래핑 입력 규칙 — `- `는 ul, `> `는 blockquote, ``` 는 pre", async () => {
-            // beforeinput 경로 — 마크 규칙 계약과 같은 시뮬레이션
-            const type = async (el, text, data) => {
-                const doc = el.ownerDocument;
-                const editable = el.querySelector(".me-editor");
-                const holder = editable.querySelector("[data-me-path='0,0']");
-                const walker = doc.createTreeWalker(holder, 4 /* SHOW_TEXT */);
-                let t = null;
-                for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                    if (n.textContent === text)
-                        t = n;
-                }
-                doc
-                    .getSelection()
-                    .setBaseAndExtent(t, text.length, t, text.length);
-                const ev = new Event("beforeinput", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                Object.defineProperties(ev, {
-                    inputType: { value: "insertText" },
-                    data: { value: data },
-                });
-                editable.dispatchEvent(ev);
-            };
-            const cases = [
-                ["-", "ul[data-me-path='0'] > li > p"],
-                [">", "blockquote[data-me-path='0'] > p"],
-            ];
-            for (const [typed, sel] of cases) {
-                const editor = createEditor({
-                    doc: createDoc([
-                        { type: "paragraph", content: [createText(typed)] },
-                    ]),
-                    extensions: starterExtensions(),
-                });
-                const { el, flush, destroy } = await mount({ editor });
-                await type(el, typed, " ");
-                await flush?.();
-                expect(el.querySelector(sel)).toBeTruthy();
-                destroy();
-            }
-            // ``` + 스페이스 → pre (Tiptap 관례 — 공백이 트리거)
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("```")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            await type(el, "```", " ");
-            await flush?.();
-            expect(el.querySelector("pre[data-me-path='0']")).toBeTruthy();
-            destroy();
-        });
-        it("리스트 아이템 Enter — 새 항목, 빈 항목 Enter — 리스트 탈출", async () => {
-            const fireEnter = async (el, holderSel) => {
-                const doc = el.ownerDocument;
-                const editable = el.querySelector(".me-editor");
-                const holder = editable.querySelector(holderSel);
-                // 내용 있는 텍스트 노드가 있으면 그 끝, 없으면(빈 문단) 홀더 앞
-                const walker = doc.createTreeWalker(holder, 4);
-                let t = null;
-                for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                    if (n.textContent)
-                        t = n;
-                }
-                const sel = doc.getSelection();
-                if (t)
-                    sel.setBaseAndExtent(t, t.textContent.length, t, t.textContent.length);
-                else
-                    sel.setBaseAndExtent(holder, 0, holder, 0);
-                const ev = new Event("beforeinput", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                Object.defineProperty(ev, "inputType", {
-                    value: "insertParagraph",
-                });
-                editable.dispatchEvent(ev);
-            };
-            const mk = () => createEditor({
-                doc: createDoc([
-                    {
-                        type: "bulletList",
-                        content: [
-                            {
-                                type: "listItem",
-                                content: [
-                                    { type: "paragraph", content: [createText("가")] },
-                                ],
-                            },
-                        ],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            // 아이템 끝 Enter → 같은 리스트에 새 아이템
-            {
-                const editor = mk();
-                const { el, flush, destroy } = await mount({ editor });
-                await fireEnter(el, "[data-me-path='0,0,0,0']");
-                await flush?.();
-                expect(el.querySelectorAll("ul > li").length).toBe(2);
-                destroy();
-            }
-            // 빈 아이템 Enter → 아이템이 리스트 밖 문단으로 빠진다
-            {
-                const editor = createEditor({
-                    doc: createDoc([
-                        {
-                            type: "bulletList",
-                            content: [
-                                {
-                                    type: "listItem",
-                                    content: [
-                                        { type: "paragraph", content: [createText("")] },
-                                    ],
-                                },
-                            ],
-                        },
-                    ]),
-                    extensions: starterExtensions(),
-                });
-                const { el, flush, destroy } = await mount({ editor });
-                await fireEnter(el, "[data-me-path='0,0,0,0']");
-                await flush?.();
-                expect(el.querySelector("ul")).toBeNull();
-                expect(el.querySelector(".me-editor > p[data-me-path='0']")).toBeTruthy();
-                destroy();
-            }
-        });
-        it("Shift-Enter는 하드 브레이크를 삽입한다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("ab")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            const doc = el.ownerDocument;
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent === "ab")
-                    t = n;
-            }
-            doc.getSelection().setBaseAndExtent(t, 1, t, 1);
-            editable.dispatchEvent(new KeyboardEvent("keydown", {
-                key: "Enter",
-                shiftKey: true,
-                bubbles: true,
-                cancelable: true,
-            }));
-            await flush?.();
-            expect(el.querySelector("br[data-me-path='0,1']")).toBeTruthy();
-            const kids = editor.state.doc.content[0].content;
-            expect(kids.map((k) => k.type)).toEqual([
-                "text",
-                "hardBreak",
-                "text",
-            ]);
-            destroy();
-        });
-        it("Mod-a는 doc 전체 선택을 만든다 — 중첩 editable이 있어도", async () => {
-            // Chromium은 ce=false 래퍼 안의 editable 아울렛(노드뷰)을 만나면
-            // 네이티브 select-all이 셀렉션을 collapse시킨다 — keydown에서
-            // 가로채 doc 전체 선택을 직접 디스패치한다
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            const ev = new KeyboardEvent("keydown", {
-                key: "a",
-                metaKey: true,
-                bubbles: true,
-                cancelable: true,
-            });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            expect(ev.defaultPrevented).toBe(true);
-            // DOM 복원 후 selectionchange가 리프 좌표로 재동기화한다 —
-            // happy-dom은 Selection 구현이 제한적이라 끝점 오프셋이
-            // 클램프될 수 있어, 앵커=문서 시작 + 비축소 범위를 본다.
-            // DOM 셀렉션 확장 자체는 e2e(감사 — Mod-A)가 검증한다
-            const sel = editor.state.selection;
-            expect(sel.type).toBe("text");
-            if (sel.type === "text") {
-                const start = leafPoint(editor.state.doc, {
-                    path: [],
-                    offset: 0,
-                });
-                expect(leafPoint(editor.state.doc, sel.anchor)).toEqual(start);
-                expect(pointEq(sel.anchor, sel.focus)).toBe(false);
-            }
-            destroy();
-        });
-        it("전체 선택 삭제 후 타이핑은 단일 문단이 된다", async () => {
-            // Cmd+A → 타이핑과 같은 경로 — doc 루트 경계 포인트에
-            // bare text가 들어가는 회귀 방지
-            const editor = specEditor();
-            const { el, flush, destroy } = await mount({ editor });
-            editor.dispatch(editor.state
-                .tr()
-                .delete({ anchor: point([], 0), focus: point([], 2) })
-                .insertText("Z", point([], 0)));
-            await flush?.();
-            const blocks = el.querySelectorAll(".me-editor > [data-me-path]");
-            expect(blocks.length).toBe(1);
-            expect(blocks[0].tagName.toLowerCase()).toBe("p");
-            expect(blocks[0].textContent).toBe("Z");
-            expect(editor.state.doc.content[0].type).toBe("paragraph");
-            destroy();
-        });
-        it("확장 스키마 렌더 — 표/이미지/할일/정렬/첨자/색상 마크", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "table",
-                        content: [
-                            {
-                                type: "tableRow",
-                                content: [
-                                    {
-                                        type: "tableCell",
-                                        content: [
-                                            { type: "paragraph", content: [createText("셀")] },
-                                        ],
-                                    },
-                                ],
-                            },
-                        ],
-                    },
-                    {
-                        type: "image",
-                        attrs: { src: "https://x.y/a.png", alt: "이미지" },
-                    },
-                    {
-                        type: "taskList",
-                        content: [
-                            {
-                                type: "taskItem",
-                                attrs: { checked: true },
-                                content: [
-                                    { type: "paragraph", content: [createText("할일")] },
-                                ],
-                            },
-                        ],
-                    },
-                    {
-                        type: "paragraph",
-                        attrs: { align: "center" },
-                        content: [
-                            {
-                                type: "text",
-                                text: "첨자",
-                                marks: [{ type: "superscript" }],
-                            },
-                            {
-                                type: "text",
-                                text: "색",
-                                marks: [{ type: "textColor", attrs: { color: "#f00" } }],
-                            },
-                        ],
-                    },
-                    {
-                        type: "codeBlock",
-                        attrs: { language: "ts" },
-                        content: [createText("const x = 1")],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, destroy } = await mount({ editor });
-            expect(el.querySelector("table.me-table[data-me-path='0'] > tr > td > p")?.textContent).toBe("셀");
-            const img = el.querySelector("img[data-me-path='1']");
-            expect(img).toBeTruthy();
-            expect(img.getAttribute("src")).toBe("https://x.y/a.png");
-            const task = el.querySelector("ul.me-tasks[data-me-path='2'] > li.me-task");
-            expect(task).toBeTruthy();
-            expect(task.getAttribute("data-checked")).toBe("true");
-            const para = el.querySelector("p[data-me-path='3']");
-            expect(para.getAttribute("style")).toContain("text-align: center");
-            expect(para.querySelector("sup")?.textContent).toBe("첨자");
-            const colored = para.querySelector("span[style*='color']");
-            expect(colored?.textContent).toBe("색");
-            const pre = el.querySelector("pre[data-me-path='4']");
-            expect(pre?.getAttribute("data-language")).toBe("ts");
-            // 구문 하이라이트 — 텍스트가 .me-tok-* 토큰 스팬으로 쪼개진다.
-            // doc은 오염되지 않는다: textContent는 원문 그대로 (뷰 데코레이션)
-            expect(pre?.querySelector(".me-tok-keyword")?.textContent).toBe("const");
-            expect(pre?.textContent).toBe("const x = 1");
-            // 줄 번호 거터 — 토큰이 줄 단위 .me-cl로 묶인다 (한 줄이면 1개)
-            expect(pre?.querySelectorAll(".me-cl").length).toBe(1);
-            destroy();
-        });
-        it("코드블록 Tab/Shift-Tab — 줄 단위 들여쓰기/내어쓰기", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "codeBlock",
-                        content: [createText("one\ntwo")],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            // 캐럿을 두 번째 줄(two)에 놓는다 — 하이라이트 토큰 스팬 안의
-            // 실제 텍스트 노드로 내려간다 (매핑은 텍스트 누적이라 안전)
-            const holder = el.querySelector("pre[data-me-path='0'] > [data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4 /* SHOW_TEXT */);
-            // 줄 구조 — "one\ntwo"는 2개 .me-cl, 개행은 줄 끝 텍스트로 보존
-            expect(el.querySelectorAll("pre .me-cl").length).toBe(2);
-            // 두 번째 줄(two)의 텍스트 노드를 찾아 전체를 선택한다
-            let text = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent === "two") {
-                    text = n;
-                    break;
-                }
-            }
-            doc.getSelection().setBaseAndExtent(text, 0, text, 3);
-            doc.dispatchEvent(new Event("selectionchange"));
-            await flush?.();
-            editable.dispatchEvent(new KeyboardEvent("keydown", {
-                key: "Tab",
-                bubbles: true,
-                cancelable: true,
-            }));
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("one\n\ttwo");
-            editable.dispatchEvent(new KeyboardEvent("keydown", {
-                key: "Tab",
-                shiftKey: true,
-                bubbles: true,
-                cancelable: true,
-            }));
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("one\ntwo");
-            destroy();
-        });
-        it("코드블록 Enter — 자동 들여쓰기(Ace) + 공백 꼬리 Enter 탈출", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "codeBlock",
-                        content: [createText("  const a = 1")],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const fireEnter = () => {
-                const holder = editable.querySelector("pre[data-me-path='0'] [data-me-path='0,0']");
-                // 마지막 텍스트 노드 끝에 캐럿
-                const walker = doc.createTreeWalker(holder, 4);
-                let t = null;
-                for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                    if (n.textContent)
-                        t = n;
-                }
-                const sel = doc.getSelection();
-                sel.setBaseAndExtent(t, t.textContent.length, t, t.textContent.length);
-                const ev = new Event("beforeinput", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                Object.defineProperty(ev, "inputType", {
-                    value: "insertParagraph",
-                });
-                editable.dispatchEvent(ev);
-            };
-            fireEnter();
-            await flush?.();
-            // 들여쓰기 복사 — 새 줄이 같은 선행 공백으로 시작 (Ace 관례)
-            expect(el.querySelector("pre").textContent).toBe("  const a = 1\n  ");
-            // 공백뿐인 꼬리 줄에서 Enter — 꼬리를 지우고 본문으로 탈출
-            fireEnter();
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("  const a = 1");
-            expect(el.querySelector("p[data-me-path='1']")).toBeTruthy();
-            destroy();
-        });
-        it("코드블록 자동 쌍·타입오버·쌍 삭제 (Ace behaviours 관례)", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "codeBlock", content: [createText("x")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const fire = (inputType, data) => {
-                const ev = new Event("beforeinput", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                Object.defineProperties(ev, {
-                    inputType: { value: inputType },
-                    data: { value: data },
-                });
-                editable.dispatchEvent(ev);
-            };
-            // 캐럿을 첫 텍스트 노드 오프셋에 놓는다
-            const caretAt = (off) => {
-                const holder = editable.querySelector("pre[data-me-path='0'] [data-me-path='0,0']");
-                const walker = doc.createTreeWalker(holder, 4);
-                let acc = 0;
-                for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                    const len = n.textContent?.length ?? 0;
-                    if (off <= acc + len) {
-                        doc.getSelection().setBaseAndExtent(n, off - acc, n, off - acc);
-                        return;
-                    }
-                    acc += len;
-                }
-            };
-            // "(" → "()" — 캐럿은 쌍 안쪽
-            caretAt(1);
-            fire("insertText", "(");
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("x()");
-            let sel = editor.state.selection;
-            if (sel.type === "text")
-                expect(sel.anchor.offset).toBe(2);
-            // ")" 타입오버 — 같은 닫기가 뒤에 있으면 넘어간다
-            caretAt(2);
-            fire("insertText", ")");
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("x()");
-            sel = editor.state.selection;
-            if (sel.type === "text")
-                expect(sel.anchor.offset).toBe(3);
-            // 빈 쌍 사이 Backspace — 쌍을 통째로 지운다
-            caretAt(2);
-            fire("deleteContentBackward");
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("x");
-            destroy();
-        });
-        it("코드블록 자동 쌍 — 문자열/주석 토큰 안에서는 리터럴 (Ace isCodeLike)", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "codeBlock",
-                        attrs: { language: "js" },
-                        content: [createText("s=''")],
-                    },
-                    {
-                        type: "codeBlock",
-                        attrs: { language: "js" },
-                        content: [createText("// note")],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const caretAt = (block, off) => {
-                const holder = editable.querySelector(`[data-me-path='${block},0']`);
-                const walker = doc.createTreeWalker(holder, 4);
-                let acc = 0;
-                for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                    const len = n.textContent?.length ?? 0;
-                    if (off <= acc + len) {
-                        doc
-                            .getSelection()
-                            .setBaseAndExtent(n, off - acc, n, off - acc);
-                        return;
-                    }
-                    acc += len;
-                }
-            };
-            const fire = (data) => {
-                const ev = new Event("beforeinput", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                Object.defineProperties(ev, {
-                    inputType: { value: "insertText" },
-                    data: { value: data },
-                });
-                editable.dispatchEvent(ev);
-            };
-            // 문자열 토큰 안의 { — 리터럴이어야 한다 (s='{' 가 s='{''}'로 깨지지 않게)
-            caretAt(0, 3);
-            fire("{");
-            await flush?.();
-            expect(el.querySelector("[data-me-path='0']").textContent).toBe("s='{'");
-            // 라인 주석 끝의 { — 주석은 EOL까지 열려있어 리터럴
-            caretAt(1, 7);
-            fire("{");
-            await flush?.();
-            expect(el.querySelector("[data-me-path='1']").textContent).toBe("// note{");
-            destroy();
-        });
-        it("코드블록 Enter — {|} 쌍 사이는 들여쓴 가운데 줄로 확장한다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "codeBlock", content: [createText("  f(){}")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            // 캐럿을 {|} 사이로 — 텍스트 노드에서 offset 6
-            const holder = editable.querySelector("pre[data-me-path='0'] [data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let acc = 0;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                const len = n.textContent?.length ?? 0;
-                if (6 <= acc + len) {
-                    doc.getSelection().setBaseAndExtent(n, 6 - acc, n, 6 - acc);
-                    break;
-                }
-                acc += len;
-            }
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperty(ev, "inputType", {
-                value: "insertParagraph",
-            });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            // "  f(){|\n" → "  f(){\n  \t|\n  }" — VS Code/Ace 확장
-            expect(el.querySelector("pre").textContent).toBe("  f(){\n  \t\n  }");
-            destroy();
-        });
-        it("코드블록 키 편집 — Mod-/ 주석 · Alt-↓ 줄 이동 · Mod-Shift-D 복제", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "codeBlock",
-                        attrs: { language: "js" },
-                        content: [createText("a\nb")],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            const key = (init) => editable.dispatchEvent(new KeyboardEvent("keydown", {
-                bubbles: true,
-                cancelable: true,
-                ...init,
-            }));
-            // 캐럿을 첫 줄에 둔다
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([0, 0], 0))));
-            await flush?.();
-            // Mod-/ → // 주석 (들여쓰기 뒤)
-            key({ key: "/", ctrlKey: true });
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("// a\nb");
-            // Mod-/ 재토글 → 해제
-            key({ key: "/", ctrlKey: true });
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("a\nb");
-            // Alt-↓ — 첫 줄이 아래로 이동
-            key({ key: "ArrowDown", altKey: true });
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("b\na");
-            // Mod-Shift-D — 현재 줄("b") 복제
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([0, 0], 0))));
-            await flush?.();
-            key({ key: "d", ctrlKey: true, shiftKey: true });
-            await flush?.();
-            expect(el.querySelector("pre").textContent).toBe("b\nb\na");
-            destroy();
-        });
-        it("코드블록 공백 조각은 .me-ws 스팬으로 분리된다 (showInvisibles 계약)", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "codeBlock",
-                        content: [createText("a  b\tc")],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, destroy } = await mount({ editor });
-            // 스페이스 런 → .me-ws, 탭 → .me-ws-tab (텍스트는 원문 그대로)
-            const pre = el.querySelector("pre");
-            expect(pre.querySelector(".me-ws")?.textContent).toBe("  ");
-            expect(pre.querySelector(".me-ws-tab")?.textContent).toBe("\t");
-            expect(pre.textContent).toBe("a  b\tc");
-            destroy();
-        });
-        it("코드블록 .me-cl 요소 경계 클릭 — 캐럿이 줄 끝이 아닌 그 자리에 간다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "codeBlock",
-                        content: [createText("one\ntwo\nthree")],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            // 두 번째 줄 래퍼(.me-cl)의 요소 경계 (meCl, 0) — 줄 시작 클릭.
-            // 래퍼는 뒤쪽 개행을 포함한다 ("one\n" | "two\n" | "three")
-            const meCl = editable.querySelectorAll(".me-cl")[1];
-            expect(meCl.textContent).toBe("two\n");
-            doc.getSelection().setBaseAndExtent(meCl, 0, meCl, 0);
-            doc.dispatchEvent(new Event("selectionchange"));
-            await flush?.();
-            // (meCl,0)은 offset 4 ("one\n" 뒤) — 버그 전엔 요소 전체
-            // textContent를 더해 offset 7~8(줄 끝 너머)로 갔다
-            const sel = editor.state.selection;
-            if (sel.type === "text") {
-                expect(sel.anchor.offset).toBe(4);
-            }
-            // (meCl, 끝) 경계도 자식 인덱스가 아닌 문자 오프셋으로 환산된다
-            doc
-                .getSelection()
-                .setBaseAndExtent(meCl, meCl.childNodes.length, meCl, meCl.childNodes.length);
-            doc.dispatchEvent(new Event("selectionchange"));
-            await flush?.();
-            const sel2 = editor.state.selection;
-            if (sel2.type === "text") {
-                expect(sel2.anchor.offset).toBe(8);
-            }
-            destroy();
-        });
-        it("Shift-Tab — 들여쓰기가 없는 코드 줄에서도 소비된다 (포커스 이탈 방지)", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "codeBlock", content: [createText("abc")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            editor.dispatch(editor.state.tr().setSelection(textSelection(point([0, 0], 1))));
-            await flush?.();
-            const ev = new KeyboardEvent("keydown", {
-                key: "Tab",
-                shiftKey: true,
-                bubbles: true,
-                cancelable: true,
-            });
-            editable.dispatchEvent(ev);
-            // false 폴스루면 브라우저가 포커스를 빼앗는다 — preventDefault 필수
-            expect(ev.defaultPrevented).toBe(true);
-            expect(el.querySelector("pre").textContent).toBe("abc");
-            destroy();
-        });
-        it("insertFromDrop — 텍스트 드롭은 트랜잭션으로 삽입된다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("ab")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            // 렌더러마다 텍스트 노드 분할이 다르다 — 마지막 텍스트 노드 끝에 캐럿
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent)
-                    t = n;
-            }
-            doc
-                .getSelection()
-                .setBaseAndExtent(t, t.textContent.length, t, t.textContent.length);
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperties(ev, {
-                inputType: { value: "insertFromDrop" },
-                data: { value: "XY" },
-            });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            expect(el.querySelector("p").textContent).toBe("abXY");
-            destroy();
-        });
-        it("historyUndo/historyRedo beforeinput — 우리 히스토리로 돌린다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("a")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            // 렌더러마다 텍스트 노드 분할이 다르다 — 마지막 텍스트 노드 끝에 캐럿
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent)
-                    t = n;
-            }
-            doc
-                .getSelection()
-                .setBaseAndExtent(t, t.textContent.length, t, t.textContent.length);
-            const fire = (inputType, data) => {
-                const ev = new Event("beforeinput", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                Object.defineProperties(ev, {
-                    inputType: { value: inputType },
-                    data: { value: data },
-                });
-                editable.dispatchEvent(ev);
-                return ev;
-            };
-            // 먼저 실제 편집 하나 — undo 스택에 쌓이게
-            fire("insertText", "b");
-            await flush?.();
-            expect(el.querySelector("p").textContent).toBe("ab");
-            // iOS/Android 실행취소 제스처 → preventDefault + undo
-            const u = fire("historyUndo");
-            expect(u.defaultPrevented).toBe(true);
-            await flush?.();
-            expect(el.querySelector("p").textContent).toBe("a");
-            fire("historyRedo");
-            await flush?.();
-            expect(el.querySelector("p").textContent).toBe("ab");
-            destroy();
-        });
-        it("deleteByCut — 잘라내기가 트랜잭션으로 선택을 지운다", async () => {
-            // Cmd-X: 방치하면 브라우저가 DOM만 지워 doc과 어긋난다
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("ab")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent === "ab")
-                    t = n;
-            }
-            doc.getSelection().setBaseAndExtent(t, 0, t, 2);
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperties(ev, {
-                inputType: { value: "deleteByCut" },
-            });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            expect(ev.defaultPrevented).toBe(true);
-            expect(el.querySelector("p").textContent).toBe("");
-            destroy();
-        });
-        it("deleteWord* — getTargetRanges 범위를 트랜잭션으로 지운다", async () => {
-            // macOS Option-Delete: 방치하면 네이티브 단어 삭제가 doc을 우회
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("foo bar")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent === "foo bar")
-                    t = n;
-            }
-            doc.getSelection().setBaseAndExtent(t, 7, t, 7);
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperties(ev, {
-                inputType: { value: "deleteWordBackward" },
-                // happy-dom에는 getTargetRanges가 없으므로 오리타이핑으로
-                // 붙인다 — 코드는 startContainer/startOffset만 읽는다
-                getTargetRanges: {
-                    value: () => [
-                        {
-                            startContainer: t,
-                            startOffset: 4,
-                            endContainer: t,
-                            endOffset: 7,
-                        },
-                    ],
-                },
-            });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            expect(ev.defaultPrevented).toBe(true);
-            expect(el.querySelector("p").textContent).toBe("foo ");
-            destroy();
-        });
-        it("이모지 Backspace — 서로게이트 페어가 통째로 지워진다", async () => {
-            // getTargetRanges가 없으면 코드 유닛 하나만 지워 절반 페어가
-            // 남는다 — 브라우저가 주는 그래피임 범위를 우선 쓴다
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("a😀b")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent === "a😀b")
-                    t = n;
-            }
-            // 캐럿은 😀 뒤 (a=1 + 서로게이트 페어 2 = 오프셋 3)
-            doc.getSelection().setBaseAndExtent(t, 3, t, 3);
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperties(ev, {
-                inputType: { value: "deleteContentBackward" },
-                getTargetRanges: {
-                    value: () => [
-                        {
-                            startContainer: t,
-                            startOffset: 1,
-                            endContainer: t,
-                            endOffset: 3,
-                        },
-                    ],
-                },
-            });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            expect(el.querySelector("p").textContent).toBe("ab");
-            destroy();
-        });
-        it("format*/insertOrderedList — 컨텍스트 메뉴 서식이 우리 커맨드로 매핑된다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("ab")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent === "ab")
-                    t = n;
-            }
-            const fire = (inputType) => {
-                const ev = new Event("beforeinput", {
-                    bubbles: true,
-                    cancelable: true,
-                });
-                Object.defineProperties(ev, {
-                    inputType: { value: inputType },
-                });
-                editable.dispatchEvent(ev);
-                return ev;
-            };
-            // 선택 후 formatBold → bold 마크
-            doc.getSelection().setBaseAndExtent(t, 0, t, 2);
-            const b = fire("formatBold");
-            expect(b.defaultPrevented).toBe(true);
-            await flush?.();
-            expect(el.querySelector("strong")?.textContent).toBe("ab");
-            // 캐럿에서 insertOrderedList → orderedList 변환
-            doc.getSelection().setBaseAndExtent(t, 0, t, 0);
-            fire("insertOrderedList");
-            await flush?.();
-            expect(el.querySelector(".me-editor > ol")).toBeTruthy();
-            destroy();
-        });
-        it("미지원 inputType은 no-op — 네이티브 DOM 변경을 막는다", async () => {
-            // 처리하지 않는 타입도 preventDefault해야 브라우저가 DOM만
-            // 바꿔 doc과 어긋나는 일이 없다 (insertTranspose, formatFontColor…)
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("ab")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperties(ev, {
-                inputType: { value: "formatFontColor" },
-            });
-            editable.dispatchEvent(ev);
-            expect(ev.defaultPrevented).toBe(true);
-            expect(el.querySelector("p").textContent).toBe("ab");
-            destroy();
-        });
-        it("코드블록 붙여넣기 — HTML도 항상 순수 텍스트로 들어간다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "codeBlock", content: [createText("x")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent)
-                    t = n;
-            }
-            doc
-                .getSelection()
-                .setBaseAndExtent(t, t.textContent.length, t, t.textContent.length);
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            const dt = {
-                getData: (fmt) => fmt === "text/html" ? "<b>&lt;div&gt;</b>" : "<div>",
-            };
-            Object.defineProperties(ev, {
-                inputType: { value: "insertFromPaste" },
-                dataTransfer: { value: dt },
-            });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            // 마크업이 노드가 아니라 문자로 들어가야 한다
-            expect(el.querySelector("pre").textContent).toBe("x<div>");
-            expect(el.querySelector("pre b")).toBeNull();
-            destroy();
-        });
-        it("할일 마커 클릭은 checked를 토글한다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "taskList",
-                        content: [
-                            {
-                                type: "taskItem",
-                                attrs: { checked: false },
-                                content: [
-                                    { type: "paragraph", content: [createText("할일")] },
-                                ],
-                            },
-                        ],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const li = el.querySelector("li.me-task[data-me-path='0,0']");
-            expect(li.getAttribute("data-checked")).toBe("false");
-            // 마커 존(li 패딩) 클릭 — 타겟이 li 자신이고 offsetX<=28
-            const ev = new MouseEvent("mousedown", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperty(ev, "offsetX", { value: 10 });
-            li.dispatchEvent(ev);
-            await flush?.();
-            expect(el
-                .querySelector("li.me-task[data-me-path='0,0']")
-                ?.getAttribute("data-checked")).toBe("true");
-            expect(editor.state.doc.content[0]?.content?.[0]?.attrs?.["checked"]).toBe(true);
-            destroy();
-        });
-        it("이미지 클릭 — 노드 셀렉션 + .me-imgui 오버레이 + Backspace 삭제", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("위")] },
-                    { type: "image", attrs: { src: "a.png", alt: "" } },
-                    { type: "paragraph", content: [createText("아래")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const editable = el.querySelector(".me-editor");
-            // img 클릭 → NodeSelection + is-selected 링 + .me-imgui 오버레이
-            editable
-                .querySelector("img[data-me-path='1']")
-                .dispatchEvent(new MouseEvent("mousedown", { bubbles: true, cancelable: true }));
-            await flush?.();
-            expect(editor.state.selection.type).toBe("node");
-            // 오버레이는 .me-editor의 형제로 뜬다 — DOM↔Point 매핑 불침범
-            const ui = el.querySelector(".me-imgui");
-            expect(ui).toBeTruthy();
-            expect(ui.hidden).toBe(false);
-            expect(ui.querySelector(".me-img-handle")).toBeTruthy();
-            expect(editable
-                .querySelector("img[data-me-path='1']")
-                .classList.contains("is-selected")).toBe(true);
-            // 노드 셀렉션 상태의 Backspace는 이미지를 통째로 지운다
-            editable.dispatchEvent(new KeyboardEvent("keydown", {
-                key: "Backspace",
-                bubbles: true,
-                cancelable: true,
-            }));
-            await flush?.();
-            expect(editor.state.doc.content.map((n) => n.type)).toEqual([
-                "paragraph",
-                "paragraph",
-            ]);
-            expect(ui.hidden).toBe(true);
-            destroy();
-        });
-        it("표 안 캐럿 — .me-tableui 오버레이(행/열 버튼 + 열 핸들)가 뜬다", async () => {
-            const cell = () => ({
-                type: "tableCell",
-                content: [
-                    { type: "paragraph", content: [createText("x")] },
-                ],
-            });
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "table",
-                        content: [0, 1].map(() => ({
-                            type: "tableRow",
-                            content: [cell(), cell()],
-                        })),
-                    },
-                    { type: "paragraph", content: [createText("밖")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            // 셀(0,0) 안 문단으로 캐럿 → 오버레이 표시
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([0, 0, 0, 0], 0))));
-            await flush?.();
-            const ui = el.querySelector(".me-tableui");
-            expect(ui).toBeTruthy();
-            expect(ui.hidden).toBe(false);
-            // 행/열 추가·삭제 + 표 삭제 버튼과 열 경계 핸들 (2열 → 경계 1개)
-            expect(ui.querySelectorAll("[data-tbl-act]").length).toBe(5);
-            expect(ui.querySelectorAll(".me-col-handle").length).toBe(1);
-            // 표 밖으로 캐럿이 나가면 숨긴다
-            editor.dispatch(editor.state
-                .tr()
-                .setSelection(textSelection(point([1, 0], 0))));
-            await flush?.();
-            expect(ui.hidden).toBe(true);
-            destroy();
-        });
-        it("코드블록 안 캐럿 — .me-codeui 크롬 바(언어·정리·복사)가 뜬다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "codeBlock",
-                        attrs: { language: "js" },
-                        content: [createText("const a = 1")],
-                    },
-                    { type: "paragraph", content: [createText("밖")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            // 캐럿이 코드 안 → 오버레이 표시. .me-editor 형제라 매핑 불침범
-            editor.dispatch(editor.state.tr().setSelection(textSelection(point([0, 0], 2))));
-            await flush?.();
-            const ui = el.querySelector(".me-codeui");
-            expect(ui).toBeTruthy();
-            expect(ui.hidden).toBe(false);
-            const sel = ui.querySelector(".me-codelang");
-            expect(sel.value).toBe("js");
-            expect(ui.querySelectorAll("[data-code-act]").length).toBe(2);
-            // 언어 변경 → setCodeLanguage → data-language attr
-            sel.value = "bash";
-            sel.dispatchEvent(new Event("change", { bubbles: true }));
-            await flush?.();
-            expect(el
-                .querySelector("pre[data-me-path='0']")
-                ?.getAttribute("data-language")).toBe("bash");
-            // 코드 밖으로 캐럿이 나가면 숨긴다
-            editor.dispatch(editor.state.tr().setSelection(textSelection(point([1, 0], 0))));
-            await flush?.();
-            expect(ui.hidden).toBe(true);
-            destroy();
-        });
-        it("'[ ] ' 입력 규칙은 할일 목록을 만든다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    { type: "paragraph", content: [createText("[ ]")] },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            const holder = editable.querySelector("[data-me-path='0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent === "[ ]")
-                    t = n;
-            }
-            doc.getSelection().setBaseAndExtent(t, 3, t, 3);
-            const ev = new Event("beforeinput", {
-                bubbles: true,
-                cancelable: true,
-            });
-            Object.defineProperties(ev, {
-                inputType: { value: "insertText" },
-                data: { value: " " },
-            });
-            editable.dispatchEvent(ev);
-            await flush?.();
-            expect(el.querySelector("ul.me-tasks > li.me-task > p")).toBeTruthy();
-            destroy();
-        });
-        it("표 셀 안 타이핑과 Tab 셀 이동이 동작한다", async () => {
-            const editor = createEditor({
-                doc: createDoc([
-                    {
-                        type: "table",
-                        content: [
-                            {
-                                type: "tableRow",
-                                content: [
-                                    {
-                                        type: "tableCell",
-                                        content: [
-                                            { type: "paragraph", content: [createText("a")] },
-                                        ],
-                                    },
-                                    {
-                                        type: "tableCell",
-                                        content: [
-                                            { type: "paragraph", content: [createText("b")] },
-                                        ],
-                                    },
-                                ],
-                            },
-                        ],
-                    },
-                ]),
-                extensions: starterExtensions(),
-            });
-            const { el, flush, destroy } = await mount({ editor });
-            const doc = el.ownerDocument;
-            const editable = el.querySelector(".me-editor");
-            // 첫 셀의 텍스트 끝에 캐럿 → Tab → 두 번째 셀로
-            const holder = editable.querySelector("[data-me-path='0,0,0,0,0']");
-            const walker = doc.createTreeWalker(holder, 4);
-            let t = null;
-            for (let n = walker.nextNode(); n; n = walker.nextNode()) {
-                if (n.textContent === "a")
-                    t = n;
-            }
-            doc.getSelection().setBaseAndExtent(t, 1, t, 1);
-            editable.dispatchEvent(new KeyboardEvent("keydown", {
-                key: "Tab",
-                bubbles: true,
-                cancelable: true,
-            }));
-            await flush?.();
-            if (editor.state.selection.type === "text") {
-                expect(editor.state.selection.anchor.path.slice(0, 3)).toEqual([0, 0, 1]);
-            }
-            destroy();
-        });
-        it("destroy 후 에디터 루트를 제거한다", async () => {
-            const editor = specEditor();
-            const { el, destroy } = await mount({ editor });
-            destroy();
-            expect(el.querySelector(".me-editor")).toBeNull();
-        });
-    });
-}
+// conformance 스펙은 conformance/ 디렉터리로 분리됐다 —
+// 이 파일은 기존 import 경로를 유지하는 재수출 shim이다.
+export * from "./conformance/index.js";
 //# sourceMappingURL=conformance.js.map