headlessui icon indicating copy to clipboard operation
headlessui copied to clipboard

Transition enterFrom classes not working with Menu

Open zce opened this issue 2 years ago • 4 comments

What package within Headless UI are you using?

@headlessui/react

What version of that package are you using?

v2.0.0-alpha.4

What browser are you using?

Edge

Reproduction URL

https://stackblitz.com/edit/stackblitz-starters-a9u657?file=app%2Fmenu-demo.tsx

Describe your issue

https://github.com/tailwindlabs/headlessui/assets/6166576/d05ae94f-2766-4b8a-bf30-806c11360013

zce avatar Jan 04 '24 11:01 zce

I have similar issue with Dialog.

  • The issue started with 1.7.18.
  • Current fix is to roll back to 1.7.17.
  • One noticeable issue seems to be not all steps are correctly iterated. At least the "enterTo" class is not persistent as it should when the dialog is open.
  • The issue seems to occur with any use of <Transition/>

ilkkakuivanen avatar Jan 11 '24 17:01 ilkkakuivanen

I have similar issue with Dialog.

  • The issue started with 1.7.18.
  • Current fix is to roll back to 1.7.17.
  • One noticeable issue seems to be not all steps are correctly iterated. At least the "enterTo" class is not persistent as it should when the dialog is open.
  • The issue seems to occur with any use of <Transition/>

I think this bug might be introduced by https://github.com/tailwindlabs/headlessui/pull/2722. Agree that enterTo should persist what it has, as making what was enterTo to be entered will be a different behavior here.

RaenonX avatar Jan 14 '24 13:01 RaenonX

@ilkkakuivanen I've created a codesandbox here with version 1.7.17 but the transition still isn't working. Any ideas?

sahibjotsaggu avatar Feb 05 '24 22:02 sahibjotsaggu

I have pinpointed a bug relating to enterTo to being introduced in 1.7.18, I upgraded version-by-version to confirm this.

The following transitions worked in 1.7.17 but in 1.7.18 the classes for enterTo are never appended to the element. image

As mentioned before this is most likely due to #2722 . Could @RobinMalfait confirm?

areriklq avatar Feb 14 '24 21:02 areriklq

Hey!

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

You can already try it using:

  • npm install @headlessui/react@insiders.

RobinMalfait avatar Apr 05 '24 14:04 RobinMalfait

Hi @RobinMalfait May I know which version include this fix? Despite the timeline (your comment 2 weeks ago vs v1.7.19 release 5 days ago), this fix seems only included insiders version, not the formal release version.

See https://github.com/RaenonX/test-transition/commits/main/ where after https://github.com/RaenonX/test-transition/commit/a915a75be566c2c9bdfac02970c772cc14451489, the issue still persists, and only gets fixed by https://github.com/RaenonX/test-transition/commit/45f73ad377f546358a2a03aa83b96d8a05ce8d8d.

RaenonX avatar Apr 20 '24 05:04 RaenonX