TypeScript CaretManager.fromDataLocation方法代碼示例

  it("prevents cutting from readonly elements", async () => {
    const initial = editor.dataRoot.querySelector("bar")!;
    const initialGUI =
      caretManager.fromDataLocation(initial, 0)!.node as Element;
    assert.isTrue(initialGUI.classList.contains("_readonly"));
    const initialValue = initial.textContent!;

    const guiStart = caretManager.fromDataLocation(initial.firstChild!, 1)!;
    caretManager.setCaret(guiStart);
    caretManager.setRange(
      guiStart,
      caretManager.fromDataLocation(initial.firstChild!, 2)!);

    // Synthetic event
    editor.$guiRoot.trigger(new $.Event("cut"));
    await delay(1);

    assert.equal(initial.textContent, initialValue);
    // Try again, after removing _readonly so that we prove the only reason the
    // cut did not work is that _readonly was present.
    initialGUI.classList.remove("_readonly");
    editor.$guiRoot.trigger(new $.Event("cut"));

    await delay(1);
    assert.equal(initial.textContent,
                 initialValue.slice(0, 1) + initialValue.slice(2));
  });

  it("handles cutting a bad selection", (done) => {
    const p = editor.dataRoot.querySelector("body>p")!;
    const originalInnerHtml = p.innerHTML;
    // Start caret is inside the term element.
    const guiStart =
      caretManager.fromDataLocation(p.childNodes[1].firstChild!, 1)!;
    const guiEnd = caretManager.fromDataLocation(p.childNodes[2], 5)!;
    caretManager.setRange(guiStart, guiEnd);

    assert.equal(p.innerHTML, originalInnerHtml);
    const straddlingModal = editor.modals.getModal("straddling");
    const $top = straddlingModal.getTopLevel();
    $top.one("shown.bs.modal", () => {
      // Wait until visible to add this handler so that it is run after the
      // callback that wed sets on the modal.
      $top.one("hidden.bs.modal", () => {
        assert.equal(p.innerHTML, originalInnerHtml);
        caretCheck(editor, guiEnd.node, guiEnd.offset, "final position");
        done();
      });
    });
    // Synthetic event
    const event = new $.Event("cut");
    editor.$guiRoot.trigger(event);
    // This clicks dismisses the modal
    straddlingModal.getTopLevel().find(".btn-primary")[0].click();
  });

  it("wraps elements in elements (no limit case)", () => {
    const initial = editor.dataRoot.querySelectorAll("body>p")[4];

    // Make sure we are looking at the right thing.
    assert.equal(initial.childNodes.length, 1);
    assert.equal(initial.firstChild!.textContent, "abcdefghij");

    const trs = editor.modeTree.getMode(initial)
      .getContextualActions(["wrap"], "hi", initial, 0);

    let caret = caretManager.fromDataLocation(initial.firstChild!, 3)!;
    caretManager.setRange(caret, caret.makeWithOffset(caret.offset + 2));

    trs[0].execute({ node: undefined, name: "hi" });

    assert.equal(initial.childNodes.length, 3, "length after first wrap");
    assert.equal(
      initial.outerHTML,
      `<p xmlns="http://www.tei-c.org/ns/1.0">abc<hi>de</hi>fghij</p>`);

    caret = caretManager.fromDataLocation(initial.firstChild!, 2)!;
    caretManager.setRange(
      caret,
      caretManager.fromDataLocation(initial.lastChild!, 2)!);

    trs[0].execute({ node: undefined, name: "hi" });

    assert.equal(initial.childNodes.length, 3, "length after second wrap");
    assert.equal(initial.outerHTML,
                 `<p xmlns="http://www.tei-c.org/ns/1.0">ab<hi>c<hi>de</hi>fg\
</hi>hij</p>`);
  });

  itNoIE("proper caret position for elements that span lines", () => {
    const p = editor.dataRoot.querySelectorAll("body>p")[5];

    // Check that we are testing what we want to test. The end label for the hi
    // element must be on the next line. If we don't have that condition yet,
    // we modify the document to create the condition we want.
    let textLoc: DLoc;
    let hi: Element;
    // This is extremely high on purpose. We don't want to have an arbitrarily
    // low number that will cause issues *sometimes*.
    let tries = 1000;
    let satisfied = false;
    // tslint:disable-next-line:no-constant-condition
    while (true) {
      tries--;
      textLoc = caretManager.fromDataLocation(p.lastChild!, 2)!;
      assert.equal(textLoc.node.nodeType, Node.TEXT_NODE);
      const his =
        (textLoc.node.parentNode as Element).getElementsByClassName("hi");
      hi = his[his.length - 1];
      const startRect = firstGUI(hi)!.getBoundingClientRect();
      const endRect = lastGUI(hi)!.getBoundingClientRect();
      if (endRect.top > startRect.top + startRect.height) {
        satisfied = true;
        break;
      }
      if (tries === 0) {
        break;
      }
      editor.dataUpdater.insertText(editor.toDataNode(hi)!, 0, "AA");
    }

    assert.isTrue(satisfied,
                  "PRECONDITION FAILED: the test is unable to establish the \
necessary precondition");

    hi.scrollIntoView(true);
    const event = new $.Event("mousedown");
    event.target = textLoc.node.parentNode as Element;
    const { range } = textLoc.makeRange(textLoc.make(textLoc.node, 3))!;
    const { top, bottom, left } = range.getBoundingClientRect();
    event.clientX = left;
    event.clientY = (top + bottom) / 2;
    event.pageX = event.clientX + editor.window.document.body.scrollLeft;
    event.pageY = event.clientY + editor.window.document.body.scrollTop;
    event.which = 1; // First mouse button.
    editor.$guiRoot.trigger(event);
    caretCheck(editor, textLoc.node, textLoc.offset,
               "the caret should be in the text node");
  });

  it("proper caret position for words that are too long to word wrap", () => {
    const p = editor.dataRoot.getElementsByTagName("p")[0];
    editor.dataUpdater.insertText(
      p, 0,
      "AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA");
    caretManager.setCaret(p, 0);
    const range = editor.window.document.createRange();
    const guiCaret = caretManager.fromDataLocation(p.firstChild!, 0)!;
    range.selectNode(guiCaret.node);
    const rect = range.getBoundingClientRect();
    // The caret should not be above the rectangle around the unbreakable text.
    assert.isTrue(Math.round(rect.top) <=
                  Math.round(caretManager.mark.getBoundingClientRect().top));
  });