prosemirror-view 1.31.7 → 1.32.0

package/CHANGELOG.md

@@ -1,3 +1,25 @@
+## 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
+
+Fix a bug that broke arrow motion near uneditable nodes on Chrome in some situations.
+
+Fix an issue that broke backspace at the end of a textblock that ended in a newline on Chrome.
+
+Fix a crash in the way inline decorations that ended right after a node end position were drawn.
+
 ## 1.31.7 (2023-07-28)
 
 ### Bug fixes

package/dist/index.cjs

@@ -32,10 +32,6 @@ function _defineProperties(target, props) { for (var i = 0; i < props.length; i+
 
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
 
-Object.defineProperty(exports, '__esModule', {
-  value: true
-});
-
 var prosemirrorState = require('prosemirror-state');
 
 var prosemirrorModel = require('prosemirror-model');
@@ -517,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);
   }
 
@@ -2190,9 +2188,13 @@ var ViewTreeUpdater = function () {
             return true;
           } else if (!locked && (updated = this.recreateWrapper(next, node, outerDeco, innerDeco, view, pos))) {
             this.top.children[this.index] = updated;
-            updated.dirty = CONTENT_DIRTY;
-            updated.updateChildren(view, pos + 1);
-            updated.dirty = NOT_DIRTY;
+
+            if (updated.contentDOM) {
+              updated.dirty = CONTENT_DIRTY;
+              updated.updateChildren(view, pos + 1);
+              updated.dirty = NOT_DIRTY;
+            }
+
             this.changed = true;
             this.index++;
             return true;
@@ -2209,25 +2211,27 @@ var ViewTreeUpdater = function () {
     value: function recreateWrapper(next, node, outerDeco, innerDeco, view, pos) {
       if (next.dirty || node.isAtom || !next.children.length || !next.node.content.eq(node.content)) return null;
       var wrapper = NodeViewDesc.create(this.top, node, outerDeco, innerDeco, view, pos);
-      if (!wrapper.contentDOM) return null;
-      wrapper.children = next.children;
-      next.children = [];
-      next.destroy();
 
-      var _iterator = _createForOfIteratorHelper(wrapper.children),
-          _step;
+      if (wrapper.contentDOM) {
+        wrapper.children = next.children;
+        next.children = [];
 
-      try {
-        for (_iterator.s(); !(_step = _iterator.n()).done;) {
-          var ch = _step.value;
-          ch.parent = wrapper;
+        var _iterator = _createForOfIteratorHelper(wrapper.children),
+            _step;
+
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var ch = _step.value;
+            ch.parent = wrapper;
+          }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
         }
-      } catch (err) {
-        _iterator.e(err);
-      } finally {
-        _iterator.f();
       }
 
+      next.destroy();
       return wrapper;
     }
   }, {
@@ -2364,14 +2368,18 @@ function iterDeco(parent, deco, onWidget, onNode) {
       restNode = null;
 
   for (var parentIndex = 0;;) {
-    if (decoIndex < locals.length && locals[decoIndex].to == offset) {
-      var widget = locals[decoIndex++],
-          widgets = void 0;
+    var widget = void 0,
+        widgets = void 0;
+
+    while (decoIndex < locals.length && locals[decoIndex].to == offset) {
+      var next = locals[decoIndex++];
 
-      while (decoIndex < locals.length && locals[decoIndex].to == offset) {
-        (widgets || (widgets = [widget])).push(locals[decoIndex++]);
+      if (next.widget) {
+        if (!widget) widget = next;else (widgets || (widgets = [widget])).push(next);
       }
+    }
 
+    if (widget) {
       if (widgets) {
         widgets.sort(compareSide);
 
@@ -2473,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;
@@ -2773,10 +2782,10 @@ function nodeLen(node) {
   return node.nodeType == 3 ? node.nodeValue.length : node.childNodes.length;
 }
 
-function isIgnorable(dom) {
+function isIgnorable(dom, dir) {
   if (dom.contentEditable == "false") return true;
   var desc = dom.pmViewDesc;
-  return desc && desc.size == 0 && (dom.nextSibling || dom.nodeName != "BR");
+  return desc && desc.size == 0 && (dir < 0 || dom.nextSibling || dom.nodeName != "BR");
 }
 
 function skipIgnoredNodes(view, dir) {
@@ -2791,7 +2800,7 @@ function skipIgnoredNodesBefore(view) {
   var moveNode,
       moveOffset,
       force = false;
-  if (gecko && node.nodeType == 1 && offset < nodeLen(node) && isIgnorable(node.childNodes[offset])) force = true;
+  if (gecko && node.nodeType == 1 && offset < nodeLen(node) && isIgnorable(node.childNodes[offset], -1)) force = true;
 
   for (;;) {
     if (offset > 0) {
@@ -2800,7 +2809,7 @@ function skipIgnoredNodesBefore(view) {
       } else {
         var before = node.childNodes[offset - 1];
 
-        if (isIgnorable(before)) {
+        if (isIgnorable(before, -1)) {
           moveNode = node;
           moveOffset = --offset;
         } else if (before.nodeType == 3) {
@@ -2813,7 +2822,7 @@ function skipIgnoredNodesBefore(view) {
     } else {
       var prev = node.previousSibling;
 
-      while (prev && isIgnorable(prev)) {
+      while (prev && isIgnorable(prev, -1)) {
         moveNode = node.parentNode;
         moveOffset = domIndex(prev);
         prev = prev.previousSibling;
@@ -2846,7 +2855,7 @@ function skipIgnoredNodesAfter(view) {
       if (node.nodeType != 1) break;
       var after = node.childNodes[offset];
 
-      if (isIgnorable(after)) {
+      if (isIgnorable(after, 1)) {
         moveNode = node;
         moveOffset = ++offset;
       } else break;
@@ -2855,7 +2864,7 @@ function skipIgnoredNodesAfter(view) {
     } else {
       var next = node.nextSibling;
 
-      while (next && isIgnorable(next)) {
+      while (next && isIgnorable(next, 1)) {
         moveNode = next.parentNode;
         moveOffset = domIndex(next) + 1;
         next = next.nextSibling;
@@ -2888,8 +2897,10 @@ function textNodeAfter(node, offset) {
   }
 
   while (node && offset < node.childNodes.length) {
-    node = node.childNodes[offset];
-    if (node.nodeType == 3) return node;
+    var next = node.childNodes[offset];
+    if (next.nodeType == 3) return next;
+    if (next.nodeType == 1 && next.contentEditable == "false") break;
+    node = next;
     offset = 0;
   }
 }
@@ -2901,8 +2912,10 @@ function textNodeBefore(node, offset) {
   }
 
   while (node && offset) {
-    node = node.childNodes[offset - 1];
-    if (node.nodeType == 3) return node;
+    var next = node.childNodes[offset - 1];
+    if (next.nodeType == 3) return next;
+    if (next.nodeType == 1 && next.contentEditable == "false") break;
+    node = next;
     offset = node.childNodes.length;
   }
 }
@@ -3059,7 +3072,7 @@ function captureKeyDown(view, event) {
   } else if (code == 38 || mac && code == 80 && mods == "c") {
     return selectVertically(view, -1, mods) || skipIgnoredNodes(view, -1);
   } else if (code == 40 || mac && code == 78 && mods == "c") {
-    return safariDownArrowBug(view) || selectVertically(view, 1, mods) || skipIgnoredNodesAfter(view);
+    return safariDownArrowBug(view) || selectVertically(view, 1, mods) || skipIgnoredNodes(view, 1);
   } else if (mods == (mac ? "m" : "c") && (code == 66 || code == 73 || code == 89 || code == 90)) {
     return true;
   }
@@ -4296,6 +4309,11 @@ var Decoration = function () {
     get: function get() {
       return this.type instanceof InlineType;
     }
+  }, {
+    key: "widget",
+    get: function get() {
+      return this.type instanceof WidgetType;
+    }
   }], [{
     key: "widget",
     value: function widget(pos, toDOM, spec) {
@@ -5928,6 +5946,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

@@ -2,9 +2,9 @@ import { EditorState, Transaction, Selection, Plugin } from 'prosemirror-state';
 import { Mark, Node, ParseRule, Slice, ResolvedPos, DOMParser, DOMSerializer } from 'prosemirror-model';
 import { Mapping } from 'prosemirror-transform';
 
-declare type DOMNode = InstanceType<typeof window.Node>;
+type DOMNode = InstanceType<typeof window.Node>;
 
-declare type WidgetConstructor = ((view: EditorView, getPos: () => number | undefined) => DOMNode) | DOMNode;
+type WidgetConstructor = ((view: EditorView, getPos: () => number | undefined) => DOMNode) | DOMNode;
 /**
 Decoration objects can be provided to the view through the
 [`decorations` prop](https://prosemirror.net/docs/ref/#view.EditorProps.decorations). They come in
@@ -125,7 +125,7 @@ A set of attributes to add to a decorated node. Most properties
 simply directly correspond to DOM attributes of the same name,
 which will be set to the property's value. These are exceptions:
 */
-declare type DecorationAttrs = {
+type DecorationAttrs = {
     /**
     When non-null, the target node is wrapped in a DOM element of
     this type (and the other attributes are applied to this element).
@@ -166,7 +166,8 @@ updates create a new value.
 declare class DecorationSet implements DecorationSource {
     /**
     Create a set of decorations, using the structure of the given
-    document.
+    document. This will consume (modify) the `decorations` array, so
+    you must make a copy if you want need to preserve that.
     */
     static create(doc: Node, decorations: Decoration[]): DecorationSet;
     /**
@@ -193,8 +194,9 @@ declare class DecorationSet implements DecorationSource {
     }): DecorationSet;
     /**
     Add the given array of decorations to the ones in the set,
-    producing a new set. Needs access to the current document to
-    create the appropriate tree structure.
+    producing a new set. Consumes the `decorations` array. Needs
+    access to the current document to create the appropriate tree
+    structure.
     */
     add(doc: Node, decorations: Decoration[]): DecorationSet;
     private addInner;
@@ -356,7 +358,7 @@ declare class NodeViewDesc extends ViewDesc {
     parseRule(): ParseRule | null;
     matchesNode(node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource): boolean;
     get size(): number;
-    get border(): 1 | 0;
+    get border(): 0 | 1;
     updateChildren(view: EditorView, pos: number): void;
     localCompositionInfo(view: EditorView, pos: number): {
         node: Text;
@@ -490,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
@@ -604,12 +611,12 @@ declare class EditorView {
 The type of function [provided](https://prosemirror.net/docs/ref/#view.EditorProps.nodeViews) to
 create [node views](https://prosemirror.net/docs/ref/#view.NodeView).
 */
-declare type NodeViewConstructor = (node: Node, view: EditorView, getPos: () => number | undefined, decorations: readonly Decoration[], innerDecorations: DecorationSource) => NodeView;
+type NodeViewConstructor = (node: Node, view: EditorView, getPos: () => number | undefined, decorations: readonly Decoration[], innerDecorations: DecorationSource) => NodeView;
 /**
 The function types [used](https://prosemirror.net/docs/ref/#view.EditorProps.markViews) to create
 mark views.
 */
-declare type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => {
+type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => {
     dom: HTMLElement;
     contentDOM?: HTMLElement;
 };

package/dist/index.d.ts

@@ -2,9 +2,9 @@ import { EditorState, Transaction, Selection, Plugin } from 'prosemirror-state';
 import { Mark, Node, ParseRule, Slice, ResolvedPos, DOMParser, DOMSerializer } from 'prosemirror-model';
 import { Mapping } from 'prosemirror-transform';
 
-declare type DOMNode = InstanceType<typeof window.Node>;
+type DOMNode = InstanceType<typeof window.Node>;
 
-declare type WidgetConstructor = ((view: EditorView, getPos: () => number | undefined) => DOMNode) | DOMNode;
+type WidgetConstructor = ((view: EditorView, getPos: () => number | undefined) => DOMNode) | DOMNode;
 /**
 Decoration objects can be provided to the view through the
 [`decorations` prop](https://prosemirror.net/docs/ref/#view.EditorProps.decorations). They come in
@@ -125,7 +125,7 @@ A set of attributes to add to a decorated node. Most properties
 simply directly correspond to DOM attributes of the same name,
 which will be set to the property's value. These are exceptions:
 */
-declare type DecorationAttrs = {
+type DecorationAttrs = {
     /**
     When non-null, the target node is wrapped in a DOM element of
     this type (and the other attributes are applied to this element).
@@ -166,7 +166,8 @@ updates create a new value.
 declare class DecorationSet implements DecorationSource {
     /**
     Create a set of decorations, using the structure of the given
-    document.
+    document. This will consume (modify) the `decorations` array, so
+    you must make a copy if you want need to preserve that.
     */
     static create(doc: Node, decorations: Decoration[]): DecorationSet;
     /**
@@ -193,8 +194,9 @@ declare class DecorationSet implements DecorationSource {
     }): DecorationSet;
     /**
     Add the given array of decorations to the ones in the set,
-    producing a new set. Needs access to the current document to
-    create the appropriate tree structure.
+    producing a new set. Consumes the `decorations` array. Needs
+    access to the current document to create the appropriate tree
+    structure.
     */
     add(doc: Node, decorations: Decoration[]): DecorationSet;
     private addInner;
@@ -356,7 +358,7 @@ declare class NodeViewDesc extends ViewDesc {
     parseRule(): ParseRule | null;
     matchesNode(node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource): boolean;
     get size(): number;
-    get border(): 1 | 0;
+    get border(): 0 | 1;
     updateChildren(view: EditorView, pos: number): void;
     localCompositionInfo(view: EditorView, pos: number): {
         node: Text;
@@ -490,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
@@ -604,12 +611,12 @@ declare class EditorView {
 The type of function [provided](https://prosemirror.net/docs/ref/#view.EditorProps.nodeViews) to
 create [node views](https://prosemirror.net/docs/ref/#view.NodeView).
 */
-declare type NodeViewConstructor = (node: Node, view: EditorView, getPos: () => number | undefined, decorations: readonly Decoration[], innerDecorations: DecorationSource) => NodeView;
+type NodeViewConstructor = (node: Node, view: EditorView, getPos: () => number | undefined, decorations: readonly Decoration[], innerDecorations: DecorationSource) => NodeView;
 /**
 The function types [used](https://prosemirror.net/docs/ref/#view.EditorProps.markViews) to create
 mark views.
 */
-declare type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => {
+type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => {
     dom: HTMLElement;
     contentDOM?: HTMLElement;
 };

package/dist/index.js

@@ -1,4 +1,4 @@
-import { TextSelection, NodeSelection, Selection, AllSelection } from 'prosemirror-state';
+import { TextSelection, NodeSelection, AllSelection, Selection } from 'prosemirror-state';
 import { DOMSerializer, Fragment, Mark, Slice, DOMParser } from 'prosemirror-model';
 import { dropPoint } from 'prosemirror-transform';
 
@@ -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 &&
@@ -1810,9 +1815,11 @@ class ViewTreeUpdater {
                 }
                 else if (!locked && (updated = this.recreateWrapper(next, node, outerDeco, innerDeco, view, pos))) {
                     this.top.children[this.index] = updated;
-                    updated.dirty = CONTENT_DIRTY;
-                    updated.updateChildren(view, pos + 1);
-                    updated.dirty = NOT_DIRTY;
+                    if (updated.contentDOM) {
+                        updated.dirty = CONTENT_DIRTY;
+                        updated.updateChildren(view, pos + 1);
+                        updated.dirty = NOT_DIRTY;
+                    }
                     this.changed = true;
                     this.index++;
                     return true;
@@ -1829,13 +1836,13 @@ class ViewTreeUpdater {
             !next.node.content.eq(node.content))
             return null;
         let wrapper = NodeViewDesc.create(this.top, node, outerDeco, innerDeco, view, pos);
-        if (!wrapper.contentDOM)
-            return null;
-        wrapper.children = next.children;
-        next.children = [];
+        if (wrapper.contentDOM) {
+            wrapper.children = next.children;
+            next.children = [];
+            for (let ch of wrapper.children)
+                ch.parent = wrapper;
+        }
         next.destroy();
-        for (let ch of wrapper.children)
-            ch.parent = wrapper;
         return wrapper;
     }
     // Insert the node as a newly created node desc.
@@ -1963,10 +1970,17 @@ function iterDeco(parent, deco, onWidget, onNode) {
     }
     let decoIndex = 0, active = [], restNode = null;
     for (let parentIndex = 0;;) {
-        if (decoIndex < locals.length && locals[decoIndex].to == offset) {
-            let widget = locals[decoIndex++], widgets;
-            while (decoIndex < locals.length && locals[decoIndex].to == offset)
-                (widgets || (widgets = [widget])).push(locals[decoIndex++]);
+        let widget, widgets;
+        while (decoIndex < locals.length && locals[decoIndex].to == offset) {
+            let next = locals[decoIndex++];
+            if (next.widget) {
+                if (!widget)
+                    widget = next;
+                else
+                    (widgets || (widgets = [widget])).push(next);
+            }
+        }
+        if (widget) {
             if (widgets) {
                 widgets.sort(compareSide);
                 for (let i = 0; i < widgets.length; i++)
@@ -2059,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;
@@ -2355,11 +2371,11 @@ function selectHorizontally(view, dir, mods) {
 function nodeLen(node) {
     return node.nodeType == 3 ? node.nodeValue.length : node.childNodes.length;
 }
-function isIgnorable(dom) {
+function isIgnorable(dom, dir) {
     if (dom.contentEditable == "false")
         return true;
     let desc = dom.pmViewDesc;
-    return desc && desc.size == 0 && (dom.nextSibling || dom.nodeName != "BR");
+    return desc && desc.size == 0 && (dir < 0 || dom.nextSibling || dom.nodeName != "BR");
 }
 function skipIgnoredNodes(view, dir) {
     return dir < 0 ? skipIgnoredNodesBefore(view) : skipIgnoredNodesAfter(view);
@@ -2375,7 +2391,7 @@ function skipIgnoredNodesBefore(view) {
     // Gecko will do odd things when the selection is directly in front
     // of a non-editable node, so in that case, move it into the next
     // node if possible. Issue prosemirror/prosemirror#832.
-    if (gecko && node.nodeType == 1 && offset < nodeLen(node) && isIgnorable(node.childNodes[offset]))
+    if (gecko && node.nodeType == 1 && offset < nodeLen(node) && isIgnorable(node.childNodes[offset], -1))
         force = true;
     for (;;) {
         if (offset > 0) {
@@ -2384,7 +2400,7 @@ function skipIgnoredNodesBefore(view) {
             }
             else {
                 let before = node.childNodes[offset - 1];
-                if (isIgnorable(before)) {
+                if (isIgnorable(before, -1)) {
                     moveNode = node;
                     moveOffset = --offset;
                 }
@@ -2401,7 +2417,7 @@ function skipIgnoredNodesBefore(view) {
         }
         else {
             let prev = node.previousSibling;
-            while (prev && isIgnorable(prev)) {
+            while (prev && isIgnorable(prev, -1)) {
                 moveNode = node.parentNode;
                 moveOffset = domIndex(prev);
                 prev = prev.previousSibling;
@@ -2437,7 +2453,7 @@ function skipIgnoredNodesAfter(view) {
             if (node.nodeType != 1)
                 break;
             let after = node.childNodes[offset];
-            if (isIgnorable(after)) {
+            if (isIgnorable(after, 1)) {
                 moveNode = node;
                 moveOffset = ++offset;
             }
@@ -2449,7 +2465,7 @@ function skipIgnoredNodesAfter(view) {
         }
         else {
             let next = node.nextSibling;
-            while (next && isIgnorable(next)) {
+            while (next && isIgnorable(next, 1)) {
                 moveNode = next.parentNode;
                 moveOffset = domIndex(next) + 1;
                 next = next.nextSibling;
@@ -2480,9 +2496,12 @@ function textNodeAfter(node, offset) {
         node = node.parentNode;
     }
     while (node && offset < node.childNodes.length) {
-        node = node.childNodes[offset];
-        if (node.nodeType == 3)
-            return node;
+        let next = node.childNodes[offset];
+        if (next.nodeType == 3)
+            return next;
+        if (next.nodeType == 1 && next.contentEditable == "false")
+            break;
+        node = next;
         offset = 0;
     }
 }
@@ -2492,9 +2511,12 @@ function textNodeBefore(node, offset) {
         node = node.parentNode;
     }
     while (node && offset) {
-        node = node.childNodes[offset - 1];
-        if (node.nodeType == 3)
-            return node;
+        let next = node.childNodes[offset - 1];
+        if (next.nodeType == 3)
+            return next;
+        if (next.nodeType == 1 && next.contentEditable == "false")
+            break;
+        node = next;
         offset = node.childNodes.length;
     }
 }
@@ -2656,7 +2678,7 @@ function captureKeyDown(view, event) {
         return selectVertically(view, -1, mods) || skipIgnoredNodes(view, -1);
     }
     else if (code == 40 || (mac && code == 78 && mods == "c")) { // Down arrow, Ctrl-n on Mac
-        return safariDownArrowBug(view) || selectVertically(view, 1, mods) || skipIgnoredNodesAfter(view);
+        return safariDownArrowBug(view) || selectVertically(view, 1, mods) || skipIgnoredNodes(view, 1);
     }
     else if (mods == (mac ? "m" : "c") &&
         (code == 66 || code == 73 || code == 89 || code == 90)) { // Mod-[biyz]
@@ -3814,6 +3836,10 @@ class Decoration {
     @internal
     */
     get inline() { return this.type instanceof InlineType; }
+    /**
+    @internal
+    */
+    get widget() { return this.type instanceof WidgetType; }
 }
 const none = [], noSpec = {};
 /**
@@ -3832,7 +3858,8 @@ class DecorationSet {
     }
     /**
     Create a set of decorations, using the structure of the given
-    document.
+    document. This will consume (modify) the `decorations` array, so
+    you must make a copy if you want need to preserve that.
     */
     static create(doc, decorations) {
         return decorations.length ? buildTree(decorations, doc, 0, noSpec) : empty;
@@ -3891,8 +3918,9 @@ class DecorationSet {
     }
     /**
     Add the given array of decorations to the ones in the set,
-    producing a new set. Needs access to the current document to
-    create the appropriate tree structure.
+    producing a new set. Consumes the `decorations` array. Needs
+    access to the current document to create the appropriate tree
+    structure.
     */
     add(doc, decorations) {
         if (!decorations.length)
@@ -5333,6 +5361,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.7",
+  "version": "1.32.0",
   "description": "ProseMirror's view component",
   "type": "module",
   "main": "dist/index.cjs",

package/src/capturekeys.ts

@@ -54,10 +54,10 @@ function nodeLen(node: Node) {
   return node.nodeType == 3 ? node.nodeValue!.length : node.childNodes.length
 }
 
-function isIgnorable(dom: Node) {
+function isIgnorable(dom: Node, dir: number) {
   if ((dom as HTMLElement).contentEditable == "false") return true
   let desc = dom.pmViewDesc
-  return desc && desc.size == 0 && (dom.nextSibling || dom.nodeName != "BR")
+  return desc && desc.size == 0 && (dir < 0 || dom.nextSibling || dom.nodeName != "BR")
 }
 
 function skipIgnoredNodes(view: EditorView, dir: number) {
@@ -74,14 +74,14 @@ function skipIgnoredNodesBefore(view: EditorView) {
   // Gecko will do odd things when the selection is directly in front
   // of a non-editable node, so in that case, move it into the next
   // node if possible. Issue prosemirror/prosemirror#832.
-  if (browser.gecko && node.nodeType == 1 && offset < nodeLen(node) && isIgnorable(node.childNodes[offset])) force = true
+  if (browser.gecko && node.nodeType == 1 && offset < nodeLen(node) && isIgnorable(node.childNodes[offset], -1)) force = true
   for (;;) {
     if (offset > 0) {
       if (node.nodeType != 1) {
         break
       } else {
         let before = node.childNodes[offset - 1]
-        if (isIgnorable(before)) {
+        if (isIgnorable(before, -1)) {
           moveNode = node
           moveOffset = --offset
         } else if (before.nodeType == 3) {
@@ -93,7 +93,7 @@ function skipIgnoredNodesBefore(view: EditorView) {
       break
     } else {
       let prev = node.previousSibling
-      while (prev && isIgnorable(prev)) {
+      while (prev && isIgnorable(prev, -1)) {
         moveNode = node.parentNode
         moveOffset = domIndex(prev)
         prev = prev.previousSibling
@@ -124,7 +124,7 @@ function skipIgnoredNodesAfter(view: EditorView) {
     if (offset < len) {
       if (node.nodeType != 1) break
       let after = node.childNodes[offset]
-      if (isIgnorable(after)) {
+      if (isIgnorable(after, 1)) {
         moveNode = node
         moveOffset = ++offset
       }
@@ -133,7 +133,7 @@ function skipIgnoredNodesAfter(view: EditorView) {
       break
     } else {
       let next = node.nextSibling
-      while (next && isIgnorable(next)) {
+      while (next && isIgnorable(next, 1)) {
         moveNode = next.parentNode
         moveOffset = domIndex(next) + 1
         next = next.nextSibling
@@ -163,8 +163,10 @@ function textNodeAfter(node: Node | null, offset: number): Text | undefined {
     node = node.parentNode
   }
   while (node && offset < node.childNodes.length) {
-    node = node.childNodes[offset]
-    if (node.nodeType == 3) return node as Text
+    let next = node.childNodes[offset]
+    if (next.nodeType == 3) return next as Text
+    if (next.nodeType == 1 && (next as HTMLElement).contentEditable == "false") break
+    node = next
     offset = 0
   }
 }
@@ -175,8 +177,10 @@ function textNodeBefore(node: Node | null, offset: number): Text | undefined {
     node = node.parentNode
   }
   while (node && offset) {
-    node = node.childNodes[offset - 1]
-    if (node.nodeType == 3) return node as Text
+    let next = node.childNodes[offset - 1]
+    if (next.nodeType == 3) return next as Text
+    if (next.nodeType == 1 && (next as HTMLElement).contentEditable == "false") break
+    node = next
     offset = node.childNodes.length
   }
 }
@@ -327,7 +331,7 @@ export function captureKeyDown(view: EditorView, event: KeyboardEvent) {
   } else if (code == 38 || (browser.mac && code == 80 && mods == "c")) { // Up arrow, Ctrl-p on Mac
     return selectVertically(view, -1, mods) || skipIgnoredNodes(view, -1)
   } else if (code == 40 || (browser.mac && code == 78 && mods == "c")) { // Down arrow, Ctrl-n on Mac
-    return safariDownArrowBug(view) || selectVertically(view, 1, mods) || skipIgnoredNodesAfter(view)
+    return safariDownArrowBug(view) || selectVertically(view, 1, mods) || skipIgnoredNodes(view, 1)
   } else if (mods == (browser.mac ? "m" : "c") &&
              (code == 66 || code == 73 || code == 89 || code == 90)) { // Mod-[biyz]
     return true

package/src/decoration.ts

@@ -223,6 +223,9 @@ export class Decoration {
 
   /// @internal
   get inline() { return this.type instanceof InlineType }
+
+  /// @internal
+  get widget() { return this.type instanceof WidgetType }
 }
 
 /// A set of attributes to add to a decorated node. Most properties
@@ -278,7 +281,8 @@ export class DecorationSet implements DecorationSource {
   }
 
   /// Create a set of decorations, using the structure of the given
-  /// document.
+  /// document. This will consume (modify) the `decorations` array, so
+  /// you must make a copy if you want need to preserve that.
   static create(doc: Node, decorations: Decoration[]) {
     return decorations.length ? buildTree(decorations, doc, 0, noSpec) : empty
   }
@@ -302,7 +306,7 @@ export class DecorationSet implements DecorationSource {
         result.push(span.copy(span.from + offset, span.to + offset))
     }
     for (let i = 0; i < this.children.length; i += 3) {
-      if (this.children[i] < end && this.children[i + 1] > start) {
+      if ((this.children[i] as number) < end && (this.children[i + 1] as number) > start) {
         let childOff = (this.children[i] as number) + 1
         ;(this.children[i + 2] as DecorationSet).findInner(start - childOff, end - childOff,
                                                            result, offset + childOff, predicate)
@@ -340,8 +344,9 @@ export class DecorationSet implements DecorationSource {
   }
 
   /// Add the given array of decorations to the ones in the set,
-  /// producing a new set. Needs access to the current document to
-  /// create the appropriate tree structure.
+  /// producing a new set. Consumes the `decorations` array. Needs
+  /// access to the current document to create the appropriate tree
+  /// structure.
   add(doc: Node, decorations: Decoration[]) {
     if (!decorations.length) return this
     if (this == empty) return DecorationSet.create(doc, decorations)
@@ -355,7 +360,7 @@ export class DecorationSet implements DecorationSource {
       if (!(found = takeSpansForNode(decorations, childNode, baseOffset))) return
 
       if (!children) children = this.children.slice()
-      while (childIndex < children.length && children[childIndex] < childOffset) childIndex += 3
+      while (childIndex < children.length && (children[childIndex] as number) < childOffset) childIndex += 3
       if (children[childIndex] == childOffset)
         children[childIndex + 2] = (children[childIndex + 2] as DecorationSet).addInner(childNode, found, baseOffset + 1)
       else
@@ -414,7 +419,7 @@ export class DecorationSet implements DecorationSource {
     if (node.isLeaf) return DecorationSet.empty
 
     let child, local: Decoration[] | undefined
-    for (let i = 0; i < this.children.length; i += 3) if (this.children[i] >= offset) {
+    for (let i = 0; i < this.children.length; i += 3) if ((this.children[i] as number) >= offset) {
       if (this.children[i] == offset) child = this.children[i + 2] as DecorationSet
       break
     }
@@ -576,7 +581,7 @@ function mapChildren(
   // Find the child nodes that still correspond to a single node,
   // recursively call mapInner on them and update their positions.
   let mustRebuild = false
-  for (let i = 0; i < children.length; i += 3) if (children[i + 1] < 0) { // Touched nodes
+  for (let i = 0; i < children.length; i += 3) if ((children[i + 1] as number) < 0) { // Touched nodes
     if (children[i + 1] == -2) {
       mustRebuild = true
       children[i + 1] = -1
@@ -613,7 +618,7 @@ function mapChildren(
                                                        offset, oldOffset, options)
     let built = buildTree(decorations, node, 0, options)
     newLocal = built.local as Decoration[]
-    for (let i = 0; i < children.length; i += 3) if (children[i + 1] < 0) {
+    for (let i = 0; i < children.length; i += 3) if ((children[i + 1] as number) < 0) {
       children.splice(i, 3)
       i -= 3
     }

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

@@ -387,7 +387,7 @@ export class ViewDesc {
         brKludge = !!(offset && node.nodeValue![offset - 1] == "\n")
         // Issue #1128
         if (brKludge && offset == node.nodeValue!.length) {
-          for (let scan: DOMNode | null = node, after; scan; scan = scan.parentNode) {
+           for (let scan: DOMNode | null = node, after; scan; scan = scan.parentNode) {
             if (after = scan.nextSibling) {
               if (after.nodeName == "BR")
                 anchorDOM = headDOM = {node: after.parentNode!, offset: domIndex(after) + 1}
@@ -1244,9 +1244,11 @@ class ViewTreeUpdater {
           return true
         } else if (!locked && (updated = this.recreateWrapper(next, node, outerDeco, innerDeco, view, pos))) {
           this.top.children[this.index] = updated
-          updated.dirty = CONTENT_DIRTY
-          updated.updateChildren(view, pos + 1)
-          updated.dirty = NOT_DIRTY
+          if (updated.contentDOM) {
+            updated.dirty = CONTENT_DIRTY
+            updated.updateChildren(view, pos + 1)
+            updated.dirty = NOT_DIRTY
+          }
           this.changed = true
           this.index++
           return true
@@ -1264,12 +1266,12 @@ class ViewTreeUpdater {
     if (next.dirty || node.isAtom || !next.children.length ||
         !next.node.content.eq(node.content)) return null
     let wrapper = NodeViewDesc.create(this.top, node, outerDeco, innerDeco, view, pos)
-    if (!wrapper.contentDOM) return null
-    wrapper.children = next.children
-    next.children = []
+    if (wrapper.contentDOM) {
+      wrapper.children = next.children
+      next.children = []
+      for (let ch of wrapper.children) ch.parent = wrapper
+    }
     next.destroy()
-    for (let ch of wrapper.children) ch.parent = wrapper
-   
     return wrapper
   }
 
@@ -1403,10 +1405,15 @@ function iterDeco(
 
   let decoIndex = 0, active = [], restNode = null
   for (let parentIndex = 0;;) {
-    if (decoIndex < locals.length && locals[decoIndex].to == offset) {
-      let widget = locals[decoIndex++], widgets
-      while (decoIndex < locals.length && locals[decoIndex].to == offset)
-        (widgets || (widgets = [widget])).push(locals[decoIndex++])
+    let widget, widgets
+    while (decoIndex < locals.length && locals[decoIndex].to == offset) {
+      let next = locals[decoIndex++]
+      if (next.widget) {
+        if (!widget) widget = next
+        else (widgets || (widgets = [widget])).push(next)
+      }
+    }
+    if (widget) {
       if (widgets) {
         widgets.sort(compareSide)
         for (let i = 0; i < widgets.length; i++) onWidget(widgets[i], parentIndex, !!restNode)
@@ -1492,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