prosemirror-view 1.31.8 → 1.32.1

package/CHANGELOG.md

@@ -1,3 +1,23 @@
+## 1.32.1 (2023-10-13)
+
+### Bug fixes
+
+Work around a Chrome issue where it didn't draw a selection for inline leaf nodes when selecting across them.
+
+Override the native behavior when shift-selecting horizontally across non-text inline nodes, since most browsers behave poorly here.
+
+## 1.32.0 (2023-09-27)
+
+### Bug fixes
+
+Work around an issue on Chrome where, when clicking above the right side of an uneditable node, the cursor would be put after the node.
+
+Fix a bug that could corrupt the composition when it occurs next to text identical to the composed characters.
+
+### New features
+
+The new `EditorView.updateRoot` method can be used to make the editor update its DOM root when it is moved to a new document or shadow tree.
+
 ## 1.31.8 (2023-09-12)
 
 ### Bug fixes

package/dist/index.cjs

@@ -513,6 +513,8 @@ function _posAtCoords(view, coords) {
       }
     }
 
+    var prev;
+    if (webkit && offset && node.nodeType == 1 && (prev = node.childNodes[offset - 1]).nodeType == 1 && prev.contentEditable == "false" && prev.getBoundingClientRect().top >= coords.top) offset--;
     if (node == view.dom && offset == node.childNodes.length - 1 && node.lastChild.nodeType == 1 && coords.top > node.lastChild.getBoundingClientRect().bottom) pos = view.state.doc.content.size;else if (offset == 0 || node.nodeType != 1 || node.childNodes[offset - 1].nodeName != "BR") pos = posFromCaret(view, node, offset, coords);
   }
 
