Изменить событие колеса мыши на объекте окна на {passive: false} - Javascript - PullRequest
3 голосов
/ 20 марта 2019

В последнем обновлении Chrome [73] они изменили работу пассивного прослушивателя событий с колесом мыши на объекте окна. В основном это нарушило ряд плагинов с плавной прокруткой, которые убирают «дрожание» по умолчанию традиционного колеса мыши при прокрутке в Chrome.

Изменение статуса платформы Chrome здесь.

https://www.chromestatus.com/features#browsers.chrome.owners%3A%20sahel%40chromium.org

... и на этой странице вы переходите на страницу, где говорится, что значение по умолчанию теперь эквивалентно следующему:

`window.addEventListener("wheel", func, {passive: true} );`

Итак, я думаю, мне нужно написать функцию, которая изменит ее на:

`window.addEventListener("wheel", func, {passive: false} );`

https://github.com/sahel-sh/Document-level-passive-wheel-event-listeners/blob/master/Explainer.md

Я бы хотел сделать это как отдельную функцию вместо того, чтобы просматривать весь код плагина, который я использую, пытаясь выяснить, как и где это сделать.

Кто-нибудь знает, как написать автономную функцию, которая будет делать это?

Ничего, что я делаю, похоже, не работает. Как мне решить эту проблему?

1 Ответ

1 голос
/ 30 апреля 2019

попробуйте

const EVENTS_TO_MODIFY = ['touchstart', 'touchmove', 'touchend', 'touchcancel', 'wheel'];

const originalAddEventListener = document.addEventListener.bind();
document.addEventListener = (type, listener, options, wantsUntrusted) => {
  let modOptions = options;
  if (EVENTS_TO_MODIFY.includes(type)) {
    if (typeof options === 'boolean') {
      modOptions = {
        capture: options,
        passive: false,
      };
    } else if (typeof options === 'object') {
      modOptions = {
        ...options,
        passive: false,
      };
    }
  }

  return originalAddEventListener(type, listener, modOptions, wantsUntrusted);
};

const originalRemoveEventListener = document.removeEventListener.bind();
document.removeEventListener = (type, listener, options) => {
  let modOptions = options;
  if (EVENTS_TO_MODIFY.includes(type)) {
    if (typeof options === 'boolean') {
      modOptions = {
        capture: options,
        passive: false,
      };
    } else if (typeof options === 'object') {
      modOptions = {
        ...options,
        passive: false,
      };
    }
  }
  return originalRemoveEventListener(type, listener, modOptions);
};
...