Menu clickOutside triggering on false positives

[justinsmid]

What package has an issue

@mantine/core

Describe the bug

A semi-recent change to <Menu /> (fee7d0e) changed the default clickOutsideEvents used by Menu. This has started causing false-positive triggers in our application. i.e.: our menus are closing from clicks that shouldn't close them.

The reason this happens is that we have an element in our menu that disappears when clicked. With the recent change mentioned above, your code to check whether the click was inside the menu now occurs after our code that removes the element triggers, whereas before the change your code triggered before our code. This leads to the event.target that your code uses being null (or undefined, I forgot) by the time your code runs, at which point it thinks the element is not in the menu.

To reproduce: go to the provided codesandbox, open the menu, type something into the searchbar and click Clear in the searchbar.

In which browser did the problem occur

I've confirmed it occurs on Chrome and Firefox, but I assume it occurs on all (major) browsers.

If possible, please include a link to a codesandbox with the reproduced problem

https://codesandbox.io/s/mantine-menu-close-false-positive-2sc307?file=/src/App.js

Do you know how to fix the issue

No

Are you willing to participate in fixing this issue and create a pull request with the fix

No

Possible fix

No response

[rtivital]

I recommend switching to Popover as in your case component will throw error when arrows are used. The behavior you are describing is odd and should not be related to commit changes, but I'll have a look.

[rtivital]

Fixed in 3.6.12

[rtivital]

Wrong issue

[rtivital]

Fixed in 3.6.13, your example works fine now