prosemirror-view 1.41.4 → 1.41.6

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## 1.41.6 (2026-02-06)
+
+### Bug fixes
+
+Fix an issue where backspacing content before a flexbox or grid styled widget would insert a bogus line break on Firefox.
+
+## 1.41.5 (2026-01-14)
+
+### Bug fixes
+
+Work around an issue where, after some kinds of changes, Chrome misreports the cursor position and breaks composition.
+
+Improve DOM update behavior when deleting three or more nodes right before a mark, which would unnecessarily re-render the entire mark.
+
+Work around a newly introduced bug in Safari where composition in an empty table cell causes it to move the text out of the cell into the row element.
+
 ## 1.41.4 (2025-12-01)
 
 ### Bug fixes

package/dist/index.cjs

@@ -1338,17 +1338,17 @@ var NodeViewDesc = function (_ViewDesc4) {
       var compositionInChild = composition && composition.pos < 0;
       var updater = new ViewTreeUpdater(this, localComposition && localComposition.node, view);
       iterDeco(this.node, this.innerDeco, function (widget, i, insideNode) {
-        if (widget.spec.marks) updater.syncToMarks(widget.spec.marks, inline, view);else if (widget.type.side >= 0 && !insideNode) updater.syncToMarks(i == _this6.node.childCount ? prosemirrorModel.Mark.none : _this6.node.child(i).marks, inline, view);
+        if (widget.spec.marks) updater.syncToMarks(widget.spec.marks, inline, view, i);else if (widget.type.side >= 0 && !insideNode) updater.syncToMarks(i == _this6.node.childCount ? prosemirrorModel.Mark.none : _this6.node.child(i).marks, inline, view, i);
         updater.placeWidget(widget, view, off);
       }, function (child, outerDeco, innerDeco, i) {
-        updater.syncToMarks(child.marks, inline, view);
+        updater.syncToMarks(child.marks, inline, view, i);
         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, off)) ;else {
           updater.addNode(child, outerDeco, innerDeco, view, off);
         }
         off += child.nodeSize;
       });
