diff --git a/test/runtime/samples/component-transition/_config.js b/test/runtime/samples/component-transition/_config.js
new file mode 100644
index 0000000000..cd086419a4
--- /dev/null
+++ b/test/runtime/samples/component-transition/_config.js
@@ -0,0 +1,19 @@
+export default {
+	async test({ assert, target, raf }) {
+		const button = target.querySelector('#button');
+		const container = target.querySelector("#container");
+
+		// Multiple click on button
+		await button.dispatchEvent(new window.MouseEvent('click'));
+		await button.dispatchEvent(new window.MouseEvent('click'));
+		await button.dispatchEvent(new window.MouseEvent('click'));
+		await button.dispatchEvent(new window.MouseEvent('click'));
+		await button.dispatchEvent(new window.MouseEvent('click'));
+		await button.dispatchEvent(new window.MouseEvent('click'));
+		await button.dispatchEvent(new window.MouseEvent('click'));
+
+		assert.equal(container.children.length, 1);
+		raf.tick(501);
+		assert.equal(container.children.length, 0);
+	}
+};
diff --git a/test/runtime/samples/component-transition/main.svelte b/test/runtime/samples/component-transition/main.svelte
new file mode 100644
index 0000000000..218b303b21
--- /dev/null
+++ b/test/runtime/samples/component-transition/main.svelte
@@ -0,0 +1,13 @@
+<script>
+	import { slide } from 'svelte/transition';
+	let tag = 'div';
+	function toggle() {
+		tag = (tag) ? null : 'div';
+	}
+</script>
+
+<button id="button" on:click={toggle}>toggle</button> TAG={tag}
+
+<div id="container">
+	<svelte:element this={tag} transition:slide={{duration:500}}>CONTENT</svelte:element>	
+</div>