search

motiondivision / motion

A modern animation library for React and JavaScript
https://motion.dev
MIT License
25.98k stars 853 forks source link

[BUG] layout transition issue #2405

Open kiddyfurby opened 1 year ago

kiddyfurby commented 1 year ago

1. Read the FAQs 👇

2. Describe the bug

When transitioning between two layouts, the close animation becomes weird start with the second time.

3. IMPORTANT: Provide a CodeSandbox reproduction of the bug

Minimal example: https://codesandbox.io/s/young-tree-wmwqv5

4. Steps to reproduce

Steps to reproduce the behavior:

  1. Click the red square to trigger a popup with layout transition
  2. Click the blue square to close it, watch the perfect close transition
  3. Click the red square so it pops up again
  4. Click the blue square to close it, see the transition bug
  5. From this point onwards, the close transition is always buggy

5. Expected behavior

The close transition in step 4 should be identical to the one in step 2

7. Environment details

Chrome on mac os

Bat-Cave commented 11 months ago

+1 here. I've been running into this issue as well. In this sandbox, if you open and close the same card twice in a row, you get the weird layout bug.