Git Product home page Git Product logo

Comments (9)

FRSgit avatar FRSgit commented on May 30, 2024

Hey @ddtch,
Before anything - can you please try to create codepen where we can reproduce the error?

Also:

  • is "index.js" in attached error stack trace is pointing to default-passive-events package?
  • I see you use React - do you use any other third-party libraries?
  • I think it's worth mentioning that our package, because of it's intended purpose, is tweaking handling of passive events globally which means there is no difference if you include it inside single component or for whole app.

from default-passive-events.

FRSgit avatar FRSgit commented on May 30, 2024

Okay, I figured out what's going on - in index.js:36 we check options variable only if it's typeof object and null is true value for such condition.

from default-passive-events.

FRSgit avatar FRSgit commented on May 30, 2024

Okay, it should be fixed with commit f34ad72.
Before I push the newest version to npm can you please, @ddtch, recheck if it got fixed?
Just instead of npm add our package directly from github, e.g. with this command:
npm install https://github.com/zzarcon/default-passive-events.git

from default-passive-events.

ddtch avatar ddtch commented on May 30, 2024

@FRSgit this helped and there is no error I reported, but no I got error. Here code from my component where I import passive events lib

class SomePage extends PureComponent {
	...
	componentDidMount() {
		...
		window.addEventListener('scroll', this.onScrollEvent);
	}

	componentWillUnmount() {
		window.removeEventListener('scroll', this.onScrollEvent);
	}

	onScrollEvent = () => {
		if(document.documentElement.scrollTop > 1200){
		    this.setState({showUpButton: true})
		} else {
		    this.setState({showUpButton: false})
		}
	};
	....
}

After I navigate to SomePage everything is fine. But when I pressed browser's 'back button' got error in console

warning.js:33 Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op. Please check the code for the SomePage component.

As I see for some reason eventListener actually not removes. So can you help me understand where the problem is?

from default-passive-events.

FRSgit avatar FRSgit commented on May 30, 2024

Okay, that one is connected with a way I've handled #19. Need another way to handle that one - I'm creating a wrapper around function passed to addEventListener, so it's not this.onScrollEvent anymore, but it's wrapper - that's why you later can't remove it properly (you try to remove listener this.onScrollEvent, but it won't work because our wrapper is actually the thing you should try to pass as a listener).

Give me some time to think about that, because now I don't have any good idea how to handle that one without regression on #19 (which I would like to avoid).

from default-passive-events.

ddtch avatar ddtch commented on May 30, 2024

ok, on weekend I also will think about it.

from default-passive-events.

FRSgit avatar FRSgit commented on May 30, 2024

Also - need to there is need to write test checking if removeEventListener functionality works well.

from default-passive-events.

FRSgit avatar FRSgit commented on May 30, 2024

Sorry, was on holidays for last weeks. Today I've started working on the problem here WICG/interventions#63 - or rather on how properly find out if current listener is passive or not.

from default-passive-events.

FRSgit avatar FRSgit commented on May 30, 2024

Unfortunately to bring important functionality of removingEventListener I needed to regress the package and remove fix for #19.

Problem is that "error message" caused by firing preventDefault in passive listener is not actually an error (under the hood it's just console.error), so it's not possible to catch & silence it.

In addition to what's above I've created issue on WHATWG repo - whatwg/dom#587 - let's see if anything will be done to cover our case.

Closing as fixed, rest of work is in hands of browser suppliers.

from default-passive-events.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.