mantine icon indicating copy to clipboard operation
mantine copied to clipboard

flushSync was called from inside a lifecycle method

Open crabvk opened this issue 5 months ago • 2 comments
trafficstars

Dependencies check up

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

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

8.1.1

What package has an issue?

@mantine/core

What framework do you use?

Vite

In which browsers you can reproduce the issue?

Other, I will specify in the bug description

Describe the bug

Bug is present since Mantine 8.1.0, version 8.0.2 isn't affected. Reproduced in Chromium 137.0.7151.68 and Firefox 140.0b9. Description: I put several components on the page that use floating-ui library, for example Select, so to make scrollbar visible. Now, when I scroll fast the browser's tab stops responding and freezes. Chromium requires kill and restart, while Firefox shows dialog to pause and debug. In the console Firefox shows a lot of the same debug messages:

flushSync was called from inside a lifecycle method. React cannot flush when React is already rendering. Consider moving this call to a scheduler task or micro task. Stack: 
    InputBase InputBase.tsx:44
    Select Select.tsx:278
    ComboboxTarget ComboboxTarget.tsx:84
    Select Select.tsx:277
    children App.tsx:8
    App App.tsx:7
<anonymous code>:1:145535

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

https://stackblitz.com/~/github.com/crabvk/mantine-floating-ui-bug

Possible fix

I suspect it's a bug in Floating UI.

Self-service

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

crabvk avatar Jun 16 '25 13:06 crabvk