prosemirror-view 1.39.3 → 1.40.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+## 1.40.0 (2025-06-02)
+
+### Bug fixes
+
+Suppress lint warnings about dereferencing methods by making `EditorView.dispatch` a property instead of a method.
+
+### New features
+
+The `"handleTextInput"` prop now takes an additional argument that can be used to generate the default transaction for that text change.
+
+Widget decorations now support a `relaxedSide` option which can be used to allow the DOM cursor to appear at either side.
+
 ## 1.39.3 (2025-05-14)
 
 ### Bug fixes

package/dist/index.cjs

@@ -50,6 +50,7 @@ var isEquivalentPosition = function isEquivalentPosition(node, off, targetNode,
 };
 var atomElements = /^(img|br|input|textarea|hr)$/i;
 function scanFor(node, off, targetNode, targetOff, dir) {
+  var _a;
   for (;;) {
     if (node == targetNode && off == targetOff) return true;
     if (off == (dir < 0 ? 0 : nodeSize(node))) {
@@ -58,9 +59,13 @@ function scanFor(node, off, targetNode, targetOff, dir) {
       off = domIndex(node) + (dir < 0 ? 0 : 1);
       node = parent;
     } else if (node.nodeType == 1) {
-      node = node.childNodes[off + (dir < 0 ? -1 : 0)];
-      if (node.contentEditable == "false") return false;
-      off = dir < 0 ? nodeSize(node) : 0;
+      var child = node.childNodes[off + (dir < 0 ? -1 : 0)];
+      if (child.nodeType == 1 && child.contentEditable == "false") {
+        if ((_a = child.pmViewDesc) === null || _a === void 0 ? void 0 : _a.ignoreForSelection) off += dir;else return false;
+      } else {
+        node = child;
+        off = dir < 0 ? nodeSize(node) : 0;
+      }
     } else {
       return false;
     }
@@ -1063,6 +1068,11 @@ var ViewDesc = function () {
     get: function get() {
       return false;
     }
+  }, {
+    key: "ignoreForSelection",
+    get: function get() {
+      return false;
+    }
   }, {
     key: "isText",
     value: function isText(text) {
@@ -1132,6 +1142,11 @@ var WidgetViewDesc = function (_ViewDesc) {
     get: function get() {
       return true;
     }
+  }, {
+    key: "ignoreForSelection",
+    get: function get() {
+      return !!this.widget.type.spec.relaxedSide;
+    }
   }, {
     key: "side",
     get: function get() {
@@ -2991,9 +3006,12 @@ editHandlers.keypress = function (view, _event) {
   var sel = view.state.selection;
   if (!(sel instanceof prosemirrorState.TextSelection) || !sel.$from.sameParent(sel.$to)) {
     var text = String.fromCharCode(event.charCode);
+    var deflt = function deflt() {
+      return view.state.tr.insertText(text).scrollIntoView();
+    };
     if (!/[\r\n]/.test(text) && !view.someProp("handleTextInput", function (f) {
-      return f(view, sel.$from.pos, sel.$to.pos, text);
-    })) view.dispatch(view.state.tr.insertText(text).scrollIntoView());
+      return f(view, sel.$from.pos, sel.$to.pos, text, deflt);
+    })) view.dispatch(deflt());
     event.preventDefault();
   }
 };
@@ -4598,10 +4616,10 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
       if (chrome && android && view.input.lastKeyCode === 13 && Date.now() - 100 < view.input.lastKeyCodeTime && view.someProp("handleKeyDown", function (f) {
         return f(view, keyEvent(13, "Enter"));
       })) return;
-      var _tr = view.state.tr.setSelection(newSel);
-      if (origin == "pointer") _tr.setMeta("pointer", true);else if (origin == "key") _tr.scrollIntoView();
-      if (compositionID) _tr.setMeta("composition", compositionID);
-      view.dispatch(_tr);
+      var tr = view.state.tr.setSelection(newSel);
+      if (origin == "pointer") tr.setMeta("pointer", true);else if (origin == "key") tr.scrollIntoView();
+      if (compositionID) tr.setMeta("composition", compositionID);
+      view.dispatch(tr);
     }
     return;
   }
@@ -4643,9 +4661,9 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
       if (parse.sel) {
         var _sel2 = resolveSelection(view, view.state.doc, parse.sel);
         if (_sel2 && !_sel2.eq(view.state.selection)) {
-          var _tr2 = view.state.tr.setSelection(_sel2);
-          if (compositionID) _tr2.setMeta("composition", compositionID);
-          view.dispatch(_tr2);
+          var _tr = view.state.tr.setSelection(_sel2);
+          if (compositionID) _tr.setMeta("composition", compositionID);
+          view.dispatch(_tr);
         }
       }
       return;
@@ -4695,7 +4713,16 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
   }
   var chFrom = change.start,
     chTo = change.endA;
-  var tr, storedMarks, markChange;
+  var mkTr = function mkTr(base) {
+    var tr = base || view.state.tr.replace(chFrom, chTo, parse.doc.slice(change.start - parse.from, change.endB - parse.from));
+    if (parse.sel) {
+      var _sel3 = resolveSelection(view, tr.doc, parse.sel);
+      if (_sel3 && !(chrome && view.composing && _sel3.empty && (change.start != change.endB || view.input.lastChromeDelete < Date.now() - 100) && (_sel3.head == chFrom || _sel3.head == tr.mapping.map(chTo) - 1) || ie && _sel3.empty && _sel3.head == chFrom)) tr.setSelection(_sel3);
+    }
+    if (compositionID) tr.setMeta("composition", compositionID);
+    return tr.scrollIntoView();
+  };
+  var markChange;
   if (inlineChange) {
     if ($from.pos == $to.pos) {
       if (ie && ie_version <= 11 && $from.parentOffset == 0) {
@@ -4704,27 +4731,26 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
           return selectionToDOM(view);
         }, 20);
       }
-      tr = view.state.tr["delete"](chFrom, chTo);
-      storedMarks = doc.resolve(change.start).marksAcross(doc.resolve(change.endA));
+      var _tr2 = mkTr(view.state.tr["delete"](chFrom, chTo));
+      var marks = doc.resolve(change.start).marksAcross(doc.resolve(change.endA));
+      if (marks) _tr2.ensureMarks(marks);
+      view.dispatch(_tr2);
     } else if (change.endA == change.endB && (markChange = isMarkChange($from.parent.content.cut($from.parentOffset, $to.parentOffset), $fromA.parent.content.cut($fromA.parentOffset, change.endA - $fromA.start())))) {
-      tr = view.state.tr;
-      if (markChange.type == "add") tr.addMark(chFrom, chTo, markChange.mark);else tr.removeMark(chFrom, chTo, markChange.mark);
+      var _tr3 = mkTr(view.state.tr);
+      if (markChange.type == "add") _tr3.addMark(chFrom, chTo, markChange.mark);else _tr3.removeMark(chFrom, chTo, markChange.mark);
+      view.dispatch(_tr3);
     } 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);
