Add preventDefault for wheel handler, fixes #1632

ivmartel · Mar 18, 2024 · b969c92 · b969c92
1 parent c4b4f6a
commit b969c92
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/src/gui/viewLayer.js b/src/gui/viewLayer.js
@@ -773,8 +773,10 @@ export class ViewLayer {
     // interaction events
     const names = InteractionEventNames;
     for (let i = 0; i < names.length; ++i) {
+      const eventName = names[i];
+      const passive = eventName !== 'wheel';
       this.#containerDiv.addEventListener(
-        names[i], this.#fireEvent, {passive: true});
+        names[i], this.#fireEvent, {passive: passive});
     }
   }
 

diff --git a/src/tools/scrollWheel.js b/src/tools/scrollWheel.js
@@ -53,6 +53,9 @@ export class ScrollWheel {
       this.#wheelDeltaY = 0;
     }
 
+    // prevent default page scroll
+    event.preventDefault();
+
     const up = event.deltaY < 0 ? true : false;
 
     const layerDetails = getLayerDetailsFromEvent(event);

diff --git a/src/tools/zoomPan.js b/src/tools/zoomPan.js
@@ -222,6 +222,9 @@ export class ZoomAndPan {
    * @param {object} event The mouse wheel event.
    */
   wheel = (event) => {
+    // prevent default page scroll
+    event.preventDefault();
+
     const step = -event.deltaY / 500;
 
     const layerDetails = getLayerDetailsFromEvent(event);