simplify tests

packages/svelte/tests/runtime-runes/samples/state-link-class/_config.js

@@ -1,38 +1,19 @@
 import { flushSync } from 'svelte';
-import { test, ok } from '../../test';
+import { test } from '../../test';
 
 export default test({
-	html: `<input type="number"><input type="number"><div>0</div><div>0</div><button>i+</button>`,
+	html: `<button>0</button><button>0</button>`,
-	ssrHtml: `<input type="number" value="0"><input type="number" value="0"><div>0</div><div>0</div><button>i+</button>`,
 
 	test({ assert, target }) {
-		const [input1, input2] = target.querySelectorAll('input');
+		const [btn1, btn2] = target.querySelectorAll('button');
-		ok(input1);
-		ok(input2);
-		assert.equal(input1.value, '0');
-		assert.equal(input2.value, '0');
 
-		const btn = target.querySelector('button');
+		flushSync(() => btn1.click());
+		assert.htmlEqual(target.innerHTML, `<button>1</button><button>1</button>`);
 
-		btn?.click();
+		flushSync(() => btn2.click());
-		flushSync();
+		assert.htmlEqual(target.innerHTML, `<button>1</button><button>2</button>`);
-		assert.htmlEqual(
-			target.innerHTML,
-			`<input type="number"><input type="number"><div>0</div><div>1</div><button>i+</button>`
-		);
 
-		assert.equal(input1.value, '0');
+		flushSync(() => btn1.click());
-		assert.equal(input2.value, '1');
+		assert.htmlEqual(target.innerHTML, `<button>2</button><button>2</button>`);
-
-		const event = new window.Event('input');
-
-		input1.value = '2';
-		input1.dispatchEvent(event);
-		flushSync();
-
-		assert.htmlEqual(
-			target.innerHTML,
-			`<input type="number"><input type="number"><div>2</div><div>2</div><button>i+</button>`
-		);
 	}
 });

packages/svelte/tests/runtime-runes/samples/state-link-class/main.svelte

@@ -1,19 +1,11 @@
-
 <script>
 	class Instance {
 		a = $state(0);
-		b = $state.link(this.a)
+		b = $state.link(this.a);
 	}
 
 	const instance = new Instance();
 </script>
 
-<input type="number" bind:value={instance.a} />
+<button onclick={() => instance.a++}>{instance.a}</button>
-<input type="number" bind:value={instance.b} />
+<button onclick={() => instance.b++}>{instance.b}</button>
-
-<div>{instance.a}</div>
-<div>{instance.b}</div>
-
-<button onclick={() => {
-	instance.b++;
-}}>i+</button>

packages/svelte/tests/runtime-runes/samples/state-link/_config.js

@@ -1,38 +1,19 @@
 import { flushSync } from 'svelte';
-import { test, ok } from '../../test';
+import { test } from '../../test';
 
 export default test({
-	html: `<input type="number"><input type="number"><div>0</div><div>0</div><button>i+</button>`,
+	html: `<button>0</button><button>0</button>`,
-	ssrHtml: `<input type="number" value="0"><input type="number" value="0"><div>0</div><div>0</div><button>i+</button>`,
 
 	test({ assert, target }) {
-		const [input1, input2] = target.querySelectorAll('input');
+		const [btn1, btn2] = target.querySelectorAll('button');
-		ok(input1);
-		ok(input2);
-		assert.equal(input1.value, '0');
-		assert.equal(input2.value, '0');
 
-		const btn = target.querySelector('button');
+		flushSync(() => btn1.click());
+		assert.htmlEqual(target.innerHTML, `<button>1</button><button>1</button>`);
 
-		btn?.click();
+		flushSync(() => btn2.click());
-		flushSync();
+		assert.htmlEqual(target.innerHTML, `<button>1</button><button>2</button>`);
-		assert.htmlEqual(
-			target.innerHTML,
-			`<input type="number"><input type="number"><div>0</div><div>1</div><button>i+</button>`
-		);
 
-		assert.equal(input1.value, '0');
+		flushSync(() => btn1.click());
-		assert.equal(input2.value, '1');
+		assert.htmlEqual(target.innerHTML, `<button>2</button><button>2</button>`);
-
-		const event = new window.Event('input');
-
-		input1.value = '2';
-		input1.dispatchEvent(event);
-		flushSync();
-
-		assert.htmlEqual(
-			target.innerHTML,
-			`<input type="number"><input type="number"><div>2</div><div>2</div><button>i+</button>`
-		);
 	}
 });

packages/svelte/tests/runtime-runes/samples/state-link/main.svelte

@@ -3,12 +3,5 @@
 	let b = $state.link(a);
 </script>
 
-<input type="number" bind:value={a} />
+<button onclick={() => a++}>{a}</button>
-<input type="number" bind:value={b} />
+<button onclick={() => b++}>{b}</button>
-
-<div>{a}</div>
-<div>{b}</div>
-
-<button onclick={() => {
-	b++;
-}}>i+</button>