prosemirror-view 1.27.1 → 1.27.2

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+## 1.27.2 (2022-08-19)
+
+### Bug fixes
+
+Fix an issue where `DecorationSet.map`, given a mapping with multiple steps, could in some cases corrupt the decorations.
+
+Stop calling `handleClick` when the mouse moved but failed to fire mousemove events (for example when dragging a scrollbar).
+
 ## 1.27.1 (2022-08-16)
 
 ### Bug fixes

package/dist/index.cjs

@@ -3556,6 +3556,7 @@ var MouseDown = function () {
       if (!this.view.dom.contains(event.target)) return;
       var pos = this.pos;
       if (this.view.state.doc != this.startDoc) pos = this.view.posAtCoords(eventCoords(event));
+      this.updateAllowDefault(event);
 
       if (this.allowDefault || !pos) {
         setSelectionOrigin(this.view, "pointer");
@@ -3571,10 +3572,15 @@ var MouseDown = function () {
   }, {
     key: "move",
     value: function move(event) {
-      if (!this.allowDefault && (Math.abs(this.event.x - event.clientX) > 4 || Math.abs(this.event.y - event.clientY) > 4)) this.allowDefault = true;
+      this.updateAllowDefault(event);
       setSelectionOrigin(this.view, "pointer");
       if (event.buttons == 0) this.done();
     }
+  }, {
+    key: "updateAllowDefault",
+    value: function updateAllowDefault(event) {
+      if (!this.allowDefault && (Math.abs(this.event.x - event.clientX) > 4 || Math.abs(this.event.y - event.clientY) > 4)) this.allowDefault = true;
+    }
   }]);
 
   return MouseDown;
