fix: fixed #2579

Author: arnog

CHANGELOG.md

@@ -171,6 +171,14 @@
   selected placeholder, the characters would disappear or trigger unwanted
   behaviors. The placeholder is now deleted before keystroke processing,
   allowing all keybindings and character handling to work correctly.
+- **#2579** Fixed multiple mathfields showing blinking cursors simultaneously
+  when `focus()` is called rapidly on multiple mathfields. This occurred
+  because Chromium browsers don't fire blur events reliably during rapid focus
+  changes, causing multiple mathfields to remain in a focused state. The fix
+  implements global focus tracking to ensure only one mathfield can be focused
+  at a time, explicitly blurring any previously focused mathfield when a new
+  one gains focus. This handles browser blur event quirks while maintaining
+  backward compatibility with all existing focus/blur behavior.
 - **#2619** Fixed placeholders in multi-row array environments (like
   `\displaylines`) not being focusable with pointer clicks. The hit-testing
   logic now properly determines which row was clicked before searching for

src/editor-mathfield/mathfield-private.ts

@@ -147,6 +147,13 @@ const MENU_GLYPH = `<svg xmlns="http://www.w3.org/2000/svg" style="height: 18px;
 
 /** @internal */
 export class _Mathfield implements Mathfield, KeyboardDelegateInterface {
+  /**
+   * Global tracker for the currently focused mathfield.
+   * Used to handle cases where browsers don't fire blur events reliably
+   * (e.g., when focus() is called rapidly on multiple mathfields).
+   */
+  private static _globallyFocusedMathfield: _Mathfield | undefined;
+
   readonly model: _Model;
 
   readonly undoManager: UndoManager;
@@ -1697,9 +1704,27 @@ If you are using Vue, this may be because you are using the runtime-only build o
 
   onFocus(options?: { suppressEvents?: boolean }): void {
     if (this.disabled || this.focusBlurInProgress || !this.blurred) return;
+
+    // If another mathfield is globally tracked as focused, blur it first.
+    // This handles cases where browsers don't fire blur events reliably
+    // (e.g., rapid focus() calls on multiple mathfields in Chromium).
+    const previouslyFocusedMathfield = _Mathfield._globallyFocusedMathfield;
+    if (
+      previouslyFocusedMathfield &&
+      previouslyFocusedMathfield !== this &&
+      !previouslyFocusedMathfield.disabled &&
+      previouslyFocusedMathfield.hasFocus()
+    ) {
+      // Call onBlur directly to avoid DOM event timing issues
+      previouslyFocusedMathfield.onBlur({ dispatchEvents: true });
+    }
+
     this.focusBlurInProgress = true;
     this.blurred = false;
 
+    // Update the global tracker to point to this mathfield
+    _Mathfield._globallyFocusedMathfield = this;
+
     this.stopCoalescingUndo();
 
     // Save the current value.
@@ -1775,6 +1800,12 @@ If you are using Vue, this may be because you are using the runtime-only build o
     this.stopCoalescingUndo();
 
     this.blurred = true;
+
+    // Clear the global tracker if it points to this mathfield
+    if (_Mathfield._globallyFocusedMathfield === this) {
+      _Mathfield._globallyFocusedMathfield = undefined;
+    }
+
     this.ariaLiveText!.textContent = '';
 
     hideSuggestionPopover(this);