mirrors/svelte
mirrors/svelte
0
0
Fork 0
mirror of https://github.com/sveltejs/svelte.git synced 2024-11-22 03:47:27 +01:00
Code Issues Releases Wiki Activity

fix: ensure transitions properly cancel on completion (#9778)

Browse Source
This commit is contained in:
Dominic Gannaway 2023-12-05 12:39:45 +00:00 committed by GitHub
parent ef158ff729
commit 25abca78b2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/lazy-masks-sit.md Normal file
View File

@ -0,0 +1,5 @@
---
'svelte': patch
---
fix: ensure transitions properly cancel on completion

9
packages/svelte/src/internal/client/transitions.js
View File

@ -177,9 +177,12 @@ class TickAnimation {
}
cancel() {
const t = this.#reversed ? 1 : 0;
active_tick_animations.delete(this);
this.#tick_fn(t, 1 - t);
const current = this.#current / this.#duration;
if (current > 0 && current < 1) {
const t = this.#reversed ? 1 : 0;
this.#tick_fn(t, 1 - t);
}
}
finish() {
@ -322,7 +325,7 @@ function create_transition(dom, init, direction, effect) {
animation.onfinish = () => {
const is_outro = curr_direction === 'out';
/** @type {Animation | TickAnimation} */ (animation).pause();
/** @type {Animation | TickAnimation} */ (animation).cancel();
if (is_outro) {
run_all(subs);
subs = [];

8
packages/svelte/tests/animation-helpers.js
View File

@ -102,16 +102,18 @@ class Animation {
}
finish() {
this.onfinish();
this.currentTime = this.#reversed ? 0 : this.#duration;
if (this.#reversed) {
raf.animations.delete(this);
}
this.onfinish();
}
cancel() {
this._applyKeyFrame(this.#reversed ? this.#keyframes.length - 1 : 0);
raf.animations.delete(this);
this.#paused = true;
if (this.currentTime > 0 && this.currentTime < this.#duration) {
this._applyKeyFrame(this.#reversed ? this.#keyframes.length - 1 : 0);
}
}
pause() {