@@ -4416,15 +4422,15 @@ var DecorationGroup = function () {
 function mapChildren(oldChildren, newLocal, mapping, node, offset, oldOffset, options) {
   var children = oldChildren.slice();
 
-  var _loop4 = function _loop4(i) {
+  var _loop4 = function _loop4(i, _baseOffset) {
     var moved = 0;
     mapping.maps[i].forEach(function (oldStart, oldEnd, newStart, newEnd) {
       var dSize = newEnd - newStart - (oldEnd - oldStart);
 
       for (var _i12 = 0; _i12 < children.length; _i12 += 3) {
         var end = children[_i12 + 1];
-        if (end < 0 || oldStart > end + oldOffset - moved) continue;
-        var start = children[_i12] + oldOffset - moved;
+        if (end < 0 || oldStart > end + _baseOffset - moved) continue;
+        var start = children[_i12] + _baseOffset - moved;
 
         if (oldEnd >= start) {
           children[_i12 + 1] = oldStart <= start ? -2 : -1;
@@ -4436,10 +4442,12 @@ function mapChildren(oldChildren, newLocal, mapping, node, offset, oldOffset, op
 
       moved += dSize;
     });
+    _baseOffset = mapping.maps[i].map(_baseOffset, -1);
+    baseOffset = _baseOffset;
   };
 
-  for (var i = 0; i < mapping.maps.length; i++) {
-    _loop4(i);
+  for (var i = 0, baseOffset = oldOffset; i < mapping.maps.length; i++) {
+    _loop4(i, baseOffset);
   }
 
   var mustRebuild = false;
@@ -5085,16 +5093,6 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
   to = view.state.doc.resolve(to).after(shared + 1);
   var sel = view.state.selection;
   var parse = parseBetween(view, from, to);
-
-  if (chrome && view.cursorWrapper && parse.sel && parse.sel.anchor == view.cursorWrapper.deco.from && parse.sel.head == parse.sel.anchor) {
-    var text = view.cursorWrapper.deco.type.toDOM.nextSibling;
-    var size = text && text.nodeValue ? text.nodeValue.length : 1;
-    parse.sel = {
-      anchor: parse.sel.anchor + size,
-      head: parse.sel.anchor + size
-    };
-  }
-
   var doc = view.state.doc,
       compare = doc.slice(parse.from, parse.to);
   var preferredPos, preferredSide;
@@ -5137,6 +5135,14 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
     }
   }
 
+  if (chrome && view.cursorWrapper && parse.sel && parse.sel.anchor == view.cursorWrapper.deco.from && parse.sel.head == parse.sel.anchor) {
+    var size = change.endB - change.start;
+    parse.sel = {
+      anchor: parse.sel.anchor + size,
+      head: parse.sel.anchor + size
+    };
+  }
+
   view.input.domChangeCount++;
 
   if (view.state.selection.from < view.state.selection.to && change.start == change.endB && view.state.selection instanceof prosemirrorState.TextSelection) {
@@ -5207,12 +5213,11 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
       tr = view.state.tr;
       if (markChange.type == "add") tr.addMark(chFrom, chTo, markChange.mark);else tr.removeMark(chFrom, chTo, markChange.mark);
     } else if ($from.parent.child($from.index()).isText && $from.index() == $to.index() - ($to.textOffset ? 0 : 1)) {
-      var _text = $from.parent.textBetween($from.parentOffset, $to.parentOffset);
-
+      var text = $from.parent.textBetween($from.parentOffset, $to.parentOffset);
       if (view.someProp("handleTextInput", function (f) {
-        return f(view, chFrom, chTo, _text);
+        return f(view, chFrom, chTo, text);
       })) return;
-      tr = view.state.tr.insertText(_text, chFrom, chTo);
+      tr = view.state.tr.insertText(text, chFrom, chTo);
     }
   }
 

package/dist/index.js

@@ -3111,6 +3111,7 @@ class MouseDown {
         let pos = this.pos;
         if (this.view.state.doc != this.startDoc)
             pos = this.view.posAtCoords(eventCoords(event));
+        this.updateAllowDefault(event);
         if (this.allowDefault || !pos) {
             setSelectionOrigin(this.view, "pointer");
         }
@@ -3138,13 +3139,16 @@ class MouseDown {
         }
     }
     move(event) {
-        if (!this.allowDefault && (Math.abs(this.event.x - event.clientX) > 4 ||
-            Math.abs(this.event.y - event.clientY) > 4))
-            this.allowDefault = true;
+        this.updateAllowDefault(event);
         setSelectionOrigin(this.view, "pointer");
         if (event.buttons == 0)
             this.done();
     }
+    updateAllowDefault(event) {
+        if (!this.allowDefault && (Math.abs(this.event.x - event.clientX) > 4 ||
+            Math.abs(this.event.y - event.clientY) > 4))
+            this.allowDefault = true;
+    }
 }
 handlers.touchstart = view => {
     view.input.lastTouch = Date.now();
@@ -3965,15 +3969,15 @@ function mapChildren(oldChildren, newLocal, mapping, node, offset, oldOffset, op
     let children = oldChildren.slice();
     // Mark the children that are directly touched by changes, and
     // move those that are after the changes.
-    for (let i = 0; i < mapping.maps.length; i++) {
+    for (let i = 0, baseOffset = oldOffset; i < mapping.maps.length; i++) {
         let moved = 0;
         mapping.maps[i].forEach((oldStart, oldEnd, newStart, newEnd) => {
             let dSize = (newEnd - newStart) - (oldEnd - oldStart);
             for (let i = 0; i < children.length; i += 3) {
                 let end = children[i + 1];
-                if (end < 0 || oldStart > end + oldOffset - moved)
+                if (end < 0 || oldStart > end + baseOffset - moved)
                     continue;
-                let start = children[i] + oldOffset - moved;
+                let start = children[i] + baseOffset - moved;
                 if (oldEnd >= start) {
                     children[i + 1] = oldStart <= start ? -2 : -1;
                 }
@@ -3984,6 +3988,7 @@ function mapChildren(oldChildren, newLocal, mapping, node, offset, oldOffset, op
             }
             moved += dSize;
         });
+        baseOffset = mapping.maps[i].map(baseOffset, -1);
     }
     // Find the child nodes that still correspond to a single node,
     // recursively call mapInner on them and update their positions.
@@ -4531,14 +4536,6 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
     to = view.state.doc.resolve(to).after(shared + 1);
     let sel = view.state.selection;
     let parse = parseBetween(view, from, to);
-    // Chrome sometimes leaves the cursor before the inserted text when
-    // composing after a cursor wrapper. This moves it forward.
-    if (chrome && view.cursorWrapper && parse.sel && parse.sel.anchor == view.cursorWrapper.deco.from &&
-        parse.sel.head == parse.sel.anchor) {
-        let text = view.cursorWrapper.deco.type.toDOM.nextSibling;
-        let size = text && text.nodeValue ? text.nodeValue.length : 1;
-        parse.sel = { anchor: parse.sel.anchor + size, head: parse.sel.anchor + size };
-    }
     let doc = view.state.doc, compare = doc.slice(parse.from, parse.to);
     let preferredPos, preferredSide;
     // Prefer anchoring to end when Backspace is pressed
@@ -4573,6 +4570,13 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
             return;
         }
     }
+    // Chrome sometimes leaves the cursor before the inserted text when
+    // composing after a cursor wrapper. This moves it forward.
+    if (chrome && view.cursorWrapper && parse.sel && parse.sel.anchor == view.cursorWrapper.deco.from &&
+        parse.sel.head == parse.sel.anchor) {
+        let size = change.endB - change.start;
+        parse.sel = { anchor: parse.sel.anchor + size, head: parse.sel.anchor + size };
+    }
     view.input.domChangeCount++;
     // Handle the case where overwriting a selection by typing matches
     // the start or end of the selected content, creating a change

package/package.json

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

package/src/decoration.ts

@@ -550,14 +550,14 @@ function mapChildren(
 
   // Mark the children that are directly touched by changes, and
   // move those that are after the changes.
-  for (let i = 0; i < mapping.maps.length; i++) {
+  for (let i = 0, baseOffset = oldOffset; i < mapping.maps.length; i++) {
     let moved = 0
     mapping.maps[i].forEach((oldStart: number, oldEnd: number, newStart: number, newEnd: number) => {
       let dSize = (newEnd - newStart) - (oldEnd - oldStart)
       for (let i = 0; i < children.length; i += 3) {
         let end = children[i + 1] as number
-        if (end < 0 || oldStart > end + oldOffset - moved) continue
-        let start = (children[i] as number) + oldOffset - moved
+        if (end < 0 || oldStart > end + baseOffset - moved) continue
+        let start = (children[i] as number) + baseOffset - moved
         if (oldEnd >= start) {
           children[i + 1] = oldStart <= start ? -2 : -1
         } else if (newStart >= offset && dSize) {
@@ -567,6 +567,7 @@ function mapChildren(
       }
       moved += dSize
     })
+    baseOffset = mapping.maps[i].map(baseOffset, -1)
   }
 
   // Find the child nodes that still correspond to a single node,

package/src/domchange.ts

@@ -97,15 +97,6 @@ export function readDOMChange(view: EditorView, from: number, to: number, typeOv
   let sel = view.state.selection
   let parse = parseBetween(view, from, to)
 
-  // Chrome sometimes leaves the cursor before the inserted text when
-  // composing after a cursor wrapper. This moves it forward.
-  if (browser.chrome && view.cursorWrapper && parse.sel && parse.sel.anchor == view.cursorWrapper.deco.from &&
-      parse.sel.head == parse.sel.anchor) {
-    let text = (view.cursorWrapper.deco.type as any).toDOM.nextSibling as DOMNode
-    let size = text && text.nodeValue ? text.nodeValue.length : 1
-    parse.sel = {anchor: parse.sel.anchor + size, head: parse.sel.anchor + size}
-  }
-
   let doc = view.state.doc, compare = doc.slice(parse.from, parse.to)
   let preferredPos, preferredSide: "start" | "end"
   // Prefer anchoring to end when Backspace is pressed
@@ -138,6 +129,14 @@ export function readDOMChange(view: EditorView, from: number, to: number, typeOv
       return
     }
   }
+  // Chrome sometimes leaves the cursor before the inserted text when
+  // composing after a cursor wrapper. This moves it forward.
+  if (browser.chrome && view.cursorWrapper && parse.sel && parse.sel.anchor == view.cursorWrapper.deco.from &&
+      parse.sel.head == parse.sel.anchor) {
+    let size = change.endB - change.start
+    parse.sel = {anchor: parse.sel.anchor + size, head: parse.sel.anchor + size}
+  }
+
   view.input.domChangeCount++
   // Handle the case where overwriting a selection by typing matches
   // the start or end of the selected content, creating a change

package/src/input.ts

@@ -372,6 +372,7 @@ class MouseDown {
     let pos: {pos: number, inside: number} | null = this.pos
     if (this.view.state.doc != this.startDoc) pos = this.view.posAtCoords(eventCoords(event))
 
+    this.updateAllowDefault(event)
     if (this.allowDefault || !pos) {
       setSelectionOrigin(this.view, "pointer")
     } else if (handleSingleClick(this.view, pos.pos, pos.inside, event, this.selectNode)) {
@@ -398,12 +399,16 @@ class MouseDown {
   }
 
   move(event: MouseEvent) {
-    if (!this.allowDefault && (Math.abs(this.event.x - event.clientX) > 4 ||
-                               Math.abs(this.event.y - event.clientY) > 4))
-      this.allowDefault = true
+    this.updateAllowDefault(event)
     setSelectionOrigin(this.view, "pointer")
     if (event.buttons == 0) this.done()
   }
+
+  updateAllowDefault(event: MouseEvent) {
+    if (!this.allowDefault && (Math.abs(this.event.x - event.clientX) > 4 ||
+        Math.abs(this.event.y - event.clientY) > 4))
+      this.allowDefault = true
+  }
 }
 
 handlers.touchstart = view => {