Fix IME not working correctly in Safari

CHANGELOG.md

@@ -1,5 +1,7 @@
 # [Unreleased]
 
+- Fix IME not working correctly in Safari.
+
 # 2.0.0-beta.1
 
 - Fix syntax label from "Javascript" to "JavaScript".

packages/quill/src/core/composition.ts

@@ -21,7 +21,12 @@ class Composition {
 
     this.scroll.domNode.addEventListener('compositionend', (event) => {
       if (this.isComposing) {
-        this.handleCompositionEnd(event);
+        // Webkit makes DOM changes after compositionend, so we use microtask to
+        // ensure the order.
+        // https://bugs.webkit.org/show_bug.cgi?id=31902
+        queueMicrotask(() => {
+          this.handleCompositionEnd(event);
+        });
       }
     });
   }

packages/quill/test/e2e/list.spec.ts

@@ -123,6 +123,19 @@ test.describe('list', () => {
           { insert: '\n', attributes: { list } },
         ]);
       });
+
+      test('typing in an empty editor with IME and press Backspace', async ({
+        page,
+        editorPage,
+        composition,
+      }) => {
+        await editorPage.setContents([{ insert: '\n' }]);
+
+        await editorPage.setSelection(9, 0);
+        await editorPage.typeWordWithIME(composition, '我');
+        await page.keyboard.press('Backspace');
+        expect(await editorPage.getContents()).toEqual([{ insert: '\n' }]);
+      });
     });
   }