react-spring icon indicating copy to clipboard operation
react-spring copied to clipboard

phase property in useTransition does not work as expected

Open somewonderfulguy opened this issue 4 years ago • 0 comments

🐛 Bug Report

In v8 with useTransition hook you could use it this way: {transitions.map(({item, props: {opacity}, key, state}) => { ... And later in the body of map fn use let's say such condition: state === 'leave'. And it works great in v8.

In v9 with useTransition hook there's a bit different way to use: {transitions(({opacity}, item, {phase}) => { ... The leave in phase does not work correctly. It is no way to use phase === 'leave'. In my application I develop I started migration to v9. And leave happens very-very rarely.

To Reproduce

Please, see two codesanboxes I provide below.

Expected behavior

When transition goes away it should have phase as leave

Link to repro

These two examples are the same, just few differences depending on react-spring version:

v8 - https://codesandbox.io/s/j04bi

please, see here I added console.log when you hover and un-hover in very calm manner, you will see only enter and mount logs. If you hover/un-hover like a frenzy, then you will see leave logs. Anyways, works not as expected. v9 - https://codesandbox.io/s/leave-v9-e7072

somewonderfulguy avatar Aug 04 '21 20:08 somewonderfulguy