-      updater.syncToMarks([], inline, view);
+      updater.syncToMarks([], inline, view, 0);
       if (this.node.isTextblock) updater.addTextblockHacks();
       updater.destroyRest();
       if (updater.changed || this.dirty == CONTENT_DIRTY) {
@@ -1786,7 +1786,7 @@ var ViewTreeUpdater = function () {
     }
   }, {
     key: "syncToMarks",
-    value: function syncToMarks(marks, inline, view) {
+    value: function syncToMarks(marks, inline, view, parentIndex) {
       var keep = 0,
         depth = this.stack.length >> 1;
       var maxKeep = Math.min(depth, marks.length);
@@ -1800,8 +1800,10 @@ var ViewTreeUpdater = function () {
       }
       while (depth < marks.length) {
         this.stack.push(this.top, this.index + 1);
-        var found = -1;
-        for (var i = this.index; i < Math.min(this.index + 3, this.top.children.length); i++) {
+        var found = -1,
+          scanTo = this.top.children.length;
+        if (parentIndex < this.preMatch.index) scanTo = Math.min(this.index + 3, scanTo);
+        for (var i = this.index; i < scanTo; i++) {
           var next = this.top.children[i];
           if (next.matchesMark(marks[depth]) && !this.isLocked(next.dom)) {
             found = i;
@@ -2919,6 +2921,7 @@ var InputState = _createClass(function InputState() {
   this.compositionNodes = [];
   this.compositionEndedAt = -2e8;
   this.compositionID = 1;
+  this.badSafariComposition = false;
   this.compositionPendingChanges = 0;
   this.domChangeCount = 0;
   this.eventHandlers = Object.create(null);
@@ -3317,7 +3320,7 @@ editHandlers.compositionend = function (view, event) {
     view.input.compositionEndedAt = event.timeStamp;
     view.input.compositionPendingChanges = view.domObserver.pendingRecords().length ? view.input.compositionID : 0;
     view.input.compositionNode = null;
-    if (view.input.compositionPendingChanges) Promise.resolve().then(function () {
+    if (view.input.badSafariComposition) view.domObserver.forceFlush();else if (view.input.compositionPendingChanges) Promise.resolve().then(function () {
       return view.domObserver.flush();
     });
     view.input.compositionID++;
@@ -4235,7 +4238,16 @@ var DOMObserver = function () {
       for (var i = 0; i < mutations.length; i++) _this11.queue.push(mutations[i]);
       if (ie && ie_version <= 11 && mutations.some(function (m) {
         return m.type == "childList" && m.removedNodes.length || m.type == "characterData" && m.oldValue.length > m.target.nodeValue.length;
-      })) _this11.flushSoon();else _this11.flush();
+      })) {
+        _this11.flushSoon();
+      } else if (safari && view.composing && mutations.some(function (m) {
+        return m.type == "childList" && m.target.nodeName == "TR";
+      })) {
+        view.input.badSafariComposition = true;
+        _this11.flushSoon();
+      } else {
+        _this11.flush();
+      }
     });
     if (useCharData) {
       this.onCharData = function (e) {
@@ -4391,7 +4403,25 @@ var DOMObserver = function () {
           }
         }
       }
-      if (gecko && added.length) {
+      if (added.some(function (n) {
+        return n.nodeName == "BR";
+      }) && (view.input.lastKeyCode == 8 || view.input.lastKeyCode == 46)) {
+        var _iterator3 = _createForOfIteratorHelper(added),
+          _step3;
+        try {
+          for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+            var node = _step3.value;
+            if (node.nodeName == "BR" && node.parentNode) {
+              var after = node.nextSibling;
+              if (after && after.nodeType == 1 && after.contentEditable == "false") node.parentNode.removeChild(node);
+            }
+          }
+        } catch (err) {
+          _iterator3.e(err);
+        } finally {
+          _iterator3.f();
+        }
+      } else if (gecko && added.length) {
         var brs = added.filter(function (n) {
           return n.nodeName == "BR";
         });
@@ -4402,38 +4432,20 @@ var DOMObserver = function () {
           if (a.parentNode && a.parentNode.parentNode == b.parentNode) b.remove();else a.remove();
         } else {
           var focusNode = this.currentSelection.focusNode;
-          var _iterator3 = _createForOfIteratorHelper(brs),
-            _step3;
+          var _iterator4 = _createForOfIteratorHelper(brs),
+            _step4;
           try {
-            for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
-              var br = _step3.value;
+            for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
+              var br = _step4.value;
               var parent = br.parentNode;
               if (parent && parent.nodeName == "LI" && (!focusNode || blockParent(view, focusNode) != parent)) br.remove();
             }
           } catch (err) {
-            _iterator3.e(err);
+            _iterator4.e(err);
           } finally {
-            _iterator3.f();
+            _iterator4.f();
           }
         }
-      } else if ((chrome || safari) && added.some(function (n) {
-        return n.nodeName == "BR";
-      }) && (view.input.lastKeyCode == 8 || view.input.lastKeyCode == 46)) {
-        var _iterator4 = _createForOfIteratorHelper(added),
-          _step4;
-        try {
-          for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-            var node = _step4.value;
-            if (node.nodeName == "BR" && node.parentNode) {
-              var after = node.nextSibling;
-              if (after && after.nodeType == 1 && after.contentEditable == "false") node.parentNode.removeChild(node);
-            }
-          }
-        } catch (err) {
-          _iterator4.e(err);
-        } finally {
-          _iterator4.f();
-        }
       }
       var readSel = null;
       if (from < 0 && newSel && view.input.lastFocus > Date.now() - 200 && Math.max(view.input.lastTouch, view.input.lastClick.time) < Date.now() - 300 && selectionCollapsed(sel) && (readSel = selectionFromDOM(view)) && readSel.eq(prosemirrorState.Selection.near(view.state.doc.resolve(0), 1))) {
@@ -4446,6 +4458,10 @@ var DOMObserver = function () {
           view.docView.markDirty(from, to);
           checkCSS(view);
         }
+        if (view.input.badSafariComposition) {
+          view.input.badSafariComposition = false;
+          fixUpBadSafariComposition(view, added);
+        }
         this.handleDOMChange(from, to, typeOver, added);
         if (view.docView && view.docView.dirty) view.updateState(view.state);else if (!this.currentSelection.eq(sel)) selectionToDOM(view);
         this.currentSelection.set(sel);
@@ -4559,6 +4575,39 @@ function blockParent(view, node) {
   }
   return null;
 }
+function fixUpBadSafariComposition(view, addedNodes) {
+  var _a;
+  var _view$domSelectionRan5 = view.domSelectionRange(),
+    focusNode = _view$domSelectionRan5.focusNode,
+    focusOffset = _view$domSelectionRan5.focusOffset;
+  var _iterator5 = _createForOfIteratorHelper(addedNodes),
+    _step5;
+  try {
+    for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
+      var node = _step5.value;
+      if (((_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.nodeName) == "TR") {
+        var nextCell = node.nextSibling;
+        while (nextCell && nextCell.nodeName != "TD" && nextCell.nodeName != "TH") nextCell = nextCell.nextSibling;
+        if (nextCell) {
+          var parent = nextCell;
+          for (;;) {
+            var first = parent.firstChild;
+            if (!first || first.nodeType != 1 || first.contentEditable == "false" || /^(BR|IMG)$/.test(first.nodeName)) break;
+            parent = first;
+          }
+          parent.insertBefore(node, parent.firstChild);
+          if (focusNode == node) view.domSelection().collapse(node, focusOffset);
+        } else {
+          node.parentNode.removeChild(node);
+        }
+      }
+    }
+  } catch (err) {
+    _iterator5.e(err);
+  } finally {
+    _iterator5.f();
+  }
+}
 function parseBetween(view, from_, to_) {
   var _view$docView$parseRa = view.docView.parseRange(from_, to_),
     parent = _view$docView$parseRa.node,
@@ -5014,7 +5063,7 @@ var EditorView = function () {
             this.docView.destroy();
             this.docView = docViewDesc(state.doc, outerDeco, innerDeco, this.dom, this);
           }
-          if (chromeKludge && !this.trackWrites) forceSelUpdate = true;
+          if (chromeKludge && (!this.trackWrites || !this.dom.contains(this.trackWrites))) forceSelUpdate = true;
         }
         if (forceSelUpdate || !(this.input.mouseDown && this.domObserver.currentSelection.eq(this.domSelectionRange()) && anchorInRightPlace(this))) {
           selectionToDOM(this, forceSelUpdate);

package/dist/index.js

@@ -1376,15 +1376,15 @@ class NodeViewDesc extends ViewDesc {
         let updater = new ViewTreeUpdater(this, localComposition && localComposition.node, view);
         iterDeco(this.node, this.innerDeco, (widget, i, insideNode) => {
             if (widget.spec.marks)
-                updater.syncToMarks(widget.spec.marks, inline, view);
+                updater.syncToMarks(widget.spec.marks, inline, view, i);
             else if (widget.type.side >= 0 && !insideNode)
-                updater.syncToMarks(i == this.node.childCount ? Mark.none : this.node.child(i).marks, inline, view);
+                updater.syncToMarks(i == this.node.childCount ? Mark.none : this.node.child(i).marks, inline, view, i);
             // If the next node is a desc matching this widget, reuse it,
             // otherwise insert the widget as a new view desc.
             updater.placeWidget(widget, view, off);
         }, (child, outerDeco, innerDeco, i) => {
             // Make sure the wrapping mark descs match the node's marks.
-            updater.syncToMarks(child.marks, inline, view);
+            updater.syncToMarks(child.marks, inline, view, i);
             // Try several strategies for drawing this node
             let compIndex;
             if (updater.findNodeMatch(child, outerDeco, innerDeco, i)) ;
@@ -1400,7 +1400,7 @@ class NodeViewDesc extends ViewDesc {
             off += child.nodeSize;
         });
         // Drop all remaining descs after the current position.
-        updater.syncToMarks([], inline, view);
+        updater.syncToMarks([], inline, view, 0);
         if (this.node.isTextblock)
             updater.addTextblockHacks();
         updater.destroyRest();
@@ -1790,7 +1790,7 @@ class ViewTreeUpdater {
     }
     // Sync the current stack of mark descs with the given array of
     // marks, reusing existing mark descs when possible.
-    syncToMarks(marks, inline, view) {
+    syncToMarks(marks, inline, view, parentIndex) {
         let keep = 0, depth = this.stack.length >> 1;
         let maxKeep = Math.min(depth, marks.length);
         while (keep < maxKeep &&
@@ -1806,8 +1806,10 @@ class ViewTreeUpdater {
         }
         while (depth < marks.length) {
             this.stack.push(this.top, this.index + 1);
-            let found = -1;
-            for (let i = this.index; i < Math.min(this.index + 3, this.top.children.length); i++) {
+            let found = -1, scanTo = this.top.children.length;
+            if (parentIndex < this.preMatch.index)
+                scanTo = Math.min(this.index + 3, scanTo);
+            for (let i = this.index; i < scanTo; i++) {
                 let next = this.top.children[i];
                 if (next.matchesMark(marks[depth]) && !this.isLocked(next.dom)) {
                     found = i;
@@ -2003,9 +2005,7 @@ class ViewTreeUpdater {
 }
 // Iterate from the end of the fragment and array of descs to find
 // directly matching ones, in order to avoid overeagerly reusing those
-// for other nodes. Returns the fragment index of the first node that
-// is part of the sequence of matched nodes at the end of the
-// fragment.
+// for other nodes.
 function preMatch(frag, parentDesc) {
     let curDesc = parentDesc, descI = curDesc.children.length;
     let fI = frag.childCount, matched = new Map, matches = [];
@@ -2028,7 +2028,6 @@ function preMatch(frag, parentDesc) {
                 break outer;
             }
             else {
-                // FIXME
                 descI = curDesc.parent.children.indexOf(curDesc);
                 curDesc = curDesc.parent;
             }
@@ -3075,6 +3074,7 @@ class InputState {
         this.compositionNodes = [];
         this.compositionEndedAt = -2e8;
         this.compositionID = 1;
+        this.badSafariComposition = false;
         // Set to a composition ID when there are pending changes at compositionend
         this.compositionPendingChanges = 0;
         this.domChangeCount = 0;
@@ -3522,7 +3522,9 @@ editHandlers.compositionend = (view, event) => {
         view.input.compositionEndedAt = event.timeStamp;
         view.input.compositionPendingChanges = view.domObserver.pendingRecords().length ? view.input.compositionID : 0;
         view.input.compositionNode = null;
-        if (view.input.compositionPendingChanges)
+        if (view.input.badSafariComposition)
+            view.domObserver.forceFlush();
+        else if (view.input.compositionPendingChanges)
             Promise.resolve().then(() => view.domObserver.flush());
         view.input.compositionID++;
         scheduleComposeEnd(view, 20);
@@ -4585,15 +4587,24 @@ class DOMObserver {
             new window.MutationObserver(mutations => {
                 for (let i = 0; i < mutations.length; i++)
                     this.queue.push(mutations[i]);
-                // IE11 will sometimes (on backspacing out a single character
-                // text node after a BR node) call the observer callback
-                // before actually updating the DOM, which will cause
-                // ProseMirror to miss the change (see #930)
                 if (ie && ie_version <= 11 && mutations.some(m => m.type == "childList" && m.removedNodes.length ||
-                    m.type == "characterData" && m.oldValue.length > m.target.nodeValue.length))
+                    m.type == "characterData" && m.oldValue.length > m.target.nodeValue.length)) {
+                    // IE11 will sometimes (on backspacing out a single character
+                    // text node after a BR node) call the observer callback
+                    // before actually updating the DOM, which will cause
+                    // ProseMirror to miss the change (see #930)
                     this.flushSoon();
-                else
+                }
+                else if (safari && view.composing && mutations.some(m => m.type == "childList" && m.target.nodeName == "TR")) {
+                    // Safari does weird stuff when finishing a composition in a
+                    // table cell, which tends to involve inserting inappropriate
+                    // nodes in the table row.
+                    view.input.badSafariComposition = true;
+                    this.flushSoon();
+                }
+                else {
                     this.flush();
+                }
             });
         if (useCharData) {
             this.onCharData = e => {
@@ -4713,7 +4724,17 @@ class DOMObserver {
                 }
             }
         }
-        if (gecko && added.length) {
+        if (added.some(n => n.nodeName == "BR") && (view.input.lastKeyCode == 8 || view.input.lastKeyCode == 46)) {
+            // Browsers sometimes insert a bogus break node if you
+            // backspace out the last bit of text before an inline-flex node (#1552)
+            for (let node of added)
+                if (node.nodeName == "BR" && node.parentNode) {
+                    let after = node.nextSibling;
+                    if (after && after.nodeType == 1 && after.contentEditable == "false")
+                        node.parentNode.removeChild(node);
+                }
+        }
+        else if (gecko && added.length) {
             let brs = added.filter(n => n.nodeName == "BR");
             if (brs.length == 2) {
                 let [a, b] = brs;
@@ -4731,17 +4752,6 @@ class DOMObserver {
                 }
             }
         }
-        else if ((chrome || safari) && added.some(n => n.nodeName == "BR") &&
-            (view.input.lastKeyCode == 8 || view.input.lastKeyCode == 46)) {
-            // Chrome/Safari sometimes insert a bogus break node if you
-            // backspace out the last bit of text before an inline-flex node (#1552)
-            for (let node of added)
-                if (node.nodeName == "BR" && node.parentNode) {
-                    let after = node.nextSibling;
-                    if (after && after.nodeType == 1 && after.contentEditable == "false")
-                        node.parentNode.removeChild(node);
-                }
-        }
         let readSel = null;
         // If it looks like the browser has reset the selection to the
         // start of the document after focus, restore the selection from
@@ -4760,6 +4770,10 @@ class DOMObserver {
                 view.docView.markDirty(from, to);
                 checkCSS(view);
             }
+            if (view.input.badSafariComposition) {
+                view.input.badSafariComposition = false;
+                fixUpBadSafariComposition(view, added);
+            }
             this.handleDOMChange(from, to, typeOver, added);
             if (view.docView && view.docView.dirty)
                 view.updateState(view.state);
@@ -4883,6 +4897,37 @@ function blockParent(view, node) {
     }
     return null;
 }
+// Kludge for a Safari bug where, on ending a composition in an
+// otherwise empty table cell, it randomly moves the composed text
+// into the table row around that cell, greatly confusing everything
+// (#188).
+function fixUpBadSafariComposition(view, addedNodes) {
+    var _a;
+    let { focusNode, focusOffset } = view.domSelectionRange();
+    for (let node of addedNodes) {
+        if (((_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.nodeName) == "TR") {
+            let nextCell = node.nextSibling;
+            while (nextCell && (nextCell.nodeName != "TD" && nextCell.nodeName != "TH"))
+                nextCell = nextCell.nextSibling;
+            if (nextCell) {
+                let parent = nextCell;
+                for (;;) {
+                    let first = parent.firstChild;
+                    if (!first || first.nodeType != 1 || first.contentEditable == "false" ||
+                        /^(BR|IMG)$/.test(first.nodeName))
+                        break;
+                    parent = first;
+                }
+                parent.insertBefore(node, parent.firstChild);
+                if (focusNode == node)
+                    view.domSelection().collapse(node, focusOffset);
+            }
+            else {
+                node.parentNode.removeChild(node);
+            }
+        }
+    }
+}
 
 // Note that all referencing and parsing is done with the
 // start-of-operation selection and document, since that's the one
@@ -5455,7 +5500,7 @@ class EditorView {
                     this.docView.destroy();
                     this.docView = docViewDesc(state.doc, outerDeco, innerDeco, this.dom, this);
                 }
-                if (chromeKludge && !this.trackWrites)
+                if (chromeKludge && (!this.trackWrites || !this.dom.contains(this.trackWrites)))
                     forceSelUpdate = true;
             }
             // Work around for an issue where an update arriving right between

package/package.json

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

package/src/domchange.ts

@@ -81,7 +81,7 @@ const isInline = /^(a|abbr|acronym|b|bd[io]|big|br|button|cite|code|data(list)?|
 export function readDOMChange(view: EditorView, from: number, to: number, typeOver: boolean, addedNodes: readonly DOMNode[]) {
   let compositionID = view.input.compositionPendingChanges || (view.composing ? view.input.compositionID : 0)
   view.input.compositionPendingChanges = 0
-  
+
   if (from < 0) {
     let origin = view.input.lastSelectionTime > Date.now() - 50 ? view.input.lastSelectionOrigin : null
     let newSel = selectionFromDOM(view, origin)

package/src/domobserver.ts

@@ -52,16 +52,24 @@ export class DOMObserver {
     this.observer = window.MutationObserver &&
       new window.MutationObserver(mutations => {
         for (let i = 0; i < mutations.length; i++) this.queue.push(mutations[i])
-        // IE11 will sometimes (on backspacing out a single character
-        // text node after a BR node) call the observer callback
-        // before actually updating the DOM, which will cause
-        // ProseMirror to miss the change (see #930)
         if (browser.ie && browser.ie_version <= 11 && mutations.some(
           m => m.type == "childList" && m.removedNodes.length ||
-               m.type == "characterData" && m.oldValue!.length > m.target.nodeValue!.length))
+               m.type == "characterData" && m.oldValue!.length > m.target.nodeValue!.length)) {
+          // IE11 will sometimes (on backspacing out a single character
+          // text node after a BR node) call the observer callback
+          // before actually updating the DOM, which will cause
+          // ProseMirror to miss the change (see #930)
           this.flushSoon()
-        else
+        } else if (browser.safari && view.composing && mutations.some(
+          m => m.type == "childList" && m.target.nodeName == "TR")) {
+          // Safari does weird stuff when finishing a composition in a
+          // table cell, which tends to involve inserting inappropriate
+          // nodes in the table row.
+          view.input.badSafariComposition = true
+          this.flushSoon()
+        } else {
           this.flush()
+        }
       })
     if (useCharData) {
       this.onCharData = e => {
@@ -184,7 +192,15 @@ export class DOMObserver {
       }
     }
 
-    if (browser.gecko && added.length) {
+    if (added.some(n => n.nodeName == "BR") && (view.input.lastKeyCode == 8 || view.input.lastKeyCode == 46)) {
+      // Browsers sometimes insert a bogus break node if you
+      // backspace out the last bit of text before an inline-flex node (#1552)
+      for (let node of added) if (node.nodeName == "BR" && node.parentNode) {
+        let after = node.nextSibling
+        if (after && after.nodeType == 1 && (after as HTMLElement).contentEditable == "false")
+          node.parentNode.removeChild(node)
+      }
+    } else if (browser.gecko && added.length) {
       let brs = added.filter(n => n.nodeName == "BR") as HTMLElement[]
       if (brs.length == 2) {
         let [a, b] = brs
@@ -198,15 +214,6 @@ export class DOMObserver {
             br.remove()
         }
       }
-    } else if ((browser.chrome || browser.safari) && added.some(n => n.nodeName == "BR") &&
-               (view.input.lastKeyCode == 8 || view.input.lastKeyCode == 46)) {
-      // Chrome/Safari sometimes insert a bogus break node if you
-      // backspace out the last bit of text before an inline-flex node (#1552)
-      for (let node of added) if (node.nodeName == "BR" && node.parentNode) {
-        let after = node.nextSibling
-        if (after && after.nodeType == 1 && (after as HTMLElement).contentEditable == "false")
-          node.parentNode.removeChild(node)
-      }
     }
 
     let readSel: Selection | null = null
@@ -226,6 +233,10 @@ export class DOMObserver {
         view.docView.markDirty(from, to)
         checkCSS(view)
       }
+      if (view.input.badSafariComposition) {
+        view.input.badSafariComposition = false
+        fixUpBadSafariComposition(view, added)
+      }
       this.handleDOMChange(from, to, typeOver, added)
       if (view.docView && view.docView.dirty) view.updateState(view.state)
       else if (!this.currentSelection.eq(sel)) selectionToDOM(view)
@@ -347,3 +358,30 @@ function blockParent(view: EditorView, node: DOMNode): Node | null {
   }
   return null
 }
+
+// Kludge for a Safari bug where, on ending a composition in an
+// otherwise empty table cell, it randomly moves the composed text
+// into the table row around that cell, greatly confusing everything
+// (#188).
+function fixUpBadSafariComposition(view: EditorView, addedNodes: readonly DOMNode[]) {
+  let {focusNode, focusOffset} = view.domSelectionRange()
+  for (let node of addedNodes) {
+    if (node.parentNode?.nodeName == "TR") {
+      let nextCell = node.nextSibling
+      while (nextCell && (nextCell.nodeName != "TD" && nextCell.nodeName != "TH")) nextCell = nextCell.nextSibling
+      if (nextCell) {
+        let parent = nextCell
+        for (;;) {
+          let first = parent.firstChild
+          if (!first || first.nodeType != 1 || (first as HTMLElement).contentEditable == "false" ||
+              /^(BR|IMG)$/.test(first.nodeName)) break
+          parent = first
+        }
+        parent.insertBefore(node, parent.firstChild)
+        if (focusNode == node) view.domSelection()!.collapse(node, focusOffset)
+      } else {
+        node.parentNode.removeChild(node)
+      }
+    }
+  }
+}

package/src/index.ts

@@ -202,7 +202,7 @@ export class EditorView {
           this.docView.destroy()
           this.docView = docViewDesc(state.doc, outerDeco, innerDeco, this.dom, this)
         }
-        if (chromeKludge && !this.trackWrites) forceSelUpdate = true
+        if (chromeKludge && (!this.trackWrites || !this.dom.contains(this.trackWrites))) forceSelUpdate = true
       }
       // Work around for an issue where an update arriving right between
       // a DOM selection change and the "selectionchange" event for it

package/src/input.ts

@@ -35,6 +35,7 @@ export class InputState {
   compositionNodes: ViewDesc[] = []
   compositionEndedAt = -2e8
   compositionID = 1
+  badSafariComposition = false
   // Set to a composition ID when there are pending changes at compositionend
   compositionPendingChanges = 0
   domChangeCount = 0
@@ -504,7 +505,8 @@ editHandlers.compositionend = (view, event) => {
     view.input.compositionEndedAt = event.timeStamp
     view.input.compositionPendingChanges = view.domObserver.pendingRecords().length ? view.input.compositionID : 0
     view.input.compositionNode = null
-    if (view.input.compositionPendingChanges) Promise.resolve().then(() => view.domObserver.flush())
+    if (view.input.badSafariComposition) view.domObserver.forceFlush()
+    else if (view.input.compositionPendingChanges) Promise.resolve().then(() => view.domObserver.flush())
     view.input.compositionID++
     scheduleComposeEnd(view, 20)
   }

package/src/viewdesc.ts

@@ -772,15 +772,15 @@ export class NodeViewDesc extends ViewDesc {
     let updater = new ViewTreeUpdater(this, localComposition && localComposition.node, view)
     iterDeco(this.node, this.innerDeco, (widget, i, insideNode) => {
       if (widget.spec.marks)
-        updater.syncToMarks(widget.spec.marks, inline, view)
+        updater.syncToMarks(widget.spec.marks, inline, view, i)
       else if ((widget.type as WidgetType).side >= 0 && !insideNode)
-        updater.syncToMarks(i == this.node.childCount ? Mark.none : this.node.child(i).marks, inline, view)
+        updater.syncToMarks(i == this.node.childCount ? Mark.none : this.node.child(i).marks, inline, view, i)
       // If the next node is a desc matching this widget, reuse it,
       // otherwise insert the widget as a new view desc.
       updater.placeWidget(widget, view, off)
     }, (child, outerDeco, innerDeco, i) => {
       // Make sure the wrapping mark descs match the node's marks.
-      updater.syncToMarks(child.marks, inline, view)
+      updater.syncToMarks(child.marks, inline, view, i)
       // Try several strategies for drawing this node
       let compIndex
       if (updater.findNodeMatch(child, outerDeco, innerDeco, i)) {
@@ -799,7 +799,7 @@ export class NodeViewDesc extends ViewDesc {
       off += child.nodeSize
     })
     // Drop all remaining descs after the current position.
-    updater.syncToMarks([], inline, view)
+    updater.syncToMarks([], inline, view, 0)
     if (this.node.isTextblock) updater.addTextblockHacks()
     updater.destroyRest()
 
@@ -1197,7 +1197,7 @@ class ViewTreeUpdater {
 
   // Sync the current stack of mark descs with the given array of
   // marks, reusing existing mark descs when possible.
-  syncToMarks(marks: readonly Mark[], inline: boolean, view: EditorView) {
+  syncToMarks(marks: readonly Mark[], inline: boolean, view: EditorView, parentIndex: number) {
     let keep = 0, depth = this.stack.length >> 1
     let maxKeep = Math.min(depth, marks.length)
     while (keep < maxKeep &&
@@ -1214,8 +1214,9 @@ class ViewTreeUpdater {
     }
     while (depth < marks.length) {
       this.stack.push(this.top, this.index + 1)
-      let found = -1
-      for (let i = this.index; i < Math.min(this.index + 3, this.top.children.length); i++) {
+      let found = -1, scanTo = this.top.children.length
+      if (parentIndex < this.preMatch.index) scanTo = Math.min(this.index + 3, scanTo)
+      for (let i = this.index; i < scanTo; i++) {
         let next = this.top.children[i]
         if (next.matchesMark(marks[depth]) && !this.isLocked(next.dom)) { found = i; break }
       }
@@ -1404,12 +1405,16 @@ class ViewTreeUpdater {
 
 // Iterate from the end of the fragment and array of descs to find
 // directly matching ones, in order to avoid overeagerly reusing those
-// for other nodes. Returns the fragment index of the first node that
-// is part of the sequence of matched nodes at the end of the
-// fragment.
-function preMatch(
-  frag: Fragment, parentDesc: ViewDesc
-): {index: number, matched: Map<ViewDesc, number>, matches: readonly ViewDesc[]} {
+// for other nodes.
+function preMatch(frag: Fragment, parentDesc: ViewDesc): {
+  // The fragment index of the first node that is part of the sequence
+  // of matched nodes at the end of the fragment.
+  index: number,
+  // A map from matched descs to fragment indices.
+  matched: Map<ViewDesc, number>,
+  // The matched descs.
+  matches: readonly ViewDesc[]
+} {
   let curDesc = parentDesc, descI = curDesc.children.length
   let fI = frag.childCount, matched = new Map, matches = []
   outer: while (fI > 0) {
@@ -1428,7 +1433,6 @@ function preMatch(
       } else if (curDesc == parentDesc) {
         break outer
       } else {
-        // FIXME
         descI = curDesc.parent!.children.indexOf(curDesc)
         curDesc = curDesc.parent!
       }