From 22941a9ce0951de5e0682d2cc61ecbdd9bfd5cd9 Mon Sep 17 00:00:00 2001
From: Meinzzzz <lukas.geiselhart35@gmail.com>
Date: Fri, 12 Dec 2025 19:48:09 +0100
Subject: [PATCH] Fix sync issues

---
 packages/ckeditor5-math/src/ui/mainformview.ts | 13 ++++++++-----
 .../ckeditor5-math/src/ui/mathinputview.ts     |  6 ++++++
 packages/ckeditor5-math/src/ui/mathview.ts     | 18 +++++++++---------
 3 files changed, 23 insertions(+), 14 deletions(-)

diff --git a/packages/ckeditor5-math/src/ui/mainformview.ts b/packages/ckeditor5-math/src/ui/mainformview.ts
index 1c2403e18..d459354fb 100644
--- a/packages/ckeditor5-math/src/ui/mainformview.ts
+++ b/packages/ckeditor5-math/src/ui/mainformview.ts
@@ -11,8 +11,8 @@ import {
 	FocusTracker,
 	KeystrokeHandler
 } from 'ckeditor5';
-import IconCheck from '@ckeditor/ckeditor5-icons/theme/icons/check.svg?raw';
-import IconCancel from '@ckeditor/ckeditor5-icons/theme/icons/cancel.svg?raw';
+import { IconCheck } from 'ckeditor5';
+import { IconCancel } from 'ckeditor5';
 import { extractDelimiters, hasDelimiters } from '../utils.js';
 import MathView, { type MathViewOptions } from './mathview.js';
 import MathInputView from './mathinputview.js';
@@ -35,7 +35,7 @@ export default class MainFormView extends View {
 		locale: Locale,
 		mathViewOptions: MathViewOptions,
 		previewEnabled = false,
-		popupClassName: string[] = []
+		popupClassName: Array<string> = []
 	) {
 		super( locale );
 		const t = locale.t;
@@ -49,7 +49,7 @@ export default class MainFormView extends View {
 
 		// Build children
 
-		const children: View[] = [
+		const children: Array<View> = [
 			this.mathInputView,
 			this.displayButtonView
 		];
@@ -116,7 +116,10 @@ export default class MainFormView extends View {
 
 		this.mathInputView.on( 'mathfieldReady', () => {
 			const mathfieldView = this.mathInputView.mathFieldFocusableView;
-			if ( mathfieldView.element && !this._focusables.has( mathfieldView ) ) {
+			if ( mathfieldView.element ) {
+				if ( this._focusables.has( mathfieldView ) ) {
+					this._focusables.remove( mathfieldView );
+				}
 				this._focusables.add( mathfieldView, 0 );
 				this.focusTracker.add( mathfieldView.element );
 			}
diff --git a/packages/ckeditor5-math/src/ui/mathinputview.ts b/packages/ckeditor5-math/src/ui/mathinputview.ts
index 945bebc79..ace20848c 100644
--- a/packages/ckeditor5-math/src/ui/mathinputview.ts
+++ b/packages/ckeditor5-math/src/ui/mathinputview.ts
@@ -55,6 +55,7 @@ export default class MathInputView extends View {
 	public mathfield: MathFieldElement | null = null;
 	public readonly latexTextAreaView: LatexTextAreaView;
 	public readonly mathFieldFocusableView: MathFieldFocusableView;
+	private _isSyncing = false;
 
 	constructor( locale: Locale ) {
 		super( locale );
@@ -185,6 +186,11 @@ export default class MathInputView extends View {
 		this.mathfield = mf;
 		this.mathFieldFocusableView.setElement( mf );
 		this.fire( 'mathfieldReady' );
+
+		// Auto-focus the mathfield when it's ready
+		setTimeout( () => {
+			mf.focus();
+		}, 0 );
 	}
 
 	public focus(): void {
diff --git a/packages/ckeditor5-math/src/ui/mathview.ts b/packages/ckeditor5-math/src/ui/mathview.ts
index 87af15d08..aa1027329 100644
--- a/packages/ckeditor5-math/src/ui/mathview.ts
+++ b/packages/ckeditor5-math/src/ui/mathview.ts
@@ -55,20 +55,20 @@ export default class MathView extends View {
 	}
 
 	public updateMath(): void {
-		if (!this.element) {
+		if ( !this.element ) {
 			return;
 		}
 
 		// Handle empty equations
-		if (!this.value || !this.value.trim()) {
+		if ( !this.value || !this.value.trim() ) {
 			this.element.textContent = '';
-			this.element.classList.remove('ck-math-render-error');
+			this.element.classList.remove( 'ck-math-render-error' );
 			return;
 		}
 
 		// Clear previous render
 		this.element.textContent = '';
-		this.element.classList.remove('ck-math-render-error');
+		this.element.classList.remove( 'ck-math-render-error' );
 
 		renderEquation(
 			this.value,
@@ -80,14 +80,14 @@ export default class MathView extends View {
 			this.options.previewUid,
 			this.options.previewClassName,
 			this.options.katexRenderOptions
-		).catch(error => {
-			console.error('Math rendering failed:', error);
+		).catch( error => {
+			console.error( 'Math rendering failed:', error );
 
-			if (this.element) {
+			if ( this.element ) {
 				this.element.textContent = 'Error rendering equation';
-				this.element.classList.add('ck-math-render-error');
+				this.element.classList.add( 'ck-math-render-error' );
 			}
-		});
+		} );
 	}
 
 	public override render(): void {