[pull] develop from quilljs:develop

core/editor.ts

@@ -1,6 +1,4 @@
-import cloneDeep from 'lodash.clonedeep';
-import isEqual from 'lodash.isequal';
-import merge from 'lodash.merge';
+import { cloneDeep, isEqual, merge } from 'lodash-es';
 import { LeafBlot, EmbedBlot, Scope, ParentBlot } from 'parchment';
 import type { Blot } from 'parchment';
 import Delta, { AttributeMap, Op } from 'quill-delta';

core/quill.ts

@@ -1,5 +1,4 @@
-import cloneDeep from 'lodash.clonedeep';
-import merge from 'lodash.merge';
+import { cloneDeep, merge } from 'lodash-es';
 import * as Parchment from 'parchment';
 import type { Op } from 'quill-delta';
 import Delta from 'quill-delta';

core/selection.ts

@@ -1,6 +1,5 @@
 import { LeafBlot, Scope } from 'parchment';
-import cloneDeep from 'lodash.clonedeep';
-import isEqual from 'lodash.isequal';
+import { cloneDeep, isEqual } from 'lodash-es';
 import Emitter from './emitter';
 import type { EmitterSource } from './emitter';
 import logger from './logger';

modules/keyboard.ts

@@ -1,5 +1,4 @@
-import cloneDeep from 'lodash.clonedeep';
-import isEqual from 'lodash.isequal';
+import { cloneDeep, isEqual } from 'lodash-es';
 import Delta, { AttributeMap } from 'quill-delta';
 import { EmbedBlot, Scope, TextBlot } from 'parchment';
 import type { Blot, BlockBlot } from 'parchment';

modules/uiNode.ts

@@ -4,6 +4,9 @@ import Quill from '../core/quill';
 
 const isMac = /Mac/i.test(navigator.platform);
 
+// Export for testing
+export const TTL_FOR_VALID_SELECTION_CHANGE = 100;
+
 // A loose check to determine if the shortcut can move the caret before a UI node:
 // <ANY_PARENT>[CARET]<div class="ql-ui"></div>[CONTENT]</ANY_PARENT>
 const canMoveCaretBeforeUINode = (event: KeyboardEvent) => {
@@ -78,10 +81,10 @@ class UINode extends Module {
    * the selection within the handler of a `selectionchange` event.
    */
   private ensureListeningToSelectionChange() {
-    if (this.isListening) return;
+    this.selectionChangeDeadline = Date.now() + TTL_FOR_VALID_SELECTION_CHANGE;
 
+    if (this.isListening) return;
     this.isListening = true;
-    this.selectionChangeDeadline = Date.now() + 100;
 
     const listener = () => {
       this.isListening = false;

package.json

@@ -17,9 +17,6 @@
   ],
   "dependencies": {
     "eventemitter3": "^4.0.7",
-    "lodash.clonedeep": "^4.5.0",
-    "lodash.isequal": "^4.5.0",
-    "lodash.merge": "^4.5.0",
     "parchment": "^3.0.0-alpha.1",
     "quill-delta": "^5.1.0"
   },
@@ -28,9 +25,7 @@
     "@babel/preset-env": "^7.22.5",
     "@babel/preset-typescript": "^7.22.5",
     "@playwright/test": "^1.39.0",
-    "@types/lodash.clonedeep": "^4.5.7",
-    "@types/lodash.isequal": "^4.5.6",
-    "@types/lodash.merge": "^4.6.7",
+    "@types/lodash-es": "^4.17.11",
     "@typescript-eslint/eslint-plugin": "^6.9.1",
     "@typescript-eslint/parser": "^6.9.1",
     "@vitest/browser": "^0.34.6",
@@ -48,6 +43,7 @@
     "http-proxy": "^1.18.0",
     "jsdom": "^22.1.0",
     "lodash": "^4.17.15",
+    "lodash-es": "^4.17.21",
     "mini-css-extract-plugin": "^2.7.6",
     "npm-run-all": "^4.1.5",
     "prettier": "^3.0.3",

test/unit/modules/uiNode.spec.ts

@@ -0,0 +1,41 @@
+import '../../../quill';
+import { describe, expect, test } from 'vitest';
+import UINode, {
+  TTL_FOR_VALID_SELECTION_CHANGE,
+} from '../../../modules/uiNode';
+import Quill, { Delta } from '../../../core';
+
+// Fake timer is not supported in browser mode yet.
+const delay = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
+
+describe('uiNode', () => {
+  test('extends deadline when multiple possible shortcuts are pressed', async () => {
+    const quill = new Quill(document.createElement('div'));
+    document.body.appendChild(quill.container);
+    quill.setContents(
+      new Delta().insert('item 1').insert('\n', { list: 'bullet' }),
+    );
+    new UINode(quill, {});
+
+    for (let i = 0; i < 2; i += 1) {
+      quill.root.dispatchEvent(
+        new KeyboardEvent('keydown', { key: 'ArrowRight', metaKey: true }),
+      );
+      await delay(TTL_FOR_VALID_SELECTION_CHANGE / 2);
+    }
+
+    quill.root.dispatchEvent(
+      new KeyboardEvent('keydown', { key: 'ArrowLeft', metaKey: true }),
+    );
+    const range = document.createRange();
+    range.setStart(quill.root.querySelector('li')!, 0);
+    range.setEnd(quill.root.querySelector('li')!, 0);
+
+    const selection = document.getSelection();
+    selection?.removeAllRanges();
+    selection?.addRange(range);
+
+    await delay(TTL_FOR_VALID_SELECTION_CHANGE / 2);
+    expect(selection?.getRangeAt(0).startOffset).toEqual(1);
+  });
+});

themes/base.ts

@@ -1,4 +1,4 @@
-import merge from 'lodash.merge';
+import { merge } from 'lodash-es';
 import type Quill from '../core/quill';
 import Emitter from '../core/emitter';
 import Theme from '../core/theme';

themes/bubble.ts

@@ -1,4 +1,4 @@
-import merge from 'lodash.merge';
+import { merge } from 'lodash-es';
 import Emitter from '../core/emitter';
 import BaseTheme, { BaseTooltip } from './base';
 import { Range } from '../core/selection';

themes/snow.ts

@@ -1,4 +1,4 @@
-import merge from 'lodash.merge';
+import { merge } from 'lodash-es';
 import Emitter from '../core/emitter';
 import BaseTheme, { BaseTooltip } from './base';
 import LinkBlot from '../formats/link';