@@ -2479,6 +2481,7 @@ function findTextInFragment(frag, text, from, to) {
     }
 
     if (pos >= from) {
+      if (pos >= to && str.slice(to - text.length - childStart, to - childStart) == text) return to - text.length;
       var found = childStart < to ? str.lastIndexOf(text, to - childStart - 1) : -1;
       if (found >= 0 && found + text.length + childStart >= from) return childStart + found;
       if (from == to && str.length >= to + text.length - childStart && str.slice(to - childStart, to - childStart + text.length) == text) return to;
@@ -2743,24 +2746,31 @@ function selectHorizontally(view, dir, mods) {
   var sel = view.state.selection;
 
   if (sel instanceof prosemirrorState.TextSelection) {
-    if (!sel.empty || mods.indexOf("s") > -1) {
+    if (mods.indexOf("s") > -1) {
+      var $head = sel.$head,
+          node = $head.textOffset ? null : dir < 0 ? $head.nodeBefore : $head.nodeAfter;
+      if (!node || node.isText || !node.isLeaf) return false;
+      var $newHead = view.state.doc.resolve($head.pos + node.nodeSize * (dir < 0 ? -1 : 1));
+      return apply(view, new prosemirrorState.TextSelection(sel.$anchor, $newHead));
+    } else if (!sel.empty) {
       return false;
     } else if (view.endOfTextblock(dir > 0 ? "forward" : "backward")) {
       var next = moveSelectionBlock(view.state, dir);
       if (next && next instanceof prosemirrorState.NodeSelection) return apply(view, next);
       return false;
     } else if (!(mac && mods.indexOf("m") > -1)) {
-      var $head = sel.$head,
-          node = $head.textOffset ? null : dir < 0 ? $head.nodeBefore : $head.nodeAfter,
+      var _$head = sel.$head,
+          _node = _$head.textOffset ? null : dir < 0 ? _$head.nodeBefore : _$head.nodeAfter,
           desc;
-      if (!node || node.isText) return false;
-      var nodePos = dir < 0 ? $head.pos - node.nodeSize : $head.pos;
-      if (!(node.isAtom || (desc = view.docView.descAt(nodePos)) && !desc.contentDOM)) return false;
 
-      if (prosemirrorState.NodeSelection.isSelectable(node)) {
-        return apply(view, new prosemirrorState.NodeSelection(dir < 0 ? view.state.doc.resolve($head.pos - node.nodeSize) : $head));
+      if (!_node || _node.isText) return false;
+      var nodePos = dir < 0 ? _$head.pos - _node.nodeSize : _$head.pos;
+      if (!(_node.isAtom || (desc = view.docView.descAt(nodePos)) && !desc.contentDOM)) return false;
+
+      if (prosemirrorState.NodeSelection.isSelectable(_node)) {
+        return apply(view, new prosemirrorState.NodeSelection(dir < 0 ? view.state.doc.resolve(_$head.pos - _node.nodeSize) : _$head));
       } else if (webkit) {
-        return apply(view, new prosemirrorState.TextSelection(view.state.doc.resolve(dir < 0 ? nodePos : nodePos + node.nodeSize)));
+        return apply(view, new prosemirrorState.TextSelection(view.state.doc.resolve(dir < 0 ? nodePos : nodePos + _node.nodeSize)));
       } else {
         return false;
       }
@@ -2780,7 +2790,6 @@ function nodeLen(node) {
 }
 
 function isIgnorable(dom, dir) {
-  if (dom.contentEditable == "false") return true;
   var desc = dom.pmViewDesc;
   return desc && desc.size == 0 && (dir < 0 || dom.nextSibling || dom.nodeName != "BR");
 }
@@ -3203,7 +3212,7 @@ function parseFromClipboard(view, text, html, plainText, $context) {
 
       for (var node = slice.content.firstChild; openStart < slice.openStart && !node.type.spec.isolating; openStart++, node = node.firstChild) {}
 
-      for (var _node = slice.content.lastChild; openEnd < slice.openEnd && !_node.type.spec.isolating; openEnd++, _node = _node.lastChild) {}
+      for (var _node2 = slice.content.lastChild; openEnd < slice.openEnd && !_node2.type.spec.isolating; openEnd++, _node2 = _node2.lastChild) {}
 
       slice = closeSlice(slice, openStart, openEnd);
     }
@@ -5943,6 +5952,11 @@ var EditorView = function () {
 
       return cached || document;
     }
+  }, {
+    key: "updateRoot",
+    value: function updateRoot() {
+      this._root = null;
+    }
   }, {
     key: "posAtCoords",
     value: function posAtCoords(coords) {

package/dist/index.d.cts

@@ -492,6 +492,11 @@ declare class EditorView {
     */
     get root(): Document | ShadowRoot;
     /**
+    When an existing editor view is moved to a new document or
+    shadow tree, call this to make it recompute its root.
+    */
+    updateRoot(): void;
+    /**
     Given a pair of viewport coordinates, return the document
     position that corresponds to them. May return null if the given
     coordinates aren't inside of the editor. When an object is

package/dist/index.d.ts

@@ -492,6 +492,11 @@ declare class EditorView {
     */
     get root(): Document | ShadowRoot;
     /**
+    When an existing editor view is moved to a new document or
+    shadow tree, call this to make it recompute its root.
+    */
+    updateRoot(): void;
+    /**
     Given a pair of viewport coordinates, return the document
     position that corresponds to them. May return null if the given
     coordinates aren't inside of the editor. When an object is

package/dist/index.js

@@ -426,6 +426,11 @@ function posAtCoords(view, coords) {
                     offset++;
             }
         }
+        let prev;
+        // When clicking above the right side of an uneditable node, Chrome will report a cursor position after that node.
+        if (webkit && offset && node.nodeType == 1 && (prev = node.childNodes[offset - 1]).nodeType == 1 &&
+            prev.contentEditable == "false" && prev.getBoundingClientRect().top >= coords.top)
+            offset--;
         // Suspiciously specific kludge to work around caret*FromPoint
         // never returning a position at the end of the document
         if (node == view.dom && offset == node.childNodes.length - 1 && node.lastChild.nodeType == 1 &&
@@ -2068,6 +2073,8 @@ function findTextInFragment(frag, text, from, to) {
             str += next.text;
         }
         if (pos >= from) {
+            if (pos >= to && str.slice(to - text.length - childStart, to - childStart) == text)
+                return to - text.length;
             let found = childStart < to ? str.lastIndexOf(text, to - childStart - 1) : -1;
             if (found >= 0 && found + text.length + childStart >= from)
                 return childStart + found;
@@ -2321,7 +2328,14 @@ function apply(view, sel) {
 function selectHorizontally(view, dir, mods) {
     let sel = view.state.selection;
     if (sel instanceof TextSelection) {
-        if (!sel.empty || mods.indexOf("s") > -1) {
+        if (mods.indexOf("s") > -1) {
+            let { $head } = sel, node = $head.textOffset ? null : dir < 0 ? $head.nodeBefore : $head.nodeAfter;
+            if (!node || node.isText || !node.isLeaf)
+                return false;
+            let $newHead = view.state.doc.resolve($head.pos + node.nodeSize * (dir < 0 ? -1 : 1));
+            return apply(view, new TextSelection(sel.$anchor, $newHead));
+        }
+        else if (!sel.empty) {
             return false;
         }
         else if (view.endOfTextblock(dir > 0 ? "forward" : "backward")) {
@@ -2365,8 +2379,6 @@ function nodeLen(node) {
     return node.nodeType == 3 ? node.nodeValue.length : node.childNodes.length;
 }
 function isIgnorable(dom, dir) {
-    if (dom.contentEditable == "false")
-        return true;
     let desc = dom.pmViewDesc;
     return desc && desc.size == 0 && (dir < 0 || dom.nextSibling || dom.nodeName != "BR");
 }
@@ -5354,6 +5366,13 @@ class EditorView {
         return cached || document;
     }
     /**
+    When an existing editor view is moved to a new document or
+    shadow tree, call this to make it recompute its root.
+    */
+    updateRoot() {
+        this._root = null;
+    }
+    /**
     Given a pair of viewport coordinates, return the document
     position that corresponds to them. May return null if the given
     coordinates aren't inside of the editor. When an object is

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "prosemirror-view",
-  "version": "1.31.8",
+  "version": "1.32.1",
   "description": "ProseMirror's view component",
   "type": "module",
   "main": "dist/index.cjs",

package/src/capturekeys.ts

@@ -19,7 +19,12 @@ function apply(view: EditorView, sel: Selection) {
 function selectHorizontally(view: EditorView, dir: number, mods: string) {
   let sel = view.state.selection
   if (sel instanceof TextSelection) {
-    if (!sel.empty || mods.indexOf("s") > -1) {
+    if (mods.indexOf("s") > -1) {
+      let {$head} = sel, node = $head.textOffset ? null : dir < 0 ? $head.nodeBefore : $head.nodeAfter
+      if (!node || node.isText || !node.isLeaf) return false
+      let $newHead = view.state.doc.resolve($head.pos + node.nodeSize * (dir < 0 ? -1 : 1))
+      return apply(view, new TextSelection(sel.$anchor, $newHead))
+    } else if (!sel.empty) {
       return false
     } else if (view.endOfTextblock(dir > 0 ? "forward" : "backward")) {
       let next = moveSelectionBlock(view.state, dir)
@@ -55,7 +60,6 @@ function nodeLen(node: Node) {
 }
 
 function isIgnorable(dom: Node, dir: number) {
-  if ((dom as HTMLElement).contentEditable == "false") return true
   let desc = dom.pmViewDesc
   return desc && desc.size == 0 && (dir < 0 || dom.nextSibling || dom.nodeName != "BR")
 }

package/src/domcoords.ts

@@ -294,6 +294,11 @@ export function posAtCoords(view: EditorView, coords: {top: number, left: number
           offset++
       }
     }
+    let prev
+    // When clicking above the right side of an uneditable node, Chrome will report a cursor position after that node.
+    if (browser.webkit && offset && node.nodeType == 1 && (prev = node.childNodes[offset - 1]).nodeType == 1 &&
+        (prev as HTMLElement).contentEditable == "false" && (prev as HTMLElement).getBoundingClientRect().top >= coords.top)
+      offset--
     // Suspiciously specific kludge to work around caret*FromPoint
     // never returning a position at the end of the document
     if (node == view.dom && offset == node.childNodes.length - 1 && node.lastChild!.nodeType == 1 &&

package/src/index.ts

@@ -339,6 +339,12 @@ export class EditorView {
     return cached || document
   }
 
+  /// When an existing editor view is moved to a new document or
+  /// shadow tree, call this to make it recompute its root.
+  updateRoot() {
+    this._root = null
+  }
+
   /// Given a pair of viewport coordinates, return the document
   /// position that corresponds to them. May return null if the given
   /// coordinates aren't inside of the editor. When an object is

package/src/viewdesc.ts

@@ -1499,6 +1499,8 @@ function findTextInFragment(frag: Fragment, text: string, from: number, to: numb
       str += next.text
     }
     if (pos >= from) {
+      if (pos >= to && str.slice(to - text.length - childStart, to - childStart) == text)
+        return to - text.length
       let found = childStart < to ? str.lastIndexOf(text, to - childStart - 1) : -1
       if (found >= 0 && found + text.length + childStart >= from)
         return childStart + found

package/style/prosemirror.css

@@ -23,6 +23,9 @@
 .ProseMirror-hideselection *::-moz-selection { background: transparent; }
 .ProseMirror-hideselection { caret-color: transparent; }
 
+/* See https://github.com/ProseMirror/prosemirror/issues/1421#issuecomment-1759320191 */
+.ProseMirror [draggable][contenteditable=false] { user-select: text }
+
 .ProseMirror-selectednode {
   outline: 2px solid #8cf;
 }