Does DMenu work in Modals?

A search TextField when nested inside a DMenu and DropdownMenu, doesn’t seem to work in Modals.

It works fine on a normal page, e.g. profile settings, but when placed on a Modal the TextField doesn’t seem to respond to typing.

Is this because DMenu is using a portal and there is some problem with its relationship with the modal div?

Here’s an example:

Simply put, if I place a debugger statement on the search action, I can show that when placed in a Modal, you never arrive at the search function, but on a “normal” page (outside of a Modal), the event will fire correctly and the search is started.

You cant even type, even if I remove the event hooks.

If I place the TextField in this component outside of the DMenu (still accessed on a modal)- typing behaves as normal.

What am I missing, and why does the behaviour change?

2 Likes