@handlewithcare/react-prosemirror 2.0.0

package/dist/cjs/components/__tests__/ProseMirror.composition.test.js

@@ -0,0 +1,398 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */ /* eslint-disable @typescript-eslint/no-non-null-assertion */ "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _prosemirrorTestBuilder = require("prosemirror-test-builder");
+const _prosemirrorView = require("prosemirror-view");
+const _editorViewTestHelpersJs = require("../../testing/editorViewTestHelpers.js");
+function endComposition(view, forceUpdate) {
+    (0, _prosemirrorView["__endComposition"])(view, forceUpdate);
+}
+function event(pm, type) {
+    pm.dom.dispatchEvent(new CompositionEvent(type));
+}
+function edit(node) {
+    let text = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "", from = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : node.nodeValue.length, to = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : from;
+    const val = node.nodeValue;
+    node.nodeValue = val.slice(0, from) + text + val.slice(to);
+    document.getSelection().collapse(node, from + text.length);
+    return node;
+}
+function hasCompositionNode(_pm) {
+    let { focusNode  } = document.getSelection();
+    while(focusNode && !focusNode.pmViewDesc)focusNode = focusNode.parentNode;
+    return focusNode && focusNode.pmViewDesc.constructor.name == "CompositionViewDesc";
+}
+function compose(pm, start, update) {
+    let options = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : {};
+    event(pm, "compositionstart");
+    expect(pm.composing).toBeTruthy();
+    let node;
+    const sel = document.getSelection();
+    for(let i = -1; i < update.length; i++){
+        if (i < 0) node = start();
+        else update[i](node);
+        const { focusNode , focusOffset  } = sel;
+        // @ts-expect-error Internal property
+        pm.domObserver.flush();
+        if (options.cancel && i == update.length - 1) {
+            expect(hasCompositionNode(pm)).toBeFalsy();
+        } else {
+            expect(node.parentNode && pm.dom.contains(node.parentNode)).toBeTruthy();
+            expect(sel.focusNode === focusNode).toBeTruthy();
+            expect(sel.focusOffset === focusOffset).toBeTruthy();
+            if (options.node) expect(hasCompositionNode(pm)).toBeTruthy();
+        }
+    }
+    event(pm, "compositionend");
+    if (options.end) {
+        options.end(node);
+        // @ts-expect-error Internal property
+        pm.domObserver.flush();
+    }
+    endComposition(pm);
+    expect(pm.composing).toBeFalsy();
+    expect(hasCompositionNode(pm)).toBeFalsy();
+}
+// function wordDeco(state: EditorState) {
+//   const re = /\w+/g,
+//     deco: Decoration[] = [];
+//   state.doc.descendants((node, pos) => {
+//     if (node.isText)
+//       for (let m; (m = re.exec(node.text!)); )
+//         deco.push(
+//           Decoration.inline(pos + m.index, pos + m.index + m[0].length, {
+//             class: "word",
+//           })
+//         );
+//   });
+//   return DecorationSet.create(state.doc, deco);
+// }
+// const wordHighlighter = new Plugin({
+//   props: { decorations: wordDeco },
+// });
+// const Widget = forwardRef(function Widget(
+//   { widget, pos, ...props }: WidgetViewComponentProps,
+//   ref: Ref<HTMLElement>
+// ) {
+//   return (
+//     <var ref={ref} {...props}>
+//       ×
+//     </var>
+//   );
+// });
+// function widgets(positions: number[], sides: number[]) {
+//   return new Plugin({
+//     state: {
+//       init(state) {
+//         const deco = positions.map((p, i) =>
+//           widget(p, Widget, { side: sides[i] })
+//         );
+//         return DecorationSet.create(state.doc!, deco);
+//       },
+//       apply(tr, deco) {
+//         return deco.map(tr.mapping, tr.doc);
+//       },
+//     },
+//     props: {
+//       decorations(this: Plugin, state) {
+//         return this.getState(state);
+//       },
+//     },
+//   });
+// }
+// These unfortunately aren't working at the moment, though
+// composition seems to be working generally.
+describe.skip("EditorView composition", ()=>{
+    it("supports composition in an empty block", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("<a>"))
+        });
+        compose(pm, ()=>edit(pm.dom.firstChild.appendChild(document.createTextNode("a"))), [
+            (n)=>edit(n, "b"),
+            (n)=>edit(n, "c")
+        ], {
+            node: true
+        });
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("abc")));
+    });
+    it("supports composition at end of block", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo"))
+        });
+        compose(pm, ()=>edit((0, _editorViewTestHelpersJs.findTextNode)(pm.dom, "foo")), [
+            (n)=>edit(n, "!"),
+            (n)=>edit(n, "?")
+        ]);
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo!?")));
+    });
+    it("supports composition at end of block in a new node", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo"))
+        });
+        compose(pm, ()=>edit(pm.dom.firstChild.appendChild(document.createTextNode("!"))), [
+            (n)=>edit(n, "?")
+        ], // $$FORK: We don't use composition view descriptors except for in initially empty nodes
+        {
+            node: false
+        });
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo!?")));
+    });
+    it("supports composition at start of block in a new node", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo"))
+        });
+        compose(pm, ()=>{
+            const p = pm.dom.firstChild;
+            return edit(p.insertBefore(document.createTextNode("!"), p.firstChild));
+        }, [
+            (n)=>edit(n, "?")
+        ], // $$FORK: We don't use composition view descriptors except for in initially empty nodes
+        {
+            node: false
+        });
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("!?foo")));
+    });
+    it("supports composition inside existing text", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo"))
+        });
+        compose(pm, ()=>edit((0, _editorViewTestHelpersJs.findTextNode)(pm.dom, "foo")), [
+            (n)=>edit(n, "x", 1),
+            (n)=>edit(n, "y", 2),
+            (n)=>edit(n, "z", 3)
+        ]);
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("fxyzoo")));
+    });
+    // TODO: Offset out of bound
+    // eslint-disable-next-line jest/no-disabled-tests
+    it.skip("can deal with Android-style newline-after-composition", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("abcdef"))
+        });
+        compose(pm, ()=>edit((0, _editorViewTestHelpersJs.findTextNode)(pm.dom, "abcdef")), [
+            (n)=>edit(n, "x", 3),
+            (n)=>edit(n, "y", 4)
+        ], {
+            end: (n)=>{
+                const line = pm.dom.appendChild(document.createElement("div"));
+                line.textContent = "def";
+                n.nodeValue = "abcxy";
+                document.getSelection().collapse(line, 0);
+            }
+        });
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("abcxy"), (0, _prosemirrorTestBuilder.p)("def")));
+    });
+    it("handles replacement of existing words", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one two three"))
+        });
+        compose(pm, ()=>edit((0, _editorViewTestHelpersJs.findTextNode)(pm.dom, "one two three"), "five", 4, 7), [
+            (n)=>edit(n, "seven", 4, 8),
+            (n)=>edit(n, "zero", 4, 9)
+        ]);
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one zero three")));
+    });
+    it("handles composition inside marks", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one ", (0, _prosemirrorTestBuilder.em)("two")))
+        });
+        compose(pm, ()=>edit((0, _editorViewTestHelpersJs.findTextNode)(pm.dom, "two"), "o"), [
+            (n)=>edit(n, "o"),
+            (n)=>edit(n, "w")
+        ]);
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one ", (0, _prosemirrorTestBuilder.em)("twooow"))));
+    });
+    it.skip("handles composition in a mark that has multiple children", ()=>{
+        const { view: pm  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one ", (0, _prosemirrorTestBuilder.em)("two", (0, _prosemirrorTestBuilder.strong)(" three"))))
+        });
+        compose(pm, ()=>edit((0, _editorViewTestHelpersJs.findTextNode)(pm.dom, "two"), "o"), [
+            (n)=>edit(n, "o"),
+            (n)=>edit(n, "w")
+        ]);
+        expect(pm.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one ", (0, _prosemirrorTestBuilder.em)("twooow", (0, _prosemirrorTestBuilder.strong)(" three")))));
+    });
+// it("supports composition in a cursor wrapper", () => {
+//   const { view: pm } = tempEditor({ doc: doc(p("<a>")) });
+//   pm.dispatch(pm.state.tr.addStoredMark(schema.marks.em.create()));
+//   compose(
+//     pm,
+//     () =>
+//       edit(pm.dom.firstChild!.appendChild(document.createTextNode("")), "a"),
+//     [(n) => edit(n, "b"), (n) => edit(n, "c")],
+//     { node: true }
+//   );
+//   ist(pm.state.doc, doc(p(em("abc"))), eq);
+// });
+// it("handles composition in a multi-child mark with a cursor wrapper", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("one ", em("two<a>", strong(" three")))) })
+//   );
+//   pm.dispatch(pm.state.tr.addStoredMark(schema.marks.code.create()));
+//   const emNode = pm.dom.querySelector("em")!;
+//   compose(
+//     pm,
+//     () =>
+//       edit(
+//         emNode.insertBefore(
+//           document.createTextNode(""),
+//           emNode.querySelector("strong")
+//         ),
+//         "o"
+//       ),
+//     [(n) => edit(n, "o"), (n) => edit(n, "w")],
+//     { node: true }
+//   );
+//   ist(
+//     pm.state.doc,
+//     doc(p("one ", em("two", code("oow"), strong(" three")))),
+//     eq
+//   );
+// });
+// it("doesn't get interrupted by changes in decorations", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("foo ...")), plugins: [wordHighlighter] })
+//   );
+//   compose(pm, () => edit(findTextNode(pm.dom, " ...")!), [
+//     (n) => edit(n, "hi", 1, 4),
+//   ]);
+//   ist(pm.state.doc, doc(p("foo hi")), eq);
+// });
+// it("works inside highlighted text", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("one two")), plugins: [wordHighlighter] })
+//   );
+//   compose(pm, () => edit(findTextNode(pm.dom, "one")!, "x"), [
+//     (n) => edit(n, "y"),
+//     (n) => edit(n, "."),
+//   ]);
+//   ist(pm.state.doc, doc(p("onexy. two")), eq);
+// });
+// it("can handle compositions spanning multiple nodes", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("one two")), plugins: [wordHighlighter] })
+//   );
+//   compose(
+//     pm,
+//     () => edit(findTextNode(pm.dom, "two")!, "a"),
+//     [(n) => edit(n, "b"), (n) => edit(n, "c")],
+//     {
+//       end: (n: Text) => {
+//         n.parentNode!.previousSibling!.remove();
+//         n.parentNode!.previousSibling!.remove();
+//         return edit(n, "xyzone ", 0);
+//       },
+//     }
+//   );
+//   ist(pm.state.doc, doc(p("xyzone twoabc")), eq);
+// });
+// it("doesn't overwrite widgets next to the composition", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("")), plugins: [widgets([1, 1], [-1, 1])] })
+//   );
+//   compose(
+//     pm,
+//     () => {
+//       const p = pm.dom.firstChild!;
+//       return edit(p.insertBefore(document.createTextNode("a"), p.lastChild));
+//     },
+//     [(n) => edit(n, "b", 0, 1)],
+//     {
+//       end: () => {
+//         ist(pm.dom.querySelectorAll("var").length, 2);
+//       },
+//     }
+//   );
+//   ist(pm.state.doc, doc(p("b")), eq);
+// });
+// it("cancels composition when a change fully overlaps with it", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("one"), p("two"), p("three")) })
+//   );
+//   compose(
+//     pm,
+//     () => edit(findTextNode(pm.dom, "two")!, "x"),
+//     [() => pm.dispatch(pm.state.tr.insertText("---", 3, 13))],
+//     { cancel: true }
+//   );
+//   ist(pm.state.doc, doc(p("on---hree")), eq);
+// });
+// it("cancels composition when a change partially overlaps with it", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("one"), p("two"), p("three")) })
+//   );
+//   compose(
+//     pm,
+//     () => edit(findTextNode(pm.dom, "two")!, "x", 0),
+//     [() => pm.dispatch(pm.state.tr.insertText("---", 7, 15))],
+//     { cancel: true }
+//   );
+//   ist(pm.state.doc, doc(p("one"), p("x---ee")), eq);
+// });
+// it("cancels composition when a change happens inside of it", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("one"), p("two"), p("three")) })
+//   );
+//   compose(
+//     pm,
+//     () => edit(findTextNode(pm.dom, "two")!, "x", 0),
+//     [() => pm.dispatch(pm.state.tr.insertText("!", 7, 8))],
+//     { cancel: true }
+//   );
+//   ist(pm.state.doc, doc(p("one"), p("x!wo"), p("three")), eq);
+// });
+// it("doesn't cancel composition when a change happens elsewhere", () => {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("one"), p("two"), p("three")) })
+//   );
+//   compose(pm, () => edit(findTextNode(pm.dom, "two")!, "x", 0), [
+//     (n) => edit(n, "y", 1),
+//     () => pm.dispatch(pm.state.tr.insertText("!", 2, 3)),
+//     (n) => edit(n, "z", 2),
+//   ]);
+//   ist(pm.state.doc, doc(p("o!e"), p("xyztwo"), p("three")), eq);
+// });
+// it("handles compositions rapidly following each other", () => {
+//   const { view: pm } = tempEditor({ doc: doc(p("one"), p("two")) });
+//   event(pm, "compositionstart");
+//   const one = findTextNode(pm.dom, "one")!;
+//   edit(one, "!");
+//   pm.domObserver.flush();
+//   event(pm, "compositionend");
+//   one.nodeValue = "one!!";
+//   const L2 = pm.dom.lastChild;
+//   event(pm, "compositionstart");
+//   const two = findTextNode(pm.dom, "two")!;
+//   ist(pm.dom.lastChild, L2);
+//   edit(two, ".");
+//   pm.domObserver.flush();
+//   ist(document.getSelection()!.focusNode, two);
+//   ist(document.getSelection()!.focusOffset, 4);
+//   ist(pm.composing);
+//   event(pm, "compositionend");
+//   pm.domObserver.flush();
+//   ist(pm.state.doc, doc(p("one!!"), p("two.")), eq);
+// });
+// function crossParagraph(first = false) {
+//   const { view: pm } = requireFocus(
+//     tempEditor({ doc: doc(p("one <a>two"), p("three"), p("four<b> five")) })
+//   );
+//   compose(
+//     pm,
+//     () => {
+//       for (let i = 0; i < 2; i++)
+//         pm.dom.removeChild(first ? pm.dom.lastChild! : pm.dom.firstChild!);
+//       const target = pm.dom.firstChild!.firstChild as Text;
+//       target.nodeValue = "one A five";
+//       document.getSelection()!.collapse(target, 4);
+//       return target;
+//     },
+//     [(n) => edit(n, "B", 4, 5), (n) => edit(n, "C", 4, 5)]
+//   );
+//   ist(pm.state.doc, doc(p("one C five")), eq);
+// }
+// it("can handle cross-paragraph compositions", () => crossParagraph(true));
+// it("can handle cross-paragraph compositions (keeping the last paragraph)", () =>
+//   crossParagraph(false));
+});

