(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)

headless-dialog-bug-2022-07-02_22.39.50.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]

#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.