-      if (view.someProp("handleTextInput", function (f) {
-        return f(view, chFrom, chTo, text);
-      })) return;
-      tr = view.state.tr.insertText(text, chFrom, chTo);
+      var deflt = function deflt() {
+        return mkTr(view.state.tr.insertText(text, chFrom, chTo));
+      };
+      if (!view.someProp("handleTextInput", function (f) {
+        return f(view, chFrom, chTo, text, deflt);
+      })) view.dispatch(deflt());
     }
+  } else {
+    view.dispatch(mkTr());
   }
-  if (!tr) tr = view.state.tr.replace(chFrom, chTo, parse.doc.slice(change.start - parse.from, change.endB - parse.from));
-  if (parse.sel) {
-    var _sel3 = resolveSelection(view, tr.doc, parse.sel);
-    if (_sel3 && !(chrome && view.composing && _sel3.empty && (change.start != change.endB || view.input.lastChromeDelete < Date.now() - 100) && (_sel3.head == chFrom || _sel3.head == tr.mapping.map(chTo) - 1) || ie && _sel3.empty && _sel3.head == chFrom)) tr.setSelection(_sel3);
-  }
-  if (storedMarks) tr.ensureMarks(storedMarks);
-  if (compositionID) tr.setMeta("composition", compositionID);
-  view.dispatch(tr.scrollIntoView());
 }
 function resolveSelection(view, doc, parsedSel) {
   if (Math.max(parsedSel.anchor, parsedSel.head) > doc.content.size) return null;
@@ -5168,12 +5194,6 @@ var EditorView = function () {
     value: function dispatchEvent(event) {
       return _dispatchEvent(this, event);
     }
-  }, {
-    key: "dispatch",
-    value: function dispatch(tr) {
-      var dispatchTransaction = this._props.dispatchTransaction;
-      if (dispatchTransaction) dispatchTransaction.call(this, tr);else this.updateState(this.state.apply(tr));
-    }
   }, {
     key: "domSelectionRange",
     value: function domSelectionRange() {
@@ -5194,6 +5214,10 @@ var EditorView = function () {
   }]);
   return EditorView;
 }();
