Quill 2.0.x | Slab | Using 3-set Korean IME during collaborative editing caused incorrect content synchronization.

[weiQuill]

Please describe the a concise description and fill out the details below. It will help others efficiently understand your request and get to an answer instead of repeated back and forth. Providing a minimal, complete and verifiable example will further increase your chances that someone can help.

Steps for Reproduction

1. Open the same doc in Slab with 2 windows.
2. Create some empty lines.
3. Change to 3-Set Korean IME.
4. Focus into one of the editor.
5. Hold t key to type in the editor.
6. Click into another window to keep typing in the editor.(Don't release t)
7. You will see the issue, the contents of the two editors are inconsistent.

Screen.Recording.2024-10-14.at.15.10.26.mov

Expected behavior:
The contents of the two editors are consistent.

Actual behavior:
The contents of the two editors are inconsistent.

Platforms:
macOS 14.7 & Chrome Version 129.0.6668.101
Include browser, operating system and respective versions

Version:
Quill 2.0.x

[weiQuill]

I tried the steps in YJS demo, it only happens in quill 2.0.x, works fine in 1.3.7.
I suspect it's caused by batchStart and batchEnd in the composition events handlers, removing them will fix the main issue, but will bring Japanese Hiragana Windows IME ignores first letter in editor #1453
back.

Any suggestions? I found that batchStart and batchEnd were not added to the composition events handlers in 1.3.7, and there is also no first letter issue. How did we fix this problem for 1.3.7?
Thanks a lot:)

[vincentdchan]

We can solve the “first-letter issue” in this PR: slab/parchment#151
And solve the editing issue by disable batchStart and batchEnd

[Yinlin124]

diff --git a/core/editor.js b/core/editor.js
index 07fd544a5857c0c498abf899c66e34a1b6b6a736..62072586605974e6890a919312c0bbd971870b9e 100644
--- a/core/editor.js
+++ b/core/editor.js
@@ -15,7 +15,14 @@ class Editor {
    applyDelta(delta) {
      this.scroll.update();
      let scrollLength = this.scroll.length();
-    this.scroll.batchStart();
+
+    // Check if a batch already exists (e.g. during composition)
+    const isAlreadyBatching = Boolean(this.scroll.batch);
+
+    if (!isAlreadyBatching) {
+      this.scroll.batchStart();
+    }
+
      const normalizedDelta = normalizeDelta(delta);
      const deleteDelta = new Delta();
      const normalizedOps = splitOpLines(normalizedDelta.ops.slice());
@@ -93,7 +100,11 @@ class Editor {
        }
        return index + Op.length(op);
      }, 0);
-    this.scroll.batchEnd();
+
+    if (!isAlreadyBatching) {
+      this.scroll.batchEnd();
+    }
+
    this.scroll.optimize();
    return this.update(normalizedDelta);
    }

This ensures that remote updates, when processed during an ongoing local batch (e.g., from IME), do not interfere with or prematurely end the local process.