diff --git a/test/runtime/samples/inline-style-directive-and-style-attr-merged/_config.js b/test/runtime/samples/inline-style-directive-and-style-attr-merged/_config.js
index f5780daf80..80f4a64f5a 100644
--- a/test/runtime/samples/inline-style-directive-and-style-attr-merged/_config.js
+++ b/test/runtime/samples/inline-style-directive-and-style-attr-merged/_config.js
@@ -3,11 +3,15 @@ export default {
 		<p style="height: 40px; color: red;"></p>
 	`,
 
-	test({ assert, target, window }) {
-		const p = target.querySelector('p');
+	test({ assert, target, window, component }) {
+		const p = target.querySelector("p");
 
 		const styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'red');
-		assert.equal(styles.height, '40px');
-	}
+		assert.equal(styles.color, "red");
+		assert.equal(styles.height, "40px");
+
+		component.color2 = "yellow";
+		const updated_styles = window.getComputedStyle(p);
+		assert.equal(updated_styles.color, "red");
+	},
 };
diff --git a/test/runtime/samples/inline-style-directive-and-style-attr-merged/main.svelte b/test/runtime/samples/inline-style-directive-and-style-attr-merged/main.svelte
index 6f3e86b9bf..f875175733 100644
--- a/test/runtime/samples/inline-style-directive-and-style-attr-merged/main.svelte
+++ b/test/runtime/samples/inline-style-directive-and-style-attr-merged/main.svelte
@@ -1,5 +1,6 @@
 <script>
-	export let color = 'red';
+	export let color1 = 'red';
+	export let color2 = 'blue';
 </script>
 
-<p style="height: 40px; color: blue;" style:color={color} />
+<p style="height: 40px; color: {color2};" style:color={color1} />