ooade/react-click-away-listener

Click away listener not working the same on React 17

zenstok opened this issue · 5 comments

zenstok commented

I've updated from React 16.14.0 to React 17.0.2 and now it seems like click event listener component triggers whenever it's mounted. This made a component i created no longer work.

Can you check this?

ooade commented

@zenstok Sorry about that. Can you provide the version of the Clickaway listener you are using?

zenstok commented

@ooade i'm using version 2.0.0

react-click-away-listener@^2.0.0:
  version "2.0.0"
  resolved "https://registry.yarnpkg.com/react-click-away-listener/-/react-click-away-listener-2.0.0.tgz#b70e4b87f8529fef2ce658469f415f15fc689c83"
  integrity sha512-tD32K4usq0v+JWgeP+8B2B84rSR8Gcvs92cnBvlZkkBrgjVWetQUuMCN7De3vyZ36UcOG97JOvWGevyTMEHtdw==
ooade commented

Thanks.

I just updated the dependencies on the example and it works fine. Can you perhaps help recreate this on CodeSandbox and share? I'd appreciate that. 🙏

zenstok commented

https://codesandbox.io/s/clickawaylistener-example-forked-uch2g?file=/src/index.js

Above you have an example when it's not working. I figured it out and it looks like it doesn't work if i have a MaterialUI <Menu/>component with keepsMounted prop set to true.

Below you have the exact same code but with React version set to 16.14.0 and this one works.

https://codesandbox.io/s/clickawaylistener-example-forked-q7nz2?file=/src/index.js

  • 👍1
ooade commented

This has been fixed in the latest version (v2.0.1).

Thanks a lot for reporting and taking the time to create an example on CodeSandbox 🙏

  • 👍1