Tabs in Modal opened from Menu cause tab to become unresponsive in Firefox

[sienkiewiczkm]

Dependencies check up

• I have verified that I use latest version of all @mantine/* packages

What version of @mantine/* packages do you have in package.json?

7.8.1

What package has an issue?

@mantine/core

What framework do you use?

Vite

In which browsers you can reproduce the issue?

Firefox

Describe the bug

In <Menu/> I have a option that opens the <Modal/>, which inside contains the <Tabs/>. For some reason on Firefox, if you click on "Tab 2" whole browser tab will freeze and you'll be forced to kill the tab, minimal component that is able to trigger the failure:

const MyDemo = () => {
  const [opened, { open, close }] = useDisclosure(false);
  const modal = (
    <Modal opened={opened} onClose={close} title="hi" size="xl">
      <Tabs defaultValue="t1">
        <Tabs.List>
          <Tabs.Tab value="t1">Tab 1</Tabs.Tab>
          <Tabs.Tab value="t2">Tab 2</Tabs.Tab>
        </Tabs.List>
        <Tabs.Panel value="t1">Tab 1</Tabs.Panel>
        <Tabs.Panel value="t2">Tab 2</Tabs.Panel>
      </Tabs>
    </Modal>
  );

  return (
    <>
      <Text>Bug is reproducible only in Firefox</Text>
      <Menu shadow="md" width={350} position="bottom-end">
        <Menu.Target>
          <Button variant="subtle">Magic menu</Button>
        </Menu.Target>
        <Menu.Dropdown>
          <Menu.Label>Section</Menu.Label>
          <Menu.Item onClick={() => open()}>Open!</Menu.Item>
        </Menu.Dropdown>
      </Menu>
      {modal}
    </>
  );
};

User-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:125.0) Gecko/20100101 Firefox/125.0

This issue as far I can tell can be reproduced in Firefox and causes total freeze in the tab.

Demo:

• https://sienkiewiczkm.github.io/mantine-popovers-firefox-bug/ (repo: https://github.com/sienkiewiczkm/mantine-popovers-firefox-bug)
• also same thing in Codesandbox

I tried debugging this very deep into React internals, but I couldn't find a root cause.

Edit: Additional piece of context (possibly useless), strangely in my main repo (large app that I cannot share) this bug occurs only when I set NODE_ENV to production. That's not strictly required for the small repro repos.

If possible, include a link to a codesandbox with a minimal reproduction

https://codesandbox.io/p/sandbox/mantine-combobox-in-scrollable-popovers-forked-6qkwyn

Possible fix

No response

Self-service

• I would be willing to implement a fix for this issue

[sienkiewiczkm]

I just tested Firefox (125.0.3) on Windows and it works, so it appears that issue is MacOS exclusive (confirmed also on another MacOS machine). I don't know if Linux is affected.