Toast timers get stuck when exit animated with Framer Motion
- Dominant language
- TypeScript
- Stars
- 15.9k
- Forks
- 1.6k
- Avg merge
- 3d 9m
- Merged PRs (30d)
- 59
Description
### Provide a general summary of the issue here
Toast timers get stuck when exit animated with Framer Motion.
### 🤔 Expected Behavior?
Toast timers should never get stuck.
### 😯 Current Behavior
Toast timers get stuck.
### 💁 Possible Solution
_No response_
### 🔦 Context
_No response_
### 🖥️ Steps to Reproduce
https://codesandbox.io/p/sandbox/upbeat-roman-gp8dgr
1. Trigger 2 toasts from the button
2. Click close button for the bottom toast
3. Move mouse away from the toast region
4. Wait until last toast closes --> all good until this point
5. Trigger 2 toasts again
6. Click close button for the bottom toast
7. Move mouse away from the toast region
8. Last toast does not close because timer is stuck
### Version
react-aria v3.38.1, react-stately v3.36.1
### What browsers are you seeing the problem on?
Chrome
### If other, please specify.
_No response_
### What operating system are you using?
Windows 11
### 🧢 Your Company/Team
_No response_
### 🕷 Tracking Issue
_No response_
Contributor guide
Research direction
Start with the linked CodeSandbox reproduction using react-aria v3.38.1 and react-stately v3.36.1, then trace the toast timer behavior when Framer Motion exit animation removes the bottom toast. Reproduce the eight listed steps in Chrome and confirm that the remaining toast closes normally after the timer resumes.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100