diff --git a/test/runtime/samples/transition-intro/_config.js b/test/runtime/samples/transition-intro/_config.js
new file mode 100644
index 0000000000..bb60ad0e80
--- /dev/null
+++ b/test/runtime/samples/transition-intro/_config.js
@@ -0,0 +1,23 @@
+export default {
+	test ( assert, component, target, window ) {
+		let now = 0;
+		let callback;
+
+		window.performance = { now: () => now };
+		window.requestAnimationFrame = cb => callback = cb;
+
+		component.set({ visible: true });
+		const div = target.querySelector( 'div' );
+		assert.equal( window.getComputedStyle( div ).opacity, 0 );
+
+		now = 200;
+		callback();
+		assert.equal( window.getComputedStyle( div ).opacity, 0.5 );
+
+		now = 400;
+		callback();
+		assert.equal( window.getComputedStyle( div ).opacity, 1 );
+
+		component.destroy();
+	}
+};
\ No newline at end of file
diff --git a/test/runtime/samples/transition-intro/main.html b/test/runtime/samples/transition-intro/main.html
new file mode 100644
index 0000000000..80cd4aca49
--- /dev/null
+++ b/test/runtime/samples/transition-intro/main.html
@@ -0,0 +1,3 @@
+{{#if visible}}
+	<div in:style='{opacity: 0}'>fades in</div>
+{{/if}}
\ No newline at end of file