chore: add each reactive and key tests

packages/svelte/tests/custom-renderers/samples/each-block-reactive/_config.js

@@ -0,0 +1,21 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: '<button>add item</button> <ul><li>a</li><li>b</li><li>c</li></ul>',
+	test({ assert, target, serialize, dispatch_event }) {
+		const button = target.children.find(
+			(/** @type {any} */ n) => n.type === 'element' && n.name === 'button'
+		);
+		assert.ok(button);
+
+		dispatch_event(button, 'click');
+		flushSync();
+
+		const html = serialize(target);
+		assert.equal(
+			html,
+			'<button>add item</button> <ul><li>a</li><li>b</li><li>c</li><li>d</li></ul>'
+		);
+	}
+});

packages/svelte/tests/custom-renderers/samples/each-block-reactive/main.svelte

@@ -0,0 +1,11 @@
+<script>
+	let items = $state(['a', 'b', 'c']);
+</script>
+
+<button onclick={() => items.push('d')}>add item</button>
+
+<ul>
+	{#each items as item}
+		<li>{item}</li>
+	{/each}
+</ul>

packages/svelte/tests/custom-renderers/samples/key-block/_config.js

@@ -0,0 +1,18 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: '<button></button> <p>1</p>',
+	test({ assert, target, serialize, dispatch_event }) {
+		const button = target.children.find(
+			(/** @type {any} */ n) => n.type === 'element' && n.name === 'button'
+		);
+		assert.ok(button);
+
+		dispatch_event(button, 'click');
+		flushSync();
+
+		const html = serialize(target);
+		assert.equal(html, '<button></button> <p>2</p>');
+	}
+});

packages/svelte/tests/custom-renderers/samples/key-block/main.svelte

@@ -0,0 +1,10 @@
+<script>
+	let key = $state(0);
+	let not_state = 0;
+</script>
+
+<button onclick={() => key++}></button>
+
+{#key key}
+	<p>{++not_state}</p>
+{/key}