prosemirror-view 1.33.10 → 1.33.11

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+## 1.33.11 (2024-08-19)
+
+### Bug fixes
+
+Delete the selection on composition start when on a mark boundary to force Chrome to apply the correct style to the composition.
+
+When the browser starts a composition and the selection spans across blocks, start by clearing it to make sure the composed text node lands in a valid position.
+
 ## 1.33.10 (2024-08-13)
 
 ### Bug fixes

package/dist/index.cjs

@@ -2219,13 +2219,7 @@ function selectCursorWrapper(view) {
   var node = view.cursorWrapper.dom,
     img = node.nodeName == "IMG";
   if (img) range.setStart(node.parentNode, domIndex(node) + 1);else range.setStart(node, 0);
-  var sel = view.state.selection;
-  if (sel.empty) {
-    range.collapse(true);
-  } else {
-    var end = view.domAtPos(sel.to);
-    range.setEnd(end.node, end.offset);
-  }
+  range.collapse(true);
   domSel.removeAllRanges();
   domSel.addRange(range);
   if (!img && !view.state.selection.visible && ie && ie_version <= 11) {
@@ -3205,7 +3199,7 @@ editHandlers.compositionstart = editHandlers.compositionupdate = function (view)
       endComposition(view, true);
       view.markCursor = null;
     } else {
-      endComposition(view);
+      endComposition(view, !state.selection.empty);
       if (gecko && state.selection.empty && $pos.parentOffset && !$pos.textOffset && $pos.nodeBefore.marks.length) {
         var sel = view.domSelectionRange();
         for (var node = sel.focusNode, offset = sel.focusOffset; node && node.nodeType == 1 && offset != 0;) {
@@ -3276,13 +3270,13 @@ function timestampFromCustomEvent() {
   return event.timeStamp;
 }
 function endComposition(view) {
-  var forceUpdate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  var restarting = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   if (android && view.domObserver.flushingSoon >= 0) return;
   view.domObserver.forceFlush();
   clearComposition(view);
-  if (forceUpdate || view.docView && view.docView.dirty) {
+  if (restarting || view.docView && view.docView.dirty) {
     var sel = selectionFromDOM(view);
-    if (sel && !sel.eq(view.state.selection)) view.dispatch(view.state.tr.setSelection(sel));else view.updateState(view.state);
+    if (sel && !sel.eq(view.state.selection)) view.dispatch(view.state.tr.setSelection(sel));else if ((view.markCursor || restarting) && !view.state.selection.empty) view.dispatch(view.state.tr.deleteSelection());else view.updateState(view.state);
     return true;
   }
   return false;

package/dist/index.js

@@ -2290,14 +2290,7 @@ function selectCursorWrapper(view) {
         range.setStart(node.parentNode, domIndex(node) + 1);
     else
         range.setStart(node, 0);
-    let sel = view.state.selection;
-    if (sel.empty) {
-        range.collapse(true);
-    }
-    else {
-        let end = view.domAtPos(sel.to);
-        range.setEnd(end.node, end.offset);
-    }
+    range.collapse(true);
     domSel.removeAllRanges();
     domSel.addRange(range);
     // Kludge to kill 'control selection' in IE11 when selecting an
@@ -3419,7 +3412,7 @@ editHandlers.compositionstart = editHandlers.compositionupdate = view => {
             view.markCursor = null;
         }
         else {
-            endComposition(view);
+            endComposition(view, !state.selection.empty);
             // In firefox, if the cursor is after but outside a marked node,
             // the inserted text won't inherit the marks. So this moves it
             // inside if necessary.
@@ -3500,15 +3493,17 @@ function timestampFromCustomEvent() {
 /**
 @internal
 */
-function endComposition(view, forceUpdate = false) {
+function endComposition(view, restarting = false) {
     if (android && view.domObserver.flushingSoon >= 0)
         return;
     view.domObserver.forceFlush();
     clearComposition(view);
-    if (forceUpdate || view.docView && view.docView.dirty) {
+    if (restarting || view.docView && view.docView.dirty) {
         let sel = selectionFromDOM(view);
         if (sel && !sel.eq(view.state.selection))
             view.dispatch(view.state.tr.setSelection(sel));
+        else if ((view.markCursor || restarting) && !view.state.selection.empty)
+            view.dispatch(view.state.tr.deleteSelection());
         else
             view.updateState(view.state);
         return true;

package/package.json

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

package/src/input.ts

@@ -463,7 +463,7 @@ editHandlers.compositionstart = editHandlers.compositionupdate = view => {
       endComposition(view, true)
       view.markCursor = null
     } else {
-      endComposition(view)
+      endComposition(view, !state.selection.empty)
       // In firefox, if the cursor is after but outside a marked node,
       // the inserted text won't inherit the marks. So this moves it
       // inside if necessary.
@@ -539,13 +539,14 @@ function timestampFromCustomEvent() {
 }
 
 /// @internal
-export function endComposition(view: EditorView, forceUpdate = false) {
+export function endComposition(view: EditorView, restarting = false) {
   if (browser.android && view.domObserver.flushingSoon >= 0) return
   view.domObserver.forceFlush()
   clearComposition(view)
-  if (forceUpdate || view.docView && view.docView.dirty) {
+  if (restarting || view.docView && view.docView.dirty) {
     let sel = selectionFromDOM(view)
     if (sel && !sel.eq(view.state.selection)) view.dispatch(view.state.tr.setSelection(sel))
+    else if ((view.markCursor || restarting) && !view.state.selection.empty) view.dispatch(view.state.tr.deleteSelection())
     else view.updateState(view.state)
     return true
   }

package/src/selection.ts

@@ -140,13 +140,7 @@ function selectCursorWrapper(view: EditorView) {
   let node = view.cursorWrapper!.dom, img = node.nodeName == "IMG"
   if (img) range.setStart(node.parentNode!, domIndex(node) + 1)
   else range.setStart(node, 0)
-  let sel = view.state.selection
-  if (sel.empty) {
-    range.collapse(true)
-  } else {
-    let end = view.domAtPos(sel.to)
-    range.setEnd(end.node, end.offset)
-  }
+  range.collapse(true)
   domSel.removeAllRanges()
   domSel.addRange(range)
   // Kludge to kill 'control selection' in IE11 when selecting an