react-onclickoutside: Unable to preventDefault on Chrome
I am having a bit of trouble with preventDefault in chrome. When I pass preventDefault={true} as prop, I get this warning in the chrome and preventDefault fails.
index.js:68 Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/5093566007214080
I also fails with the same error when I try event.preventDefault() inside handleClickOutside(event)
The error occurs on all Chrome versions >=54. It works fine on Firefox.
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Comments: 23 (4 by maintainers)
Commits related to this issue
- Provide explicit passive setting of the listener based on props.preventDefault as desktop/mobile have different defaults (fixes #168) — committed to Andarist/react-onclickoutside by Andarist 7 years ago
- Provide explicit passive setting of the listener based on props.preventDefault as desktop/mobile have different defaults (fixes #168) — committed to Andarist/react-onclickoutside by Andarist 7 years ago
- Provide explicit passive setting of the listener based on props.preventDefault as desktop/mobile have different defaults (fixes #168) — committed to Andarist/react-onclickoutside by Andarist 7 years ago
- Provide explicit passive setting of the listener based on props.preventDefault as desktop/mobile have different defaults (fixes #168) — committed to Andarist/react-onclickoutside by Andarist 7 years ago
@MrJadaml thanks for the reproduced case, it was really helpful in fixing this. Could u try to
and try this out? Im pretty confident it will help your case (checked on the codesandbox), but your confirmation would be great before publishing this as
latest.Let’s mention it in the documentation early on?
My first instinct after seeing the function
handleClickOutside(event)was to doevent.preventDefault()inside it because that is the most common/expected way of doing it. I dug deeper when it didn’t work and found prop.preventDefault.Ensuring that the api works with expected way of programming goes a long way in ensuring developer friendliness.