From 5c494f03ba81278aceed7c20cfd9a3fa7f74caa2 Mon Sep 17 00:00:00 2001
From: Seohyun Lee <studioseorii@gmail.com>
Date: Sat, 22 Oct 2022 18:12:35 +0900
Subject: [PATCH] feat: add test for onDestroy call with transition nested
 component(#5268)

---
 .../samples/transition-js-outro/Inner.svelte  |  8 +++++++
 .../samples/transition-js-outro/_config.js    |  8 +++++++
 .../samples/transition-js-outro/main.svelte   | 24 +++++++++++++++++++
 3 files changed, 40 insertions(+)
 create mode 100644 test/runtime/samples/transition-js-outro/Inner.svelte
 create mode 100644 test/runtime/samples/transition-js-outro/_config.js
 create mode 100644 test/runtime/samples/transition-js-outro/main.svelte

diff --git a/test/runtime/samples/transition-js-outro/Inner.svelte b/test/runtime/samples/transition-js-outro/Inner.svelte
new file mode 100644
index 00000000000..37edbbd1e66
--- /dev/null
+++ b/test/runtime/samples/transition-js-outro/Inner.svelte
@@ -0,0 +1,8 @@
+<script>
+	import { onDestroy, createEventDispatcher } from 'svelte';
+	const dispatch = createEventDispatcher();
+
+	onDestroy(() => dispatch('destroyed'));
+</script>
+
+<div></div>
diff --git a/test/runtime/samples/transition-js-outro/_config.js b/test/runtime/samples/transition-js-outro/_config.js
new file mode 100644
index 00000000000..854ab4abd80
--- /dev/null
+++ b/test/runtime/samples/transition-js-outro/_config.js
@@ -0,0 +1,8 @@
+export default {
+	test({ assert, component, raf }) {
+		component.visible = false;
+
+		raf.tick(50);
+		assert.equal(component.destroyed, true);
+	}
+};
diff --git a/test/runtime/samples/transition-js-outro/main.svelte b/test/runtime/samples/transition-js-outro/main.svelte
new file mode 100644
index 00000000000..2248c2a8ac2
--- /dev/null
+++ b/test/runtime/samples/transition-js-outro/main.svelte
@@ -0,0 +1,24 @@
+<script>
+	import Inner from './Inner.svelte';
+
+	export let visible = true, destroyed = false;
+
+	function foo(node) {
+		return {
+			duration: 100,
+			tick: t => {
+				node.foo = t;
+			}
+		};
+	}
+
+	const onDestroy = () => {
+		destroyed = true;
+	};
+</script>
+
+{#if visible}
+	<div transition:foo>
+		<Inner on:destroyed={onDestroy}/>
+	</div>
+{/if}