diff --git a/src/panelSnap.js b/src/panelSnap.js index 07786b9..f4f1b68 100644 --- a/src/panelSnap.js +++ b/src/panelSnap.js @@ -5,6 +5,7 @@ import { getTargetScrollTop, getElementsInContainerViewport, elementFillsContainer, + passiveIsSupported, } from './utilities'; let INSTANCE_COUNTER = 0; @@ -49,7 +50,7 @@ export default class PanelSnap { this.container.addEventListener('mouseup', this.onMouseUp.bind(this)); this.container.addEventListener('mousedown', this.onMouseDown.bind(this)); - this.scrollContainer.addEventListener('wheel', this.onWheel.bind(this), { passive: true }); + this.scrollContainer.addEventListener('wheel', this.onWheel.bind(this), passiveIsSupported && { passive: true }); } on(name, handler) { diff --git a/src/utilities.js b/src/utilities.js index 4edb9e0..56733a7 100644 --- a/src/utilities.js +++ b/src/utilities.js @@ -60,3 +60,24 @@ export function elementFillsContainer(container, element) { elementRect.right >= containerRect.right ); } + +// Taken from MDN +// https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Safely_detecting_option_support +export const passiveIsSupported = (function () { + let isSupported = false; + + try { + const options = Object.defineProperty({}, 'passive', { + get() { // eslint-disable-line getter-return + isSupported = true; + }, + }); + + window.addEventListener('test', null, options); + window.removeEventListener('test', null, options); + } catch (e) { + // Do nothing + } + + return isSupported; +}()); diff --git a/src/utilities.test.js b/src/utilities.test.js index 6d2b823..6f06b19 100644 --- a/src/utilities.test.js +++ b/src/utilities.test.js @@ -3,6 +3,7 @@ import { getTargetScrollTop, getElementsInContainerViewport, elementFillsContainer, + passiveIsSupported, } from './utilities'; const SCREEN_WIDTH = 800; @@ -229,3 +230,9 @@ describe('elementFillsContainer', () => { expect(elementFillsContainer(container, getElement(99, 499))).toBe(false); }); }); + +describe('isPassiveSupported', () => { + test('returns false in JSDOM', () => { + expect(passiveIsSupported).toBe(false); + }); +});