GSAP
GSAP copied to clipboard
Unexpected behavior: Animation can be resumed after kill() when pause() is called in between
I've noticed an unexpected behavior in GSAP animations that might be a bug. Here's the scenario:
- Create a GSAP animation using fromTo()
- Call kill() on the animation
- Call pause() on the animation
- Call resume() on the animation
Expected behavior: The animation should not resume, as it has been killed and should no longer exist in the GSAP system.
Actual behavior: The animation resumes and plays as if it was never killed.
This behavior is inconsistent because:
- If you call resume() immediately after kill(), the animation does not resume (which is expected).
- However, if you insert a pause() call between kill() and resume(), the animation mysteriously comes back to life.
Steps to reproduce:
- Create a simple GSAP animation:
let tween = gsap.fromTo(".myElement", {x: 0}, {x: 100, duration: 2});
- Immediately kill the animation:
tween.kill();
- Then pause it:
tween.pause();
- Finally, try to resume it:
tween.resume();
The animation will unexpectedly play.
Questions:
- Is this intended behavior?
- If not, is this a known issue?
- Are there any workarounds or best practices to avoid this unexpected behavior?
Environment:
- GSAP version: https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.4/gsap.min.js
Thank you for your time and consideration!