From b0588d7888253e3dda7a64c3e193cfcdb596a651 Mon Sep 17 00:00:00 2001 From: Dominic Gannaway Date: Sat, 18 Nov 2023 14:34:40 +0000 Subject: [PATCH] fix: address intro transition bugs (#9528) * fix: address intro transition bugs * fix: address intro transition bugs --- .changeset/odd-needles-joke.md | 5 +++++ packages/svelte/src/internal/client/render.js | 2 ++ packages/svelte/src/internal/client/transitions.js | 4 ---- .../samples/transition-js-each-block-intro-outro/_config.js | 6 +++--- .../samples/transition-js-if-else-block-intro/_config.js | 2 +- 5 files changed, 11 insertions(+), 8 deletions(-) create mode 100644 .changeset/odd-needles-joke.md diff --git a/.changeset/odd-needles-joke.md b/.changeset/odd-needles-joke.md new file mode 100644 index 0000000000..94d2f1f585 --- /dev/null +++ b/.changeset/odd-needles-joke.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: address intro transition bugs diff --git a/packages/svelte/src/internal/client/render.js b/packages/svelte/src/internal/client/render.js index b860a4c3f6..d7aa1b54fc 100644 --- a/packages/svelte/src/internal/client/render.js +++ b/packages/svelte/src/internal/client/render.js @@ -1399,6 +1399,7 @@ function if_block(anchor_node, condition_fn, consequent_fn, alternate_fn) { block.current = result; if (has_mounted) { if (result) { + remove_in_transitions(alternate_transitions); if (alternate_transitions.size === 0) { execute_effect(alternate_effect); } else { @@ -1410,6 +1411,7 @@ function if_block(anchor_node, condition_fn, consequent_fn, alternate_fn) { trigger_transitions(consequent_transitions, 'in'); } } else { + remove_in_transitions(consequent_transitions); if (consequent_transitions.size === 0) { execute_effect(consequent_effect); } else { diff --git a/packages/svelte/src/internal/client/transitions.js b/packages/svelte/src/internal/client/transitions.js index 357e287d4e..1c59dd7d7f 100644 --- a/packages/svelte/src/internal/client/transitions.js +++ b/packages/svelte/src/internal/client/transitions.js @@ -485,7 +485,6 @@ export function bind_transition(dom, transition_fn, props_fn, direction, global) } if ( parent === null || - is_intro || (!global && (transition_block.type !== IF_BLOCK || parent.type !== IF_BLOCK || parent.current)) ) { @@ -530,9 +529,6 @@ export function trigger_transitions(transitions, target_direction, from) { const direction = transition.direction; if (target_direction === 'in') { if (direction === 'in' || direction === 'both') { - if (direction === 'in') { - transition.cancel(); - } transition.in(); } else { transition.cancel(); diff --git a/packages/svelte/tests/runtime-legacy/samples/transition-js-each-block-intro-outro/_config.js b/packages/svelte/tests/runtime-legacy/samples/transition-js-each-block-intro-outro/_config.js index 58de002579..144dcf03bc 100644 --- a/packages/svelte/tests/runtime-legacy/samples/transition-js-each-block-intro-outro/_config.js +++ b/packages/svelte/tests/runtime-legacy/samples/transition-js-each-block-intro-outro/_config.js @@ -35,9 +35,9 @@ export default test({ component.visible = true; raf.tick(100); - assert.equal(divs[0].foo, 0.3); - assert.equal(divs[1].foo, 0.3); - assert.equal(divs[2].foo, 0.3); + assert.equal(divs[0].foo, 1); + assert.equal(divs[1].foo, 1); + assert.equal(divs[2].foo, 1); assert.equal(divs[0].bar, 1); assert.equal(divs[1].bar, 1); diff --git a/packages/svelte/tests/runtime-legacy/samples/transition-js-if-else-block-intro/_config.js b/packages/svelte/tests/runtime-legacy/samples/transition-js-if-else-block-intro/_config.js index b2d80105f2..130cfb9dde 100644 --- a/packages/svelte/tests/runtime-legacy/samples/transition-js-if-else-block-intro/_config.js +++ b/packages/svelte/tests/runtime-legacy/samples/transition-js-if-else-block-intro/_config.js @@ -14,7 +14,7 @@ export default test({ raf.tick(500); component.x = true; - assert.equal(component.no, target.querySelector('div')); + assert.equal(component.no, null); assert.equal(component.yes.foo, undefined); raf.tick(700);