fix: fixed #2397

CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ### Issues Resolved
 
+- **#2397** When a `beforeinput` event was canceled, the text would still 
+  be inserted when using the physical keyboard.
 - **#2398** When a placeholder was the only element in a group, i.e. 
   `{\placeholder{}}`, the placeholder was not automatically selected.
 

src/editor-mathfield/keyboard-input.ts

@@ -543,15 +543,14 @@ export function onInput(
   // If the selection is not collapsed, the content will be deleted first
   //
 
-  if (!model.selectionIsCollapsed) model.deleteAtoms(range(model.selection));
-
   if (model.mode === 'latex') {
     model.deferNotifications(
       { content: true, selection: true, data: text, type: 'insertText' },
       () => {
         removeSuggestion(mathfield);
 
-        for (const c of graphemes) ModeEditor.insert(model, c);
+        for (const c of graphemes)
+          ModeEditor.insert(model, c, { insertionMode: 'replaceSelection' });
 
         mathfield.snapshot('insert-latex');
 
@@ -560,7 +559,8 @@ export function onInput(
     );
   } else if (model.mode === 'text') {
     const style = { ...getSelectionStyle(model), ...mathfield.defaultStyle };
-    for (const c of graphemes) ModeEditor.insert(model, c, { style });
+    for (const c of graphemes)
+      ModeEditor.insert(model, c, { style, insertionMode: 'replaceSelection' });
     mathfield.snapshot('insert-text');
   } else if (model.mode === 'math')
     for (const c of graphemes) insertMathModeChar(mathfield, c);
@@ -629,11 +629,14 @@ function insertMathModeChar(mathfield: _Mathfield, c: string): void {
   ) {
     // We are inserting a digit into an empty superscript
     // If smartSuperscript is on, insert the digit, and exit the superscript.
-    clearSelection(model);
-    ModeEditor.insert(model, c, { style });
-    mathfield.snapshot();
+    if (
+      !ModeEditor.insert(model, c, { style, insertionMode: 'replaceSelection' })
+    ) {
+      mathfield.undoManager.pop();
+      return;
+    }
+    mathfield.snapshot('insert-mord');
     moveAfterParent(model);
-    mathfield.snapshot();
     return;
   }
 
@@ -666,18 +669,17 @@ function insertMathModeChar(mathfield: _Mathfield, c: string): void {
   else if (input === '\\') input = '\\backslash';
 
   // General purpose character insertion
-  ModeEditor.insert(model, input, { style });
+  if (
+    !ModeEditor.insert(model, input, {
+      style,
+      insertionMode: 'replaceSelection',
+    })
+  )
+    return;
 
   mathfield.snapshot(`insert-${model.at(model.position).type}`);
 }
 
-function clearSelection(model: _Model) {
-  if (!model.selectionIsCollapsed) {
-    model.deleteAtoms(range(model.selection));
-    model.mathfield.snapshot('delete');
-  }
-}
-
 function getSelectionStyle(model: _Model): Readonly<Style> {
   // When the selection is collapsed, we inherit the style from the
   // preceding atom

src/editor-mathfield/mathfield-private.ts

@@ -1537,8 +1537,6 @@ If you are using Vue, this may be because you are using the runtime-only build o
 
   undo(): void {
     if (!this.undoManager.undo()) return;
-    if (window.mathVirtualKeyboard.visible)
-      window.mathVirtualKeyboard.update(makeProxy(this));
     this.host?.dispatchEvent(
       new CustomEvent('undo-state-change', {
         bubbles: true,
@@ -1550,13 +1548,11 @@ If you are using Vue, this may be because you are using the runtime-only build o
 
   redo(): void {
     if (!this.undoManager.redo()) return;
-    if (window.mathVirtualKeyboard.visible)
-      window.mathVirtualKeyboard.update(makeProxy(this));
     this.host?.dispatchEvent(
       new CustomEvent('undo-state-change', {
         bubbles: true,
         composed: true,
-        detail: { type: 'undo' },
+        detail: { type: 'redo' },
       })
     );
   }

src/editor-mathfield/mode-editor-math.ts

@@ -145,7 +145,7 @@ export class MathModeEditor extends ModeEditor {
 
     //
     // 4/ If that didn't work, try some plain text
-    // (could be LaTeX, could be ASIIMath)
+    // (could be LaTeX, could be ASCIIMath)
     //
     if (!text)
       text = typeof data === 'string' ? data : data.getData('text/plain');
@@ -179,6 +179,7 @@ export class MathModeEditor extends ModeEditor {
       !model.contentWillChange({ data, inputType: 'insertText' })
     )
       return false;
+
     if (!options.insertionMode) options.insertionMode = 'replaceSelection';
     if (!options.selectionMode) options.selectionMode = 'placeholder';
     if (!options.format) options.format = 'auto';
@@ -207,10 +208,7 @@ export class MathModeEditor extends ModeEditor {
     //
     // Delete any selected items
     //
-    if (
-      options.insertionMode === 'replaceSelection' &&
-      !model.selectionIsCollapsed
-    )
+    if (options.insertionMode === 'replaceSelection')
       model.deleteAtoms(range(model.selection));
     else if (options.insertionMode === 'replaceAll') model.deleteAtoms();
     else if (options.insertionMode === 'insertBefore')

src/editor-model/model-private.ts

@@ -106,6 +106,7 @@ export class _Model implements Model {
       this.selection = state.selection;
       this.silenceNotifications = didSuppress;
       this.contentDidChange(changeOption);
+      this.selectionDidChange();
     }
     this.silenceNotifications = wasSuppressing;
   }
@@ -833,8 +834,8 @@ export class _Model implements Model {
           composed: true,
         } as InputEventInit)
       );
-      this.silenceNotifications = save;
     }, 0);
+    this.silenceNotifications = save;
   }
 
   selectionDidChange(): void {