From f886bc133ea310c4956a00202a31aa664e7d23db Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Fri, 17 Nov 2023 20:12:02 +0000
Subject: [PATCH] fix: handle intro global transition propagation correctly
 (#9515)

* fix: stop propagating global intros

* fix: stop propagating global intros

* add test
---
 .changeset/shiny-shrimps-march.md             |  5 ++++
 .../svelte/src/internal/client/transitions.js |  4 ++-
 .../key-block-transition-global/_config.js    | 25 +++++++++++++++++++
 .../key-block-transition-global/main.svelte   | 22 ++++++++++++++++
 4 files changed, 55 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/shiny-shrimps-march.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/key-block-transition-global/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/key-block-transition-global/main.svelte

diff --git a/.changeset/shiny-shrimps-march.md b/.changeset/shiny-shrimps-march.md
new file mode 100644
index 0000000000..a6920fae3e
--- /dev/null
+++ b/.changeset/shiny-shrimps-march.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: do not propagate global intro transitions
diff --git a/packages/svelte/src/internal/client/transitions.js b/packages/svelte/src/internal/client/transitions.js
index 4413af63c9..b07db93359 100644
--- a/packages/svelte/src/internal/client/transitions.js
+++ b/packages/svelte/src/internal/client/transitions.js
@@ -460,7 +460,8 @@ export function bind_transition(dom, transition_fn, props_fn, direction, global)
 			);
 
 		transition = create_transition(dom, init, direction, transition_effect);
-		const show_intro = !skip_intro && (direction === 'in' || direction === 'both');
+		const is_intro = direction === 'in';
+		const show_intro = !skip_intro && (is_intro || direction === 'both');
 
 		if (show_intro) {
 			transition.payload = transition.init();
@@ -484,6 +485,7 @@ 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))
 					) {
diff --git a/packages/svelte/tests/runtime-legacy/samples/key-block-transition-global/_config.js b/packages/svelte/tests/runtime-legacy/samples/key-block-transition-global/_config.js
new file mode 100644
index 0000000000..0b24498670
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/key-block-transition-global/_config.js
@@ -0,0 +1,25 @@
+import { flushSync } from '../../../../src/main/main-client';
+import { test } from '../../test';
+
+export default test({
+	html: '<div>0</div><button>toggle</button>',
+	async test({ assert, component, target, raf }) {
+		component.value = 2;
+
+		const [button] = /** @type {NodeListOf<HTMLButtonElement>} */ (
+			target.querySelectorAll('button')
+		);
+
+		raf.tick(0);
+
+		assert.htmlEqual(target.innerHTML, '<div>2</div><button>toggle</button>');
+
+		flushSync(() => {
+			button.click();
+		});
+
+		raf.tick(0);
+
+		assert.htmlEqual(target.innerHTML, '<button>toggle</button>');
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/key-block-transition-global/main.svelte b/packages/svelte/tests/runtime-legacy/samples/key-block-transition-global/main.svelte
new file mode 100644
index 0000000000..408719763d
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/key-block-transition-global/main.svelte
@@ -0,0 +1,22 @@
+<script>
+	export let value = 0;
+	export let toggle = true;
+
+	function foo(node, params) {
+		return {
+			duration: 100,
+			tick: (t, u) => {
+				node.foo = t;
+				node.oof = u;
+			}
+		};
+	}
+</script>
+
+{#if toggle}
+	{#key value}
+		<div in:foo|global>{value}</div>
+	{/key}
+{/if}
+
+<button on:click={() => toggle = !toggle}>toggle</button>