Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support passive listener #50

Closed
englishextra opened this issue Sep 16, 2017 · 5 comments
Closed

Support passive listener #50

englishextra opened this issue Sep 16, 2017 · 5 comments

Comments

@englishextra
Copy link

englishextra commented Sep 16, 2017

    function addEvent(elem, type, handler){
        if(elem.addEventListener) {
            elem.addEventListener(type, handler, false);
        } else if (elem.attachEvent) {
            elem.attachEvent('on' + type, handler);
        }
    }

Please see here:
https://developers.google.com/web/tools/lighthouse/audits/passive-event-listeners
https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md#feature-detection

The workaround for Lighthouse report is to test for passive support

var supportsPassive = false;
try {
	var opts = Object.defineProperty({}, "passive", {
			get: function () {
				supportsPassive = true;
			}
		});
	root.addEventListener("test", null, opts);
} catch (e) {}

If fails, include polyfill

	if (!supportsPassive) {
		scriptsArray.push("//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js");
	}

and change in wheel-indicator.js

    function addEvent(elem, type, handler){
        if(elem.addEventListener) {
            elem.addEventListener(type, handler, {passive: true});
        } else if (elem.attachEvent) {
            elem.attachEvent('on' + type, handler);
        }
    }

    function removeEvent(elem, type, handler) {
        if (elem.removeEventListener) {
            elem.removeEventListener(type, handler, {passive: true});
        } else if (elem.detachEvent) {
            elem.detachEvent('on'+ type, handler);
        }
    }

In that case the Lighthouse addon for Chrome is happy.

I suspect in other use cases the solution above may not be acceptable.

@harmvandeven
Copy link

In the latest version of OsX Chrome (Version 73.0.3683.86 (Official Build) (64-bit)) this now leads to console errors. Is somebody looking in to this?

[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/6662647093133312
preventDefault @ wheel-indicator.js:103
Module._wheelHandler @ wheel-indicator.js:33

@englishextra
Copy link
Author

@harmvandeven I use 67.0.3396.87 (Official Build) (64-bit) So I continue with the solution above, and can't offer any suggestion.

@ondrejrohon
Copy link

This PR should fix it, let me know if you have any troubles!

@englishextra
Copy link
Author

thanks

@f0rmat1k
Copy link
Member

f0rmat1k commented Oct 7, 2019

added with wheel-indicator@1.2.2

@f0rmat1k f0rmat1k closed this as completed Oct 7, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants