test

Author: Rich-Harris

packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/_config.js

@@ -0,0 +1,26 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	html: '<p>42</p><p>42</p><button>update</button><button>reset</button>',
+
+	test({ assert, target }) {
+		const [update, reset] = target.querySelectorAll('button');
+		flushSync(() => update.click());
+
+		assert.htmlEqual(
+			target.innerHTML,
+			'<p>42</p><p>42</p><button>update</button><button>reset</button>'
+		);
+
+		flushSync(() => reset.click());
+	},
+
+	warnings: [
+		'A `$:` statement (main.svelte:4:1) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode'
+	]
+});

packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/data.svelte.js

@@ -0,0 +1,11 @@
+export const obj = $state({
+	prop: 42
+});
+
+export function update() {
+	obj.prop += 1;
+}
+
+export function reset() {
+	obj.prop = 42;
+}

packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/main.svelte

@@ -0,0 +1,13 @@
+<script>
+	import { obj, update, reset } from './data.svelte.js';
+
+	$: a = obj.prop;
+
+	// svelte-ignore reactive_declaration_non_reactive_property
+	$: b = obj.prop;
+</script>
+
+<p>{a}</p>
+<p>{b}</p>
+<button on:click={update}>update</button>
+<button on:click={reset}>reset</button>