+EditorView.prototype.dispatch = function (tr) {
+  var dispatchTransaction = this._props.dispatchTransaction;
+  if (dispatchTransaction) dispatchTransaction.call(this, tr);else this.updateState(this.state.apply(tr));
+};
 function computeDocDeco(view) {
   var attrs = Object.create(null);
   attrs["class"] = "ProseMirror";

package/dist/index.d.cts

@@ -48,6 +48,20 @@ declare class Decoration {
         */
         side?: number;
         /**
+        By default, the cursor, when at the position of the widget,
+        will be strictly kept on the side indicated by
+        [`side`](https://prosemirror.net/docs/ref/#view.Decoration^widget^spec.side). Set this to true
+        to allow the DOM selection to stay on the other side if the
+        client sets it there.
+        
+        **Note**: Mapping of this decoration, which decides on which
+        side insertions at its position appear, will still happen
+        according to `side`, and keyboard cursor motion will not,
+        without further custom handling, visit both sides of the
+        widget.
+        */
+        relaxedSide?: boolean;
+        /**
         The precise set of marks to draw around the widget.
         */
         marks?: readonly Mark[];
@@ -367,7 +381,6 @@ editable document. Its state and behavior are determined by its
 [props](https://prosemirror.net/docs/ref/#view.DirectEditorProps).
 */
 declare class EditorView {
-    private _props;
     private directPlugins;
     private _root;
     private mounted;
@@ -587,7 +600,7 @@ declare class EditorView {
     This method is bound to the view instance, so that it can be
     easily passed around.
     */
-    dispatch(tr: Transaction): void;
+    dispatch: (tr: Transaction) => void;
 }
 /**
 The type of function [provided](https://prosemirror.net/docs/ref/#view.EditorProps.nodeViews) to
@@ -652,7 +665,7 @@ interface EditorProps<P = any> {
     before the input is applied. If it returns `true`, the default
     behavior of actually inserting the text is suppressed.
     */
-    handleTextInput?: (this: P, view: EditorView, from: number, to: number, text: string) => boolean | void;
+    handleTextInput?: (this: P, view: EditorView, from: number, to: number, text: string, deflt: () => Transaction) => boolean | void;
     /**
     Called for each node around a click, from the inside out. The
     `direct` flag will be true for the inner node.

package/dist/index.d.ts

@@ -48,6 +48,20 @@ declare class Decoration {
         */
         side?: number;
         /**
+        By default, the cursor, when at the position of the widget,
+        will be strictly kept on the side indicated by
+        [`side`](https://prosemirror.net/docs/ref/#view.Decoration^widget^spec.side). Set this to true
+        to allow the DOM selection to stay on the other side if the
+        client sets it there.
+        
+        **Note**: Mapping of this decoration, which decides on which
+        side insertions at its position appear, will still happen
+        according to `side`, and keyboard cursor motion will not,
+        without further custom handling, visit both sides of the
+        widget.
+        */
+        relaxedSide?: boolean;
+        /**
         The precise set of marks to draw around the widget.
         */
         marks?: readonly Mark[];
@@ -367,7 +381,6 @@ editable document. Its state and behavior are determined by its
 [props](https://prosemirror.net/docs/ref/#view.DirectEditorProps).
 */
 declare class EditorView {
-    private _props;
     private directPlugins;
     private _root;
     private mounted;
@@ -587,7 +600,7 @@ declare class EditorView {
     This method is bound to the view instance, so that it can be
     easily passed around.
     */
-    dispatch(tr: Transaction): void;
+    dispatch: (tr: Transaction) => void;
 }
 /**
 The type of function [provided](https://prosemirror.net/docs/ref/#view.EditorProps.nodeViews) to
@@ -652,7 +665,7 @@ interface EditorProps<P = any> {
     before the input is applied. If it returns `true`, the default
     behavior of actually inserting the text is suppressed.
     */
-    handleTextInput?: (this: P, view: EditorView, from: number, to: number, text: string) => boolean | void;
+    handleTextInput?: (this: P, view: EditorView, from: number, to: number, text: string, deflt: () => Transaction) => boolean | void;
     /**
     Called for each node around a click, from the inside out. The
     `direct` flag will be true for the inner node.

package/dist/index.js

@@ -35,6 +35,7 @@ const isEquivalentPosition = function (node, off, targetNode, targetOff) {
 };
 const atomElements = /^(img|br|input|textarea|hr)$/i;
 function scanFor(node, off, targetNode, targetOff, dir) {
+    var _a;
     for (;;) {
         if (node == targetNode && off == targetOff)
             return true;
@@ -47,10 +48,17 @@ function scanFor(node, off, targetNode, targetOff, dir) {
             node = parent;
         }
         else if (node.nodeType == 1) {
-            node = node.childNodes[off + (dir < 0 ? -1 : 0)];
-            if (node.contentEditable == "false")
-                return false;
-            off = dir < 0 ? nodeSize(node) : 0;
+            let child = node.childNodes[off + (dir < 0 ? -1 : 0)];
+            if (child.nodeType == 1 && child.contentEditable == "false") {
+                if ((_a = child.pmViewDesc) === null || _a === void 0 ? void 0 : _a.ignoreForSelection)
+                    off += dir;
+                else
+                    return false;
+            }
+            else {
+                node = child;
+                off = dir < 0 ? nodeSize(node) : 0;
+            }
         }
         else {
             return false;
@@ -1134,6 +1142,7 @@ class ViewDesc {
     }
     get domAtom() { return false; }
     get ignoreForCoords() { return false; }
+    get ignoreForSelection() { return false; }
     isText(text) { return false; }
 }
 // A widget desc represents a widget decoration, which is a DOM node
@@ -1178,6 +1187,7 @@ class WidgetViewDesc extends ViewDesc {
         super.destroy();
     }
     get domAtom() { return true; }
+    get ignoreForSelection() { return !!this.widget.type.spec.relaxedSide; }
     get side() { return this.widget.type.side; }
 }
 class CompositionViewDesc extends ViewDesc {
@@ -3175,8 +3185,9 @@ editHandlers.keypress = (view, _event) => {
     let sel = view.state.selection;
     if (!(sel instanceof TextSelection) || !sel.$from.sameParent(sel.$to)) {
         let text = String.fromCharCode(event.charCode);
-        if (!/[\r\n]/.test(text) && !view.someProp("handleTextInput", f => f(view, sel.$from.pos, sel.$to.pos, text)))
-            view.dispatch(view.state.tr.insertText(text).scrollIntoView());
+        let deflt = () => view.state.tr.insertText(text).scrollIntoView();
+        if (!/[\r\n]/.test(text) && !view.someProp("handleTextInput", f => f(view, sel.$from.pos, sel.$to.pos, text, deflt)))
+            view.dispatch(deflt());
         event.preventDefault();
     }
 };
@@ -5061,7 +5072,26 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
         }, 20);
     }
     let chFrom = change.start, chTo = change.endA;
-    let tr, storedMarks, markChange;
+    let mkTr = (base) => {
+        let tr = base || view.state.tr.replace(chFrom, chTo, parse.doc.slice(change.start - parse.from, change.endB - parse.from));
+        if (parse.sel) {
+            let sel = resolveSelection(view, tr.doc, parse.sel);
+            // Chrome will sometimes, during composition, report the
+            // selection in the wrong place. If it looks like that is
+            // happening, don't update the selection.
+            // Edge just doesn't move the cursor forward when you start typing
+            // in an empty block or between br nodes.
+            if (sel && !(chrome && view.composing && sel.empty &&
+                (change.start != change.endB || view.input.lastChromeDelete < Date.now() - 100) &&
+                (sel.head == chFrom || sel.head == tr.mapping.map(chTo) - 1) ||
+                ie && sel.empty && sel.head == chFrom))
+                tr.setSelection(sel);
+        }
+        if (compositionID)
+            tr.setMeta("composition", compositionID);
+        return tr.scrollIntoView();
+    };
+    let markChange;
     if (inlineChange) {
         if ($from.pos == $to.pos) { // Deletion
             // IE11 sometimes weirdly moves the DOM selection around after
@@ -5070,46 +5100,33 @@ function readDOMChange(view, from, to, typeOver, addedNodes) {
                 view.domObserver.suppressSelectionUpdates();
                 setTimeout(() => selectionToDOM(view), 20);
             }
-            tr = view.state.tr.delete(chFrom, chTo);
-            storedMarks = doc.resolve(change.start).marksAcross(doc.resolve(change.endA));
+            let tr = mkTr(view.state.tr.delete(chFrom, chTo));
+            let marks = doc.resolve(change.start).marksAcross(doc.resolve(change.endA));
+            if (marks)
+                tr.ensureMarks(marks);
+            view.dispatch(tr);
         }
         else if ( // Adding or removing a mark
         change.endA == change.endB &&
             (markChange = isMarkChange($from.parent.content.cut($from.parentOffset, $to.parentOffset), $fromA.parent.content.cut($fromA.parentOffset, change.endA - $fromA.start())))) {
-            tr = view.state.tr;
+            let tr = mkTr(view.state.tr);
             if (markChange.type == "add")
                 tr.addMark(chFrom, chTo, markChange.mark);
             else
                 tr.removeMark(chFrom, chTo, markChange.mark);
+            view.dispatch(tr);
         }
         else if ($from.parent.child($from.index()).isText && $from.index() == $to.index() - ($to.textOffset ? 0 : 1)) {
             // Both positions in the same text node -- simply insert text
             let text = $from.parent.textBetween($from.parentOffset, $to.parentOffset);
-            if (view.someProp("handleTextInput", f => f(view, chFrom, chTo, text)))
-                return;
-            tr = view.state.tr.insertText(text, chFrom, chTo);
-        }
-    }
-    if (!tr)
-        tr = view.state.tr.replace(chFrom, chTo, parse.doc.slice(change.start - parse.from, change.endB - parse.from));
-    if (parse.sel) {
-        let sel = resolveSelection(view, tr.doc, parse.sel);
-        // Chrome will sometimes, during composition, report the
-        // selection in the wrong place. If it looks like that is
-        // happening, don't update the selection.
-        // Edge just doesn't move the cursor forward when you start typing
-        // in an empty block or between br nodes.
-        if (sel && !(chrome && view.composing && sel.empty &&
-            (change.start != change.endB || view.input.lastChromeDelete < Date.now() - 100) &&
-            (sel.head == chFrom || sel.head == tr.mapping.map(chTo) - 1) ||
-            ie && sel.empty && sel.head == chFrom))
-            tr.setSelection(sel);
-    }
-    if (storedMarks)
-        tr.ensureMarks(storedMarks);
-    if (compositionID)
-        tr.setMeta("composition", compositionID);
-    view.dispatch(tr.scrollIntoView());
+            let deflt = () => mkTr(view.state.tr.insertText(text, chFrom, chTo));
+            if (!view.someProp("handleTextInput", f => f(view, chFrom, chTo, text, deflt)))
+                view.dispatch(deflt());
+        }
+    }
+    else {
+        view.dispatch(mkTr());
+    }
 }
 function resolveSelection(view, doc, parsedSel) {
     if (Math.max(parsedSel.anchor, parsedSel.head) > doc.content.size)
@@ -5712,22 +5729,6 @@ class EditorView {
         return dispatchEvent(this, event);
     }
     /**
-    Dispatch a transaction. Will call
-    [`dispatchTransaction`](https://prosemirror.net/docs/ref/#view.DirectEditorProps.dispatchTransaction)
-    when given, and otherwise defaults to applying the transaction to
-    the current state and calling
-    [`updateState`](https://prosemirror.net/docs/ref/#view.EditorView.updateState) with the result.
-    This method is bound to the view instance, so that it can be
-    easily passed around.
-    */
-    dispatch(tr) {
-        let dispatchTransaction = this._props.dispatchTransaction;
-        if (dispatchTransaction)
-            dispatchTransaction.call(this, tr);
-        else
-            this.updateState(this.state.apply(tr));
-    }
-    /**
     @internal
     */
     domSelectionRange() {
@@ -5744,6 +5745,13 @@ class EditorView {
         return this.root.getSelection();
     }
 }
+EditorView.prototype.dispatch = function (tr) {
+    let dispatchTransaction = this._props.dispatchTransaction;
+    if (dispatchTransaction)
+        dispatchTransaction.call(this, tr);
+    else
+        this.updateState(this.state.apply(tr));
+};
 function computeDocDeco(view) {
     let attrs = Object.create(null);
     attrs.class = "ProseMirror";

package/package.json

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

package/src/decoration.ts

@@ -156,6 +156,19 @@ export class Decoration {
     /// negative, those of the node after when positive.
     side?: number
 
+    /// By default, the cursor, when at the position of the widget,
+    /// will be strictly kept on the side indicated by
+    /// [`side`](#view.Decoration^widget^spec.side). Set this to true
+    /// to allow the DOM selection to stay on the other side if the
+    /// client sets it there.
+    ///
+    /// **Note**: Mapping of this decoration, which decides on which
+    /// side insertions at its position appear, will still happen
+    /// according to `side`, and keyboard cursor motion will not,
+    /// without further custom handling, visit both sides of the
+    /// widget.
+    relaxedSide?: boolean
+
     /// The precise set of marks to draw around the widget.
     marks?: readonly Mark[]
 

package/src/dom.ts

@@ -54,9 +54,14 @@ function scanFor(node: Node, off: number, targetNode: Node, targetOff: number, d
       off = domIndex(node) + (dir < 0 ? 0 : 1)
       node = parent
     } else if (node.nodeType == 1) {
-      node = node.childNodes[off + (dir < 0 ? -1 : 0)]
-      if ((node as HTMLElement).contentEditable == "false") return false
-      off = dir < 0 ? nodeSize(node) : 0
+      let child = node.childNodes[off + (dir < 0 ? -1 : 0)]
+      if (child.nodeType == 1 && (child as HTMLElement).contentEditable == "false") {
+        if (child.pmViewDesc?.ignoreForSelection) off += dir
+        else return false
+      } else {
+        node = child
+        off = dir < 0 ? nodeSize(node) : 0
+      }
     } else {
       return false
     }

package/src/domchange.ts

@@ -1,5 +1,5 @@
 import {Fragment, DOMParser, TagParseRule, Node, Mark, ResolvedPos} from "prosemirror-model"
-import {Selection, TextSelection} from "prosemirror-state"
+import {Selection, TextSelection, Transaction} from "prosemirror-state"
 
 import {selectionBetween, selectionFromDOM, selectionToDOM} from "./selection"
 import {selectionCollapsed, keyEvent, DOMNode} from "./dom"
@@ -223,7 +223,27 @@ export function readDOMChange(view: EditorView, from: number, to: number, typeOv
 
   let chFrom = change.start, chTo = change.endA
 
-  let tr, storedMarks, markChange
+  let mkTr = (base?: Transaction) => {
+    let tr = base || view.state.tr.replace(chFrom, chTo, parse.doc.slice(change!.start - parse.from,
+                                                                         change!.endB - parse.from))
+    if (parse.sel) {
+      let sel = resolveSelection(view, tr.doc, parse.sel)
+      // Chrome will sometimes, during composition, report the
+      // selection in the wrong place. If it looks like that is
+      // happening, don't update the selection.
+      // Edge just doesn't move the cursor forward when you start typing
+      // in an empty block or between br nodes.
+      if (sel && !(browser.chrome && view.composing && sel.empty &&
+        (change!.start != change!.endB || view.input.lastChromeDelete < Date.now() - 100) &&
+        (sel.head == chFrom || sel.head == tr.mapping.map(chTo) - 1) ||
+        browser.ie && sel.empty && sel.head == chFrom))
+        tr.setSelection(sel)
+    }
+    if (compositionID) tr.setMeta("composition", compositionID)
+    return tr.scrollIntoView()
+  }
+
+  let markChange
   if (inlineChange) {
     if ($from.pos == $to.pos) { // Deletion
       // IE11 sometimes weirdly moves the DOM selection around after
@@ -232,42 +252,29 @@ export function readDOMChange(view: EditorView, from: number, to: number, typeOv
         view.domObserver.suppressSelectionUpdates()
         setTimeout(() => selectionToDOM(view), 20)
       }
-      tr = view.state.tr.delete(chFrom, chTo)
-      storedMarks = doc.resolve(change.start).marksAcross(doc.resolve(change.endA))
+      let tr = mkTr(view.state.tr.delete(chFrom, chTo))
+      let marks = doc.resolve(change.start).marksAcross(doc.resolve(change.endA))
+      if (marks) tr.ensureMarks(marks)
+      view.dispatch(tr)
     } else if ( // Adding or removing a mark
       change.endA == change.endB &&
       (markChange = isMarkChange($from.parent.content.cut($from.parentOffset, $to.parentOffset),
                                  $fromA.parent.content.cut($fromA.parentOffset, change.endA - $fromA.start())))
     ) {
-      tr = view.state.tr
+      let tr = mkTr(view.state.tr)
       if (markChange.type == "add") tr.addMark(chFrom, chTo, markChange.mark)
       else tr.removeMark(chFrom, chTo, markChange.mark)
+      view.dispatch(tr)
     } else if ($from.parent.child($from.index()).isText && $from.index() == $to.index() - ($to.textOffset ? 0 : 1)) {
       // Both positions in the same text node -- simply insert text
       let text = $from.parent.textBetween($from.parentOffset, $to.parentOffset)
-      if (view.someProp("handleTextInput", f => f(view, chFrom, chTo, text))) return
-      tr = view.state.tr.insertText(text, chFrom, chTo)
+      let deflt = () => mkTr(view.state.tr.insertText(text, chFrom, chTo))
+      if (!view.someProp("handleTextInput", f => f(view, chFrom, chTo, text, deflt)))
+        view.dispatch(deflt())
     }
+  } else {
+    view.dispatch(mkTr())
   }
-
-  if (!tr)
-    tr = view.state.tr.replace(chFrom, chTo, parse.doc.slice(change.start - parse.from, change.endB - parse.from))
-  if (parse.sel) {
-    let sel = resolveSelection(view, tr.doc, parse.sel)
-    // Chrome will sometimes, during composition, report the
-    // selection in the wrong place. If it looks like that is
-    // happening, don't update the selection.
-    // Edge just doesn't move the cursor forward when you start typing
-    // in an empty block or between br nodes.
-    if (sel && !(browser.chrome && view.composing && sel.empty &&
-                 (change.start != change.endB || view.input.lastChromeDelete < Date.now() - 100) &&
-                 (sel.head == chFrom || sel.head == tr.mapping.map(chTo) - 1) ||
-                 browser.ie && sel.empty && sel.head == chFrom))
-      tr.setSelection(sel)
-  }
-  if (storedMarks) tr.ensureMarks(storedMarks)
-  if (compositionID) tr.setMeta("composition", compositionID)
-  view.dispatch(tr.scrollIntoView())
 }
 
 function resolveSelection(view: EditorView, doc: Node, parsedSel: {anchor: number, head: number}) {

package/src/index.ts

@@ -28,7 +28,8 @@ export const __endComposition = endComposition
 /// editable document. Its state and behavior are determined by its
 /// [props](#view.DirectEditorProps).
 export class EditorView {
-  private _props: DirectEditorProps
+  /// @internal
+  _props: DirectEditorProps
   private directPlugins: readonly Plugin[]
   private _root: Document | ShadowRoot | null = null
   /// @internal
@@ -490,11 +491,7 @@ export class EditorView {
   /// [`updateState`](#view.EditorView.updateState) with the result.
   /// This method is bound to the view instance, so that it can be
   /// easily passed around.
-  dispatch(tr: Transaction) {
-    let dispatchTransaction = this._props.dispatchTransaction
-    if (dispatchTransaction) dispatchTransaction.call(this, tr)
-    else this.updateState(this.state.apply(tr))
-  }
+  declare dispatch: (tr: Transaction) => void
 
   /// @internal
   domSelectionRange(): DOMSelectionRange {
@@ -510,6 +507,12 @@ export class EditorView {
   }
 }
 
+EditorView.prototype.dispatch = function(tr: Transaction) {
+  let dispatchTransaction = this._props.dispatchTransaction
+  if (dispatchTransaction) dispatchTransaction.call(this, tr)
+  else this.updateState(this.state.apply(tr))
+}
+
 function computeDocDeco(view: EditorView) {
   let attrs = Object.create(null)
   attrs.class = "ProseMirror"
@@ -635,7 +638,7 @@ export interface EditorProps<P = any> {
   /// Whenever the user directly input text, this handler is called
   /// before the input is applied. If it returns `true`, the default
   /// behavior of actually inserting the text is suppressed.
-  handleTextInput?: (this: P, view: EditorView, from: number, to: number, text: string) => boolean | void
+  handleTextInput?: (this: P, view: EditorView, from: number, to: number, text: string, deflt: () => Transaction) => boolean | void
 
   /// Called for each node around a click, from the inside out. The
   /// `direct` flag will be true for the inner node.

package/src/input.ts

@@ -151,8 +151,9 @@ editHandlers.keypress = (view, _event) => {
   let sel = view.state.selection
   if (!(sel instanceof TextSelection) || !sel.$from.sameParent(sel.$to)) {
     let text = String.fromCharCode(event.charCode)
-    if (!/[\r\n]/.test(text) && !view.someProp("handleTextInput", f => f(view, sel.$from.pos, sel.$to.pos, text)))
-      view.dispatch(view.state.tr.insertText(text).scrollIntoView())
+    let deflt = () => view.state.tr.insertText(text).scrollIntoView()
+    if (!/[\r\n]/.test(text) && !view.someProp("handleTextInput", f => f(view, sel.$from.pos, sel.$to.pos, text, deflt)))
+      view.dispatch(deflt())
     event.preventDefault()
   }
 }

package/src/viewdesc.ts

@@ -528,6 +528,8 @@ export class ViewDesc {
 
   get ignoreForCoords() { return false }
 
+  get ignoreForSelection() { return false }
+
   isText(text: string) { return false }
 }
 
@@ -576,6 +578,8 @@ class WidgetViewDesc extends ViewDesc {
 
   get domAtom() { return true }
 
+  get ignoreForSelection() { return !!this.widget.type.spec.relaxedSide }
+
   get side() { return (this.widget.type as any).side as number }
 }