prosemirror-view 1.18.10 → 1.18.11

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## 1.18.11 (2021-07-22)
+
+### Bug fixes
+
+Work around an issue where Chrome and Safari will replace some spaces with non-breaking spaces when putting HTML on the clipboard.
+
+When pasting as plain text (shift-mod-v) apply the marks at the selection to the inserted content.
+
+Fix flaky behavior when starting a composition with a selection that spans multiple blocks.
+
 ## 1.18.10 (2021-07-15)
 
 ### Bug fixes

package/dist/index.es.js

@@ -1039,7 +1039,7 @@ ViewDesc.prototype.markDirty = function markDirty (from, to) {
         else { child.markDirty(from - startInside, to - startInside); }
         return
       } else {
-        child.dirty = NODE_DIRTY;
+        child.dirty = child.dom == child.contentDOM && child.dom.parentNode == this.contentDOM ? CONTENT_DIRTY : NODE_DIRTY;
       }
     }
     offset = end;
@@ -1298,8 +1298,10 @@ var NodeViewDesc = /*@__PURE__*/(function (ViewDesc) {
     var this$1 = this;
 
     var inline = this.node.inlineContent, off = pos;
-    var composition = inline && view.composing && this.localCompositionNode(view, pos);
-    var updater = new ViewTreeUpdater(this, composition && composition.node);
+    var composition = view.composing && this.localCompositionInfo(view, pos);
+    var localComposition = composition && composition.pos > -1 ? composition : null;
+    var compositionInChild = composition && composition.pos < 0;
+    var updater = new ViewTreeUpdater(this, localComposition && localComposition.node);
     iterDeco(this.node, this.innerDeco, function (widget, i, insideNode) {
       if (widget.spec.marks)
         { updater.syncToMarks(widget.spec.marks, inline, view); }
@@ -1311,13 +1313,15 @@ var NodeViewDesc = /*@__PURE__*/(function (ViewDesc) {
     }, function (child, outerDeco, innerDeco, i) {
       // Make sure the wrapping mark descs match the node's marks.
       updater.syncToMarks(child.marks, inline, view);
-      // Either find an existing desc that exactly matches this node,
-      // and drop the descs before it.
-      updater.findNodeMatch(child, outerDeco, innerDeco, i) ||
-        // Or try updating the next desc to reflect this node.
-        updater.updateNextNode(child, outerDeco, innerDeco, view, i) ||
-        // Or just add it as a new desc.
+      // Try several strategies for drawing this node
+      var compIndex;
+      if (updater.findNodeMatch(child, outerDeco, innerDeco, i)) ; else if (compositionInChild && view.state.selection.from > off &&
+                 view.state.selection.to < off + child.nodeSize &&
+                 (compIndex = updater.findIndexWithChild(composition.node)) > -1 &&
+                 updater.updateNodeAt(child, outerDeco, innerDeco, compIndex, view)) ; else if (updater.updateNextNode(child, outerDeco, innerDeco, view, i)) ; else {
+        // Add it as a new view
         updater.addNode(child, outerDeco, innerDeco, view, off);
+      }
       off += child.nodeSize;
     });
     // Drop all remaining descs after the current position.
@@ -1328,16 +1332,15 @@ var NodeViewDesc = /*@__PURE__*/(function (ViewDesc) {
     // Sync the DOM if anything changed
     if (updater.changed || this.dirty == CONTENT_DIRTY) {
       // May have to protect focused DOM from being changed if a composition is active
-      if (composition) { this.protectLocalComposition(view, composition); }
+      if (localComposition) { this.protectLocalComposition(view, localComposition); }
       renderDescs(this.contentDOM, this.children, view);
       if (result.ios) { iosHacks(this.dom); }
     }
   };
 
-  NodeViewDesc.prototype.localCompositionNode = function localCompositionNode (view, pos) {
+  NodeViewDesc.prototype.localCompositionInfo = function localCompositionInfo (view, pos) {
     // Only do something if both the selection and a focused text node
-    // are inside of this node, and the node isn't already part of a
-    // view that's a child of this view
+    // are inside of this node
     var ref = view.state.selection;
     var from = ref.from;
     var to = ref.to;
@@ -1346,13 +1349,16 @@ var NodeViewDesc = /*@__PURE__*/(function (ViewDesc) {
     var textNode = nearbyTextNode(sel.focusNode, sel.focusOffset);
     if (!textNode || !this.dom.contains(textNode.parentNode)) { return }
 
-    // Find the text in the focused node in the node, stop if it's not
-    // there (may have been modified through other means, in which
-    // case it should overwritten)
-    var text = textNode.nodeValue;
-    var textPos = findTextInFragment(this.node.content, text, from - pos, to - pos);
-
-    return textPos < 0 ? null : {node: textNode, pos: textPos, text: text}
+    if (this.node.inlineContent) {
+      // Find the text in the focused node in the node, stop if it's not
+      // there (may have been modified through other means, in which
+      // case it should overwritten)
+      var text = textNode.nodeValue;
+      var textPos = findTextInFragment(this.node.content, text, from - pos, to - pos);
+      return textPos < 0 ? null : {node: textNode, pos: textPos, text: text}
+    } else {
+      return {node: textNode, pos: -1}
+    }
   };
 
   NodeViewDesc.prototype.protectLocalComposition = function protectLocalComposition (view, ref) {
@@ -1805,6 +1811,29 @@ ViewTreeUpdater.prototype.findNodeMatch = function findNodeMatch (node, outerDec
   return true
 };
 
+ViewTreeUpdater.prototype.updateNodeAt = function updateNodeAt (node, outerDeco, innerDeco, index, view) {
+  var child = this.top.children[index];
+  if (!child.update(node, outerDeco, innerDeco, view)) { return false }
+  this.destroyBetween(this.index, index);
+  this.index = index + 1;
+  return true
+};
+
+ViewTreeUpdater.prototype.findIndexWithChild = function findIndexWithChild (domNode) {
+  for (;;) {
+    var parent = domNode.parentNode;
+    if (!parent) { return -1 }
+    if (parent == this.top.contentDOM) {
+      var desc = domNode.pmViewDesc;
+      if (desc) { for (var i = this.index; i < this.top.children.length; i++) {
+        if (this.top.children[i] == desc) { return i }
+      } }
+      return -1
+    }
+    domNode = parent;
+  }
+};
+
 // : (Node, [Decoration], DecorationSource, EditorView, Fragment, number) → bool
 // Try to update the next node, if any, to the given data. Checks
 // pre-matches to avoid overwriting nodes that could still be used.
@@ -2894,14 +2923,19 @@ function parseFromClipboard(view, text, html, plainText, $context) {
     if (parsed) {
       slice = parsed;
     } else {
+      var marks = $context.marks();
+      var ref = view.state;
+      var schema = ref.schema;
+      var serializer = DOMSerializer.fromSchema(schema);
       dom = document.createElement("div");
       text.trim().split(/(?:\r\n?|\n)+/).forEach(function (block) {
-        dom.appendChild(document.createElement("p")).textContent = block;
+        dom.appendChild(document.createElement("p")).appendChild(serializer.serializeNode(schema.text(block, marks)));
       });
     }
   } else {
     view.someProp("transformPastedHTML", function (f) { html = f(html); });
     dom = readHTML(html);
+    if (result.webkit) { restoreReplacedSpaces(dom); }
   }
 
   var contextNode = dom && dom.querySelector("[data-pm-slice]");
@@ -3034,6 +3068,20 @@ function readHTML(html) {
   return elt
 }
 
+// Webkit browsers do some hard-to-predict replacement of regular
+// spaces with non-breaking spaces when putting content on the
+// clipboard. This tries to convert such non-breaking spaces (which
+// will be wrapped in a plain span on Chrome, a span with class
+// Apple-converted-space on Safari) back to regular spaces.
+function restoreReplacedSpaces(dom) {
+  var nodes = dom.querySelectorAll(result.chrome ? "span:not([class]):not([style])" : "span.Apple-converted-space");
+  for (var i = 0; i < nodes.length; i++) {
+    var node = nodes[i];
+    if (node.childNodes.length == 1 && node.textContent == "\u00a0" && node.parentNode)
+      { node.parentNode.replaceChild(dom.ownerDocument.createTextNode(" "), node); }
+  }
+}
+
 function addContext(slice, context) {
   if (!slice.size) { return slice }
   var schema = slice.content.firstChild.type.schema, array;