headlessui icon indicating copy to clipboard operation
headlessui copied to clipboard

Scroll lock behavior change from 2.0.x to 2.1 when using Transition + TransitionChild

Open mzeitlin11 opened this issue 1 year ago • 3 comments

What package within Headless UI are you using?

@headlessui/react

What version of that package are you using?

2.1.1

What browser are you using?

N/A

Reproduction URL https://codesandbox.io/p/sandbox/silly-dust-mzj4cc

Describe your issue After updating to 2.1.1 (to take advantage of the cool new transition features, thanks!), noticed dialogs using Transition and TransitionChild no longer lock scrolling.

  • In the CodeSandbox link above using 2.1.1, the background can still be scrolled when the dialog is open.
  • If you downgrade to 2.0.4 in the sandbox , the background cannot be scrolled.

This issue seems to have something to do with TransitionChild - I could not recreate it solely using Transition (but not checked too thoroughly).

mzeitlin11 avatar Jun 28 '24 19:06 mzeitlin11

Thanks @mzeitlin11 , I came here to report this exact issue. Were you able to find a workaround?

steve-marmalade avatar Aug 14 '24 18:08 steve-marmalade

Looks like this has been resolved. I upgraded to 2.1.3 and it doesn't scroll anymore.

Tittoh avatar Sep 03 '24 12:09 Tittoh

Unfortunately, upgrading to 2.1.3 doesn’t seem to be a workaround for us due to #3437.

short-dsb avatar Sep 04 '24 21:09 short-dsb