Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BUG] AnimatePresence does not execute exiting animations in sequence during fast renders #2462

Open
regexyl opened this issue Jan 3, 2024 · 1 comment · Fixed by #2477
Open

[BUG] AnimatePresence does not execute exiting animations in sequence during fast renders #2462

regexyl opened this issue Jan 3, 2024 · 1 comment · Fixed by #2477
Labels
bug Something isn't working

Comments

@regexyl
Copy link
Contributor

regexyl commented Jan 3, 2024 •
edited
Loading

1. Read the FAQs 👇
✅

2. Describe the bug
Items with an exit animation within the <AnimatePresence /> component do not reliably exit in sequence during fast renders.

3. IMPORTANT: Provide a CodeSandbox reproduction of the bug
https://codesandbox.io/p/devbox/dreamy-liskov-q35pmx

4. Steps to reproduce

  1. Click on the 'Add' button a few times in quick succession.
  2. Notice that the list items that appear below the button exit in a non-sequential order.

5. Expected behavior
The list items should exit in sequential order even during fast renders.

6. Video or screenshots

framer-motion-bug.mov

Notice that 'hey 6' jumped above 'hey 5' at the 0:04 second mark, while 'hey 7' disappeared before it's supposed to.
@regexyl regexyl added the bug Something isn't working label Jan 3, 2024
@regexyl
Copy link
Contributor Author

regexyl commented Jan 3, 2024

Working on a fix for this

regexyl added a commit to regexyl/motion that referenced this issue Jan 4, 2024
@regexyl
Fix sequence bug in AnimatePresence (motiondivision#2462)
ff425e0
regexyl added a commit to regexyl/motion that referenced this issue Jan 4, 2024
@regexyl
Fix sequence bug in AnimatePresence (motiondivision#2462)
4727856
regexyl added a commit to regexyl/motion that referenced this issue Jan 4, 2024
@regexyl
Fix sequence bug in AnimatePresence (motiondivision#2462)
f40eefe
@regexyl regexyl mentioned this issue Jan 5, 2024
Merged
regexyl added a commit to regexyl/motion that referenced this issue Jan 5, 2024
@regexyl
Fix sequence bug in AnimatePresence (motiondivision#2462)
26f12da
@108yen 108yen mentioned this issue Feb 8, 2024
Merged
@beefchimi beefchimi mentioned this issue Apr 29, 2024
Closed
mattgperry pushed a commit that referenced this issue Jul 24, 2024
@regexyl
Ensure AnimatePresence executes exiting animations in sequence (#2477)
f83739f 
* Fix sequence bug in AnimatePresence (#2462)

* Fix and add tests

* Remove comment

* Remove console logs
@mattgperry mattgperry reopened this Jul 24, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Ensure AnimatePresence executes exiting animations in sequence regexyl/motion
2 participants
@mattgperry @regexyl