Using current versions of react-dom
and @material-ui
, I need to stopPropagation
and/or preventDefault
in quite a few places. I've never ran into a problem like in this article and I guess, it can't happen because of how Material-UI works: AFAIK open dialogs and modals get the event first, so they get always closed, when clicking outside.
Am I right with this assumption?
If so, are there still cases, when I should not
stopPropagation
and/orpreventDefault
?
Anyway, I'm tired of complicating all event handlers by this boilerplate. I'd like to automate this, is it possible?
Update
I'm not providing an example, where stopPropagation
is necessary, as it can't help (we all know it's needed sometimes, don't we?). It has happened to me several times, e.g., clicking a close button in a MUI Popover
forwarded the click to the button which opened the popover (so it stayed open).
Note that the question has three parts. If there's no automated solution (I'd bet, React itself could do it), I'm most curious about cases where the suppression should not happen when using MUI.
stopPropagation
andpreventDefault
. I'm confused as to why you would have this kind of "boilerplate" in a lot of event handlers. I certainly wouldn't expect to need it so often as to want to automate it. – EuphrasydoNotStopPropagation
for this case. I use no forms, so I don't have your use case. It's not often, it's surprisingly (see my example in the section "Update"). The non-closing dialog was trivial to spot and trivial to fix, but having zero such problems would be much better. – Cameron