Merge pull request #93 from reedsy/passive-listeners

⚡️ Make all event listeners passive
reedsy · May 31, 2024 · 2c9f496 · 2c9f496
2 parents 02391f8 + 94d8937
commit 2c9f496
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 6 deletions.
diff --git a/src/quill-cursors/cursor.ts b/src/quill-cursors/cursor.ts
@@ -67,7 +67,7 @@ export default class Cursor {
     this._caretEl = caretContainerElement;
     this._flagEl = flagElement;
 
-    caretContainerElement.addEventListener('mouseover', this._setHoverState);
+    caretContainerElement.addEventListener('mouseover', this._setHoverState, {passive: true});
 
     return this._el;
   }
@@ -127,7 +127,7 @@ export default class Cursor {
   }
 
   private _setHoverState(): void {
-    document.addEventListener('mousemove', this._toggleOpenedCursor);
+    document.addEventListener('mousemove', this._toggleOpenedCursor, {passive: true});
   }
 
   private _toggleOpenedCursor(e: MouseEvent): void {

diff --git a/src/quill-cursors/quill-cursors.spec.ts b/src/quill-cursors/quill-cursors.spec.ts
@@ -70,7 +70,7 @@ describe('QuillCursors', () => {
       const editor = quill.container.getElementsByClassName('ql-editor')[0];
       jest.spyOn(editor, 'addEventListener');
       const cursors = new QuillCursors(quill);
-      expect(editor.addEventListener).toHaveBeenCalledWith('scroll', expect.anything());
+      expect(editor.addEventListener).toHaveBeenCalledWith('scroll', expect.anything(), {passive: true});
 
       jest.spyOn(cursors, 'update');
       const scroll = new Event('scroll');

diff --git a/src/quill-cursors/quill-cursors.ts b/src/quill-cursors/quill-cursors.ts
@@ -109,9 +109,9 @@ export default class QuillCursors {
   }
 
   private _registerDomListeners(): void {
-    const editor = this.quill.container.getElementsByClassName('ql-editor')[0];
-    editor.addEventListener('scroll', () => this.update());
-    editor.addEventListener('touchstart', this._handleCursorTouch);
+    const editor = this.quill.container.getElementsByClassName('ql-editor')[0] as HTMLElement;
+    editor.addEventListener('scroll', () => this.update(), {passive: true});
+    editor.addEventListener('touchstart', this._handleCursorTouch, {passive: true});
   }
 
   private _handleCursorTouch(e: MouseEvent): void {