Skip to content

[BUG] AnimatePresence - enter and exit animations are mixed when they alternate rapidlyΒ #2618

@Thanaen

Description

@Thanaen

1. Read the FAQs πŸ‘‡
Done βœ…

2. Describe the bug
Enter and exit animations are mixed when they alternate rapidly.

3. IMPORTANT: Provide a CodeSandbox reproduction of the bug
https://stackblitz.com/edit/vitejs-vite-5ocwzr?file=src%2FApp.tsx

4. Steps to reproduce

  1. Slow click on "Next" and "Previous" to see the animation properly working
  2. Now quickly click on "Next" and "Previous" to see the animation break

5. Expected behavior

The animation that works when slowly clicking on "Next" and "Previous" should also work when quickly clicking on "Next" and "Previous"

6. Video or screenshots
framer-presence-issue

If applicable, add a video or screenshots to help explain the bug.

7. Environment details
Tested on:

  • Microsoft Edge 123.0.2420.81
  • Google Chrome 123.0.6312.123
  • Firefox 124.0.2

Tested on both framer-motion@^10 (currently 10.18.0) & framer-motion@^11 (currently 11.0.28)

UPDATE:
The problem doesn't actually exist on 10.18.0, even though this version has a small glitch visual (it blinks) when you make a quick change.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions