(BUG) [React] Can't click on anything after closing Dialog component

[Blaumaus]

What package within Headless UI are you using? @headlessui/react

What version of that package are you using? v1.6.5, but this bug seems to be present since v1.6.3

What browser are you using? Firefox

Reproduction URL https://github.com/Blaumaus/headless-dialog-bug

Describe your issue When I open the Dialog and close it, I can't click on anything as the component is still present in the DOM tree, but with an empty content.

Also there is this warning in the console - There are no focusable elements inside the <FocusTrap />.

UI Demonstration: (same issue is present on the test repository I provided, the demos are used as a real-world example recorded before)

https://user-images.githubusercontent.com/35810911/177014258-f5a829e7-a866-4073-b4a9-055d5d5bfbba.mp4

[mohammadshariat]

I have this problem too and what can we do for solve it ?

[alexandereneroth]

I've had the same issue for months now, but I've only seen it specifically on my Android phone after closing the modal while the on screen keyboard is showing 🤷

[jstnmthw]

I am experiencing this as well. What I've noticed is, everything is invisible but I can still click the form inputs that I set inisde my dialog (even though they're invisible).

[tianyingchun]

https://github.com/tailwindlabs/headlessui/issues/1705 it seems these are similar issue

[RobinMalfait]

This should be fixed by #1803, and will be available in the next release.

You can already try it using npm install @headlessui/react@insiders.