zzarcon / default-passive-events Goto Github PK

Hello, lighthouse detects this library as depracated due to planned removal of some DOMevents:

DOM Mutation Events, including DOMSubtreeModified, DOMNodeInserted, DOMNodeRemoved, DOMNodeRemovedFromDocument, DOMNodeInsertedIntoDocument, and DOMCharacterDataModified are deprecated (https://w3c.github.io/uievents/#legacy-event-types) and will be removed. Please use MutationObserver instead.

The library is great, are you planning to migrate to MutationObservers instead? I think it would be worth giving it a try.

Would be nice to have an option to override default supportedPassiveTypes list, for example to exclude some events.

Hello!

I'm facing this issue in my current development: https://github.com/museui/muse-ui/issues/761

Can this package be used to prevent another framework from generating non passive event listeners? I've installed it but it gives me the same output:

I've debugged the extension and it always passes false to the event listener creation.

What is happening here?

Thanks.

In some cases legacy code may create event handlers via libraries that do not support passive events option (e.g. jquery click handlers within i.e. mobile application). In order to perform transition to default passive events it might be good to save original .preventDefault method so it can be used as a safe point of passive events integration.

Do you think it is posisble to add it?

Regards!

Please fix the example url at Check the demo.html for a working example.

Getting this error:

DevTools failed to load source map: Could not load content for https://unpkg.com/index.umd.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

Cause by file in dist folder used in CDN production enviroment:

//# sourceMappingURL=index.umd.js.map

We need min.js version that can be used in production and no additional request is in file

https://github.com/zzarcon/default-passive-events/blob/master/src/index.js#L8

whell !== wheel

• Travis CI
• Initial coverage

I imported 'default-passive-events' in one of my components where I use event listener and it was fine, but now when I navigate throw site, on one of the pages I got error like

I tried to remove all window and document listeners, to found a problem but that didn't helped. Any ideas || suggestions?

I started using that plugin recently and it's a powerful plugin.

But after the ajax request and when new content is adding to a page cursor event not work during the appending of new content, only the scroll event works not the other events.
All my page is blocked(for some seconds) until the appending process finish.

How could i do to make cursor event working while the jquery is appending new content ?

Thanks.

Hello,
I'm using https://github.com/mervick/emojionearea with your plug-in but your plug-in seem not to be compatible with https://github.com/mervick/emojionearea.

EmojioneArea uses mousedown event and it require to use event.preventDefault() in not passive mode.

I would like to know if it was possible to desactivate passive mode for specific contents or specific elements ?
I would like to desactivate passive mode for ".emojionearea-editor" .

Thanks.

I am assuming that 'whell' should have been 'wheel' here...
https://github.com/zzarcon/default-passive-events/blob/master/src/index.js#L8

Is it possible to add the passive flag by default to other events like "animationend" or "transitionend"?

When using third party libraries (e.g. jQuery or lory.js) this error rises often - it's due to fact that their listeners arent using passive event flag as default and still use preventDefault which in case of our default-passive property raises an error.

I've just tried to use the CDN for my website and it giving me a 404 error

Could not load content for https://unpkg.com/index.umd.js.map: HTTP error: status code 404,

Hi,

I'm having issue when using your plugin with Select2.

I'm using jQuery and several plugins so what will be the best position for default-passive-events file?
Prior any JS script first item
After JQuery
The last item

Thanks

Hi,

I'm default-passive-events this fixed almost all my issues except one case...

I'm using Select2 plugin for my dropdown and this creating an Error (not a warning) in the browser
jQuery-2.2.0.min.js:3 Unable to preventDefault inside passive event listener invocation.
and pointing code line related to Select2 mousewheel.

Unable to preventDefault inside passive event listener invocation.

if ($.fn.mousewheel) {
      this.$results.on('mousewheel', function (e) {
        var top = self.$results.scrollTop();

        var bottom = self.$results.get(0).scrollHeight - top + e.deltaY;

        var isAtTop = e.deltaY > 0 && top - e.deltaY <= 0;
        var isAtBottom = e.deltaY < 0 && bottom <= self.$results.height();

        if (isAtTop) {
          self.$results.scrollTop(0);

          e.preventDefault();
          e.stopPropagation();
        } else if (isAtBottom) {
          self.$results.scrollTop(
            self.$results.get(0).scrollHeight - self.$results.height()
          );

          e.preventDefault();
          e.stopPropagation();
        }
      });
    }


 if (nullLowestDeltaTimeout) { clearTimeout(nullLowestDeltaTimeout); }
        nullLowestDeltaTimeout = setTimeout(nullLowestDelta, 200);

        return ($.event.dispatch || $.event.handle).apply(this, args);
    }

This occured on static list and on my Ajax list.

Anyone have a solution for this?

It's look like similar issue occurred in the past but I don't know how to fix it to make it work with Select2
#19
#5

Hello 👋

Interesting utility, I'm keen to give it a spin.

There is something I would like to share about scroll event. I've read some docs recently and I've noticed this:

You don't need to worry about the value of passive for the basic scroll event. Since it can't be canceled, event listeners can't block page rendering anyway.

from here

and another note from here

Note: The basic scroll event cannot be canceled, so it does not need to be set passive.

What are your thoughts on this matter?

Yo bro, i've implemented your script on my WordPress site and i'm getting this error in console:

Can you help me debug it?

Can it to filter applied events somehow?

I'm get a lot of errors in angular, for example:

Unable to preventDefault inside passive event listener invocation. platform-browser.es5:2651

Force passive should not be applied to non-touch&&non-wheel events.

The code doesn't work for YouTube videos embedded in an iFrame, like this:

<iframe width="420" height="315" src="https://www.youtube.com/embed/DJYpXxWqvmo" allowfullscreen></iframe>

This one iframe generates four instances of this console error:

[Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952

Can this please be fixed? Many thanks!

Hi there,

Thanks for sharing this tool. I am curious how I can integrate it with smooth scroll libraries like locomotive scroll (https://github.com/locomotivemtl/locomotive-scroll). Any kind of help or guidance is really appreciated.

I am a lover of smooth scroll so it would be a huge help.

Regards,
Shehzad Asif

When I used this repository, after clicking on any link on the site. I got this error

I got this error w/ angular and angular material

ERROR TypeError: Cannot set property passive of [object Object] which has only a getter
    at EventTarget.addEventListener (modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:10606)
    at modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:21335
    at Object.supportsPassiveEventListeners (modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:114890)
    at modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:117297
    at ZoneDelegate.invoke (modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:19984)
    at Zone.run (modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:19734)
    at NgZone.runOutsideAngular (modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:29928)
    at FocusMonitor._registerGlobalListeners (modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:117294)
    at FocusMonitor._incrementMonitoredElementCount (modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:117478)
    at FocusMonitor.monitor (modules.js?hash=c08a6c1be18ea8d3c65fba22b566f1b2e49111a3:117190)

i use default-passive-events,control will say "Unable to preventDefault inside passive event listener"
when i uninstall this,it will warn "Added non-passive event listener to a scroll-blocking 'mousewheel' eve"

how can i solve this problem

If you have time
please share how to add this setup on a wordpress site if possible
thanks in advance

I was curious when it didn't work in my app. Not sure if it matters, but I installed default-passive-events via NPM. I'm building a React application in Windows 10 using Chrome Version 70.0.3538.110 (Official Build) (64-bit). Maybe it's because it's React, but that's why I wanted to try your package, anyway I went to your example and ran an audit and either you're not using it on your own example or it just doesn't work. Thought I'd share with you.