package/dist/cjs/components/__tests__/ProseMirror.domchange.test.js

@@ -0,0 +1,270 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */ /* eslint-disable @typescript-eslint/no-non-null-assertion */ "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _react = require("@testing-library/react");
+const _prosemirrorState = require("prosemirror-state");
+const _prosemirrorTestBuilder = require("prosemirror-test-builder");
+const _webdriverio = require("webdriverio");
+const _editorViewTestHelpersJs = require("../../testing/editorViewTestHelpers.js");
+describe("DOM change", ()=>{
+    it("notices when text is added", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("he<a>llo"))
+        });
+        view.focus();
+        await browser.keys([
+            _webdriverio.Key.Shift,
+            "l"
+        ]);
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("heLllo")));
+    });
+    it("notices when text is removed", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("hell<a>o"))
+        });
+        view.focus();
+        await browser.keys(_webdriverio.Key.Backspace);
+        await browser.keys(_webdriverio.Key.Backspace);
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("heo")));
+    });
+    it("respects stored marks", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("hello<a>"))
+        });
+        view.dispatch(view.state.tr.addStoredMark(view.state.schema.marks.em.create()));
+        view.focus();
+        await browser.keys("o");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("hello", (0, _prosemirrorTestBuilder.em)("o"))));
+    });
+    it("support inserting repeated text", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("hello"))
+        });
+        view.focus();
+        await browser.keys("h");
+        await browser.keys("e");
+        await browser.keys("l");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("helhello")));
+    });
+    it("detects an enter press", async ()=>{
+        let enterPressed = false;
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.blockquote)((0, _prosemirrorTestBuilder.p)("foo"), (0, _prosemirrorTestBuilder.p)("<a>"))),
+            handleKeyDown: (_, event)=>{
+                if (event.key === "Enter") return enterPressed = true;
+                return false;
+            }
+        });
+        view.focus();
+        await browser.keys(_webdriverio.Key.Enter);
+        expect(enterPressed).toBeTruthy();
+    });
+    it("detects a simple backspace press", async ()=>{
+        let backspacePressed = false;
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.blockquote)((0, _prosemirrorTestBuilder.p)("foo"), (0, _prosemirrorTestBuilder.p)("<a>"))),
+            handleKeyDown: (_, event)=>{
+                if (event.key === "Backspace") return backspacePressed = true;
+                return false;
+            }
+        });
+        view.focus();
+        await browser.keys(_webdriverio.Key.Backspace);
+        expect(backspacePressed).toBeTruthy();
+    });
+    it("correctly adjusts the selection", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("abc<a>"))
+        });
+        view.focus();
+        await browser.keys("d");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("abcd")));
+        expect(view.state.selection.anchor).toBe(5);
+        expect(view.state.selection.head).toBe(5);
+    });
+    // todoit("can read a simple composition", () => {
+    //   let view = tempEditor({ doc: doc(p("hello")) });
+    //   findTextNode(view.dom, "hello")!.nodeValue = "hellox";
+    //   flush(view);
+    //   ist(view.state.doc, doc(p("hellox")), eq);
+    // });
+    // $$FORK: We _do_ repaint text nodes when they're typed into.
+    // Unlike prosemirror-view, we prevent user inputs from modifying
+    // the dom until after we've turned them into transactions.
+    // This test instead ensures that we only modify the character data,
+    // rather than replacing entire nodes.
+    it("does not replace a text node when it's typed into", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("fo<a>o"))
+        });
+        let mutated = false;
+        const observer = new MutationObserver(()=>mutated = true);
+        observer.observe(view.dom, {
+            subtree: true,
+            characterData: false,
+            childList: true
+        });
+        view.focus();
+        await browser.keys("j");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("fojo")));
+        expect(mutated).toBeFalsy();
+        observer.disconnect();
+    });
+    it("understands text typed into an empty paragraph", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("<a>"))
+        });
+        view.focus();
+        await browser.keys("i");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("i")));
+    });
+    it("fixes text changes when input is ignored", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo<a>")),
+            controlled: true,
+            dispatchTransaction () {
+            // intentionally do nothing
+            }
+        });
+        view.focus();
+        await browser.keys("i");
+        expect(view.dom.textContent).toBe("foo");
+    });
+    it("aborts when an incompatible state is set", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("<a>abcde"))
+        });
+        view.dispatchEvent({
+            type: "input"
+        });
+        view.focus();
+        await browser.keys("x");
+        view.updateState(_prosemirrorState.EditorState.create({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("uvw"))
+        }));
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("uvw")));
+    });
+    it("preserves marks on deletion", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one", (0, _prosemirrorTestBuilder.em)("x<a>")))
+        });
+        view.focus();
+        await browser.keys(_webdriverio.Key.Backspace);
+        view.dispatchEvent({
+            type: "input"
+        });
+        view.dispatch(view.state.tr.insertText("y"));
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one", (0, _prosemirrorTestBuilder.em)("y"))));
+    });
+    it("works when a node's contentDOM is deleted", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one"), (0, _prosemirrorTestBuilder.pre)("two<a>"))
+        });
+        view.focus();
+        await browser.keys(_webdriverio.Key.Backspace);
+        await browser.keys(_webdriverio.Key.Backspace);
+        await browser.keys(_webdriverio.Key.Backspace);
+        view.dispatchEvent({
+            type: "input"
+        });
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one"), (0, _prosemirrorTestBuilder.pre)()));
+        expect(view.state.selection.head).toBe(6);
+    });
+    it("doesn't redraw content with marks when typing in front", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("f<a>oo", (0, _prosemirrorTestBuilder.em)("bar"), (0, _prosemirrorTestBuilder.strong)("baz")))
+        });
+        const bar = await _react.screen.findByText("bar");
+        const foo = await _react.screen.findByText("foo");
+        view.focus();
+        await browser.keys("r");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("froo", (0, _prosemirrorTestBuilder.em)("bar"), (0, _prosemirrorTestBuilder.strong)("baz"))));
+        expect(bar.parentNode).toBeTruthy();
+        expect(view.dom.contains(bar.parentNode)).toBeTruthy();
+        expect(foo.parentNode).toBeTruthy();
+        expect(view.dom.contains(foo.parentNode)).toBeTruthy();
+    });
+    it("doesn't redraw content with marks when typing inside mark", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo", (0, _prosemirrorTestBuilder.em)("b<a>ar"), (0, _prosemirrorTestBuilder.strong)("baz")))
+        });
+        const bar = await _react.screen.findByText("bar");
+        const foo = await _react.screen.findByText("foo");
+        view.focus();
+        await browser.keys("a");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo", (0, _prosemirrorTestBuilder.em)("baar"), (0, _prosemirrorTestBuilder.strong)("baz"))));
+        expect(bar.parentNode).toBeTruthy();
+        expect(view.dom.contains(bar.parentNode)).toBeTruthy();
+        expect(foo.parentNode).toBeTruthy();
+        expect(view.dom.contains(foo.parentNode)).toBeTruthy();
+    });
+    it("maps input to coordsAtPos through pending changes", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("foo"))
+        });
+        view.dispatchEvent({
+            type: "input"
+        });
+        view.dispatch(view.state.tr.insertText("more text"));
+        expect(view.coordsAtPos(13)).toBeTruthy();
+    });
+    it("notices text added to a cursor wrapper at the start of a mark", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)((0, _prosemirrorTestBuilder.strong)((0, _prosemirrorTestBuilder.a)("foo<a>"), "bar")))
+        });
+        view.focus();
+        await browser.keys("xy");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)((0, _prosemirrorTestBuilder.strong)((0, _prosemirrorTestBuilder.a)("foo"), "xybar"))));
+    });
+    it("removes cursor wrapper text when the wrapper otherwise remains valid", async ()=>{
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)((0, _prosemirrorTestBuilder.a)((0, _prosemirrorTestBuilder.strong)("foo<a>"), "bar")))
+        });
+        view.focus();
+        await browser.keys("q");
+        expect(view.state.doc).toEqualNode((0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)((0, _prosemirrorTestBuilder.a)((0, _prosemirrorTestBuilder.strong)("fooq"), "bar"))));
+        const found = _react.screen.queryByText("\uFEFFq");
+        expect(found).toBeNull();
+    });
+    it("creates a correct step for an ambiguous selection-deletion", async ()=>{
+        let steps;
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("la<a>la<b>la")),
+            dispatchTransaction (tr) {
+                steps = tr.steps;
+                view.updateState(view.state.apply(tr));
+            }
+        });
+        view.input.lastKeyCode = 8;
+        view.input.lastKeyCodeTime = Date.now();
+        view.focus();
+        await browser.keys(_webdriverio.Key.Backspace);
+        expect(steps).toHaveLength(1);
+        expect(steps[0].from).toBe(3);
+        expect(steps[0].to).toBe(5);
+    });
+    it("creates a step that covers the entire selection for partially-matching replacement", async ()=>{
+        let steps;
+        const { view  } = (0, _editorViewTestHelpersJs.tempEditor)({
+            doc: (0, _prosemirrorTestBuilder.doc)((0, _prosemirrorTestBuilder.p)("one <a>two<b> three")),
+            dispatchTransaction (tr) {
+                steps = tr.steps;
+                view.updateState(view.state.apply(tr));
+            }
+        });
+        view.focus();
+        await browser.keys("t");
+        expect(steps).toHaveLength(1);
+        expect(steps[0].from).toBe(5);
+        expect(steps[0].to).toBe(8);
+        expect(steps[0].slice.content.toString()).toBe('<"t">');
+        view.dispatch(view.state.tr.setSelection(_prosemirrorState.TextSelection.create(view.state.doc, 7, 12)));
+        view.focus();
+        await browser.keys("e");
+        expect(steps).toHaveLength(1);
+        expect(steps[0].from).toBe(7);
+        expect(steps[0].to).toBe(12);
+        expect(steps[0].slice.content.toString()).toBe('<"e">');
+    });
+});