prosemirror-view 1.33.5 → 1.33.7

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## 1.33.7 (2024-05-31)
+
+### Bug fixes
+
+Ignore stray `<br>` nodes added to parent list elements when backspacing near uneditable content in Firefox.
+
+Fix a crash where the editor tried to call `removeAttribute` on a text node.
+
+Fix an issue where coordinates near nested blocks could inappropriately be assigned to be inside those blocks.
+
+## 1.33.6 (2024-04-30)
+
+### Bug fixes
+
+Make sure the content slice stored for an in-editor drag is the one that was transformed by `transformCopied`.
+
 ## 1.33.5 (2024-04-22)
 
 ### Bug fixes

package/dist/index.cjs

@@ -1,5 +1,9 @@
 'use strict';
 
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
@@ -387,11 +391,11 @@ function posFromCaret(view, node, offset, coords) {
     if (cur == view.dom) break;
     var desc = view.docView.nearestDesc(cur, true);
     if (!desc) return null;
-    if (desc.dom.nodeType == 1 && (desc.node.isBlock && desc.parent && !sawBlock || !desc.contentDOM)) {
+    if (desc.dom.nodeType == 1 && (desc.node.isBlock && desc.parent || !desc.contentDOM)) {
       var rect = desc.dom.getBoundingClientRect();
-      if (desc.node.isBlock && desc.parent && !sawBlock) {
+      if (desc.node.isBlock && desc.parent) {
+        if (!sawBlock && rect.left > coords.left || rect.top > coords.top) outsideBlock = desc.posBefore;else if (!sawBlock && rect.right < coords.left || rect.bottom < coords.top) outsideBlock = desc.posAfter;
         sawBlock = true;
-        if (rect.left > coords.left || rect.top > coords.top) outsideBlock = desc.posBefore;else if (rect.right < coords.left || rect.bottom < coords.top) outsideBlock = desc.posAfter;
       }
       if (!desc.contentDOM && outsideBlock < 0 && !desc.node.isText) {
         var before = desc.node.isBlock ? coords.top < (rect.top + rect.bottom) / 2 : coords.left < (rect.left + rect.right) / 2;
@@ -1387,8 +1391,10 @@ var NodeViewDesc = function (_ViewDesc4) {
   }, {
     key: "deselectNode",
     value: function deselectNode() {
-      if (this.nodeDOM.nodeType == 1) this.nodeDOM.classList.remove("ProseMirror-selectednode");
-      if (this.contentDOM || !this.node.type.spec.draggable) this.dom.removeAttribute("draggable");
+      if (this.nodeDOM.nodeType == 1) {
+        this.nodeDOM.classList.remove("ProseMirror-selectednode");
+        if (this.contentDOM || !this.node.type.spec.draggable) this.dom.removeAttribute("draggable");
+      }
     }
   }, {
     key: "domAtom",
@@ -2602,7 +2608,8 @@ function serializeForClipboard(view, slice) {
   }) || slice.content.textBetween(0, slice.content.size, "\n\n");
   return {
     dom: wrap,
-    text: text
+    text: text,
+    slice: slice
   };
 }
 function parseFromClipboard(view, text, html, plainText, $context) {
@@ -3084,7 +3091,7 @@ var MouseDown = function () {
     }
     var target = flushed ? null : event.target;
     var targetDesc = target ? view.docView.nearestDesc(target, true) : null;
-    this.target = targetDesc ? targetDesc.dom : null;
+    this.target = targetDesc && targetDesc.dom.nodeType == 1 ? targetDesc.dom : null;
     var selection = view.state.selection;
     if (event.button == 0 && targetNode.type.spec.draggable && targetNode.type.spec.selectable !== false || selection instanceof prosemirrorState.NodeSelection && selection.from <= targetPos && selection.to > targetPos) this.mightDrag = {
       node: targetNode,
@@ -3366,10 +3373,11 @@ handlers.dragstart = function (view, _event) {
     var desc = view.docView.nearestDesc(event.target, true);
     if (desc && desc.node.type.spec.draggable && desc != view.docView) node = prosemirrorState.NodeSelection.create(view.state.doc, desc.posBefore);
   }
-  var slice = (node || view.state.selection).content(),
-    _serializeForClipboar2 = serializeForClipboard(view, slice),
+  var draggedSlice = (node || view.state.selection).content();
+  var _serializeForClipboar2 = serializeForClipboard(view, draggedSlice),
     dom = _serializeForClipboar2.dom,
-    text = _serializeForClipboar2.text;
+    text = _serializeForClipboar2.text,
+    slice = _serializeForClipboar2.slice;
   event.dataTransfer.clearData();
   event.dataTransfer.setData(brokenClipboardAPI ? "Text" : "text/html", dom.innerHTML);
   event.dataTransfer.effectAllowed = "copyMove";
@@ -4263,14 +4271,30 @@ var DOMObserver = function () {
           }
         }
       }
-      if (gecko && added.length > 1) {
+      if (gecko && added.length) {
         var brs = added.filter(function (n) {
           return n.nodeName == "BR";
         });
         if (brs.length == 2) {
-          var a = brs[0],
-            b = brs[1];
+          var _brs = _slicedToArray(brs, 2),
+            a = _brs[0],
+            b = _brs[1];
           if (a.parentNode && a.parentNode.parentNode == b.parentNode) b.remove();else a.remove();
+        } else {
+          var focusNode = this.currentSelection.focusNode;
+          var _iterator3 = _createForOfIteratorHelper(brs),
+            _step3;
+          try {
+            for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+              var br = _step3.value;
+              var parent = br.parentNode;
+              if (parent && parent.nodeName == "LI" && (!focusNode || blockParent(view, focusNode) != parent)) br.remove();
+            }
+          } catch (err) {
+            _iterator3.e(err);
+          } finally {
+            _iterator3.f();
+          }
         }
       }
       var readSel = null;
@@ -4385,6 +4409,13 @@ function safariShadowSelectionRange(view, selection) {
   view.dom.removeEventListener("beforeinput", read, true);
   return found ? rangeToSelectionRange(view, found) : null;
 }
+function blockParent(view, node) {
+  for (var p = node.parentNode; p && p != view.dom; p = p.parentNode) {
+    var desc = view.docView.nearestDesc(p, true);
+    if (desc && desc.node.isBlock) return p;
+  }
+  return null;
+}
 function parseBetween(view, from_, to_) {
   var _view$docView$parseRa = view.docView.parseRange(from_, to_),
     parent = _view$docView$parseRa.node,

package/dist/index.js

@@ -396,14 +396,15 @@ function posFromCaret(view, node, offset, coords) {
         let desc = view.docView.nearestDesc(cur, true);
         if (!desc)
             return null;
-        if (desc.dom.nodeType == 1 && (desc.node.isBlock && desc.parent && !sawBlock || !desc.contentDOM)) {
+        if (desc.dom.nodeType == 1 && (desc.node.isBlock && desc.parent || !desc.contentDOM)) {
             let rect = desc.dom.getBoundingClientRect();
-            if (desc.node.isBlock && desc.parent && !sawBlock) {
-                sawBlock = true;
-                if (rect.left > coords.left || rect.top > coords.top)
+            if (desc.node.isBlock && desc.parent) {
+                // Only apply the horizontal test to the innermost block. Vertical for any parent.
+                if (!sawBlock && rect.left > coords.left || rect.top > coords.top)
                     outsideBlock = desc.posBefore;
-                else if (rect.right < coords.left || rect.bottom < coords.top)
+                else if (!sawBlock && rect.right < coords.left || rect.bottom < coords.top)
                     outsideBlock = desc.posAfter;
+                sawBlock = true;
             }
             if (!desc.contentDOM && outsideBlock < 0 && !desc.node.isText) {
                 // If we are inside a leaf, return the side of the leaf closer to the coords
@@ -1452,10 +1453,11 @@ class NodeViewDesc extends ViewDesc {
     }
     // Remove selected node marking from this node.
     deselectNode() {
-        if (this.nodeDOM.nodeType == 1)
+        if (this.nodeDOM.nodeType == 1) {
             this.nodeDOM.classList.remove("ProseMirror-selectednode");
-        if (this.contentDOM || !this.node.type.spec.draggable)
-            this.dom.removeAttribute("draggable");
+            if (this.contentDOM || !this.node.type.spec.draggable)
+                this.dom.removeAttribute("draggable");
+        }
     }
     get domAtom() { return this.node.isAtom; }
 }
@@ -2753,7 +2755,7 @@ function serializeForClipboard(view, slice) {
         firstChild.setAttribute("data-pm-slice", `${openStart} ${openEnd}${wrappers ? ` -${wrappers}` : ""} ${JSON.stringify(context)}`);
     let text = view.someProp("clipboardTextSerializer", f => f(slice, view)) ||
         slice.content.textBetween(0, slice.content.size, "\n\n");
-    return { dom: wrap, text };
+    return { dom: wrap, text, slice };
 }
 // Read a slice of content from the clipboard (or drop data).
 function parseFromClipboard(view, text, html, plainText, $context) {
@@ -3270,7 +3272,7 @@ class MouseDown {
         }
         const target = flushed ? null : event.target;
         const targetDesc = target ? view.docView.nearestDesc(target, true) : null;
-        this.target = targetDesc ? targetDesc.dom : null;
+        this.target = targetDesc && targetDesc.dom.nodeType == 1 ? targetDesc.dom : null;
         let { selection } = view.state;
         if (event.button == 0 &&
             targetNode.type.spec.draggable && targetNode.type.spec.selectable !== false ||
@@ -3625,7 +3627,8 @@ handlers.dragstart = (view, _event) => {
         if (desc && desc.node.type.spec.draggable && desc != view.docView)
             node = NodeSelection.create(view.state.doc, desc.posBefore);
     }
-    let slice = (node || view.state.selection).content(), { dom, text } = serializeForClipboard(view, slice);
+    let draggedSlice = (node || view.state.selection).content();
+    let { dom, text, slice } = serializeForClipboard(view, draggedSlice);
     event.dataTransfer.clearData();
     event.dataTransfer.setData(brokenClipboardAPI ? "Text" : "text/html", dom.innerHTML);
     // See https://github.com/ProseMirror/prosemirror/issues/1156
@@ -4601,15 +4604,23 @@ class DOMObserver {
                 }
             }
         }
-        if (gecko && added.length > 1) {
+        if (gecko && added.length) {
             let brs = added.filter(n => n.nodeName == "BR");
             if (brs.length == 2) {
-                let a = brs[0], b = brs[1];
+                let [a, b] = brs;
                 if (a.parentNode && a.parentNode.parentNode == b.parentNode)
                     b.remove();
                 else
                     a.remove();
             }
+            else {
+                let { focusNode } = this.currentSelection;
+                for (let br of brs) {
+                    let parent = br.parentNode;
+                    if (parent && parent.nodeName == "LI" && (!focusNode || blockParent(view, focusNode) != parent))
+                        br.remove();
+                }
+            }
         }
         let readSel = null;
         // If it looks like the browser has reset the selection to the
@@ -4739,6 +4750,14 @@ function safariShadowSelectionRange(view, selection) {
     view.dom.removeEventListener("beforeinput", read, true);
     return found ? rangeToSelectionRange(view, found) : null;
 }
+function blockParent(view, node) {
+    for (let p = node.parentNode; p && p != view.dom; p = p.parentNode) {
+        let desc = view.docView.nearestDesc(p, true);
+        if (desc && desc.node.isBlock)
+            return p;
+    }
+    return null;
+}
 
 // Note that all referencing and parsing is done with the
 // start-of-operation selection and document, since that's the one

package/package.json

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

package/src/clipboard.ts

@@ -36,7 +36,7 @@ export function serializeForClipboard(view: EditorView, slice: Slice) {
   let text = view.someProp("clipboardTextSerializer", f => f(slice, view)) ||
       slice.content.textBetween(0, slice.content.size, "\n\n")
 
-  return {dom: wrap, text}
+  return {dom: wrap, text, slice}
 }
 
 // Read a slice of content from the clipboard (or drop data).

package/src/domcoords.ts

@@ -227,12 +227,13 @@ function posFromCaret(view: EditorView, node: Node, offset: number, coords: {top
     if (cur == view.dom) break
     let desc = view.docView.nearestDesc(cur, true)
     if (!desc) return null
-    if (desc.dom.nodeType == 1 && (desc.node.isBlock && desc.parent && !sawBlock || !desc.contentDOM)) {
+    if (desc.dom.nodeType == 1 && (desc.node.isBlock && desc.parent || !desc.contentDOM)) {
       let rect = (desc.dom as HTMLElement).getBoundingClientRect()
-      if (desc.node.isBlock && desc.parent && !sawBlock) {
+      if (desc.node.isBlock && desc.parent) {
+        // Only apply the horizontal test to the innermost block. Vertical for any parent.
+        if (!sawBlock && rect.left > coords.left || rect.top > coords.top) outsideBlock = desc.posBefore
+        else if (!sawBlock && rect.right < coords.left || rect.bottom < coords.top) outsideBlock = desc.posAfter
         sawBlock = true
-        if (rect.left > coords.left || rect.top > coords.top) outsideBlock = desc.posBefore
-        else if (rect.right < coords.left || rect.bottom < coords.top) outsideBlock = desc.posAfter
       }
       if (!desc.contentDOM && outsideBlock < 0 && !desc.node.isText) {
         // If we are inside a leaf, return the side of the leaf closer to the coords

package/src/domobserver.ts

@@ -183,12 +183,19 @@ export class DOMObserver {
       }
     }
 
-    if (browser.gecko && added.length > 1) {
-      let brs = added.filter(n => n.nodeName == "BR")
+    if (browser.gecko && added.length) {
+      let brs = added.filter(n => n.nodeName == "BR") as HTMLElement[]
       if (brs.length == 2) {
-        let a = brs[0] as HTMLElement, b = brs[1] as HTMLElement
+        let [a, b] = brs
         if (a.parentNode && a.parentNode.parentNode == b.parentNode) b.remove()
         else a.remove()
+      } else {
+        let {focusNode} = this.currentSelection
+        for (let br of brs) {
+          let parent = br.parentNode
+          if (parent && parent.nodeName == "LI" && (!focusNode || blockParent(view, focusNode) != parent))
+            br.remove()
+        }
       }
     }
 
@@ -317,3 +324,11 @@ export function safariShadowSelectionRange(view: EditorView, selection: DOMSelec
 
   return found ? rangeToSelectionRange(view, found) : null
 }
+
+function blockParent(view: EditorView, node: DOMNode): Node | null {
+  for (let p = node.parentNode; p && p != view.dom; p = p.parentNode) {
+    let desc = view.docView.nearestDesc(p, true)
+    if (desc && desc.node.isBlock) return p
+  }
+  return null
+}

package/src/input.ts

@@ -326,7 +326,7 @@ class MouseDown {
 
     const target = flushed ? null : event.target as HTMLElement
     const targetDesc = target ? view.docView.nearestDesc(target, true) : null
-    this.target = targetDesc ? targetDesc.dom as HTMLElement : null
+    this.target = targetDesc && targetDesc.dom.nodeType == 1 ? targetDesc.dom as HTMLElement : null
 
     let {selection} = view.state
     if (event.button == 0 &&
@@ -674,7 +674,8 @@ handlers.dragstart = (view, _event) => {
     if (desc && desc.node.type.spec.draggable && desc != view.docView)
       node = NodeSelection.create(view.state.doc, desc.posBefore)
   }
-  let slice = (node || view.state.selection).content(), {dom, text} = serializeForClipboard(view, slice)
+  let draggedSlice = (node || view.state.selection).content()
+  let {dom, text, slice} = serializeForClipboard(view, draggedSlice)
   event.dataTransfer.clearData()
   event.dataTransfer.setData(brokenClipboardAPI ? "Text" : "text/html", dom.innerHTML)
   // See https://github.com/ProseMirror/prosemirror/issues/1156

package/src/viewdesc.ts

@@ -834,8 +834,10 @@ export class NodeViewDesc extends ViewDesc {
 
   // Remove selected node marking from this node.
   deselectNode() {
-    if (this.nodeDOM.nodeType == 1) (this.nodeDOM as HTMLElement).classList.remove("ProseMirror-selectednode")
-    if (this.contentDOM || !this.node.type.spec.draggable) (this.dom as HTMLElement).removeAttribute("draggable")
+    if (this.nodeDOM.nodeType == 1) {
+      ;(this.nodeDOM as HTMLElement).classList.remove("ProseMirror-selectednode")
+      if (this.contentDOM || !this.node.type.spec.draggable) (this.dom as HTMLElement).removeAttribute("draggable")
+    }
   }
 
   get domAtom() { return this.node.isAtom }