chore: add some failing tests (#18528)

During my explorations I collected these new tests which are currently
failing. Two of them work on the incremental-batches branch, all of them
(adjusted for new behavior) pass on my uncommitted entangle batches
branch, and all of them also pass on another uncommitted experimental
branch of overlaying deriveds which will likely not land.

packages/svelte/tests/runtime-runes/samples/async-derived-log-outside-reactivity/_config.js

@@ -0,0 +1,42 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	skip: true, // TODO fix
+	async test({ assert, target, logs }) {
+		await tick();
+
+		const [a, b, log, resolve] = target.querySelectorAll('button');
+		const [p] = target.querySelectorAll('p');
+
+		a.click();
+		await tick();
+		assert.htmlEqual(p.innerHTML, '0 0 0');
+
+		b.click();
+		await tick();
+		assert.htmlEqual(p.innerHTML, '0 0 0');
+
+		log.click();
+		await tick();
+		assert.deepEqual(logs, [0, 2]);
+
+		resolve.click();
+		await tick();
+		assert.htmlEqual(p.innerHTML, '1 0 1');
+		assert.deepEqual(logs, [0, 2, 1]);
+
+		log.click();
+		await tick();
+		assert.deepEqual(logs, [0, 2, 1, 2]);
+
+		resolve.click();
+		await tick();
+		assert.htmlEqual(p.innerHTML, '1 1 2');
+		assert.deepEqual(logs, [0, 2, 1, 2, 2]);
+
+		log.click();
+		await tick();
+		assert.deepEqual(logs, [0, 2, 1, 2, 2, 2]);
+	}
+});

packages/svelte/tests/runtime-runes/samples/async-derived-log-outside-reactivity/main.svelte

@@ -0,0 +1,23 @@
+<script>
+	let a = $state(0);
+	let b = $state(0);
+
+	let d = $derived(a + b);
+
+	let queued = [];
+	function push(v) {
+		if (!v) return v;
+		return new Promise((resolve) => {
+			queued.push(() => resolve(v));
+		});
+	}
+
+	$effect(() => console.log(d));
+</script>
+
+<button onclick={() => a++}>a++</button>
+<button onclick={() => b++}>b++</button>
+<button onclick={() => console.log(d)}>log d</button>
+<button onclick={() => queued.shift()?.()}>resolve</button>
+
+<p>{await push(a)} {await push(b)} {d}</p>

packages/svelte/tests/runtime-runes/samples/async-derived-not-overfiring/_config.js

@@ -0,0 +1,35 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	skip: true, // TODO fix
+	async test({ assert, target, logs }) {
+		await tick();
+
+		const [a, b, log, resolve] = target.querySelectorAll('button');
+		const [div] = target.querySelectorAll('div');
+
+		assert.deepEqual(logs, ['e1 0', 'e2 0']);
+		logs.length = 0;
+
+		a.click();
+		await tick();
+		assert.htmlEqual(div.innerHTML, '<p>0</p> <p>0</p> <p>0</p>');
+
+		b.click();
+		await tick();
+		assert.htmlEqual(div.innerHTML, '<p>0</p> <p>1</p> <p>1</p>');
+
+		log.click();
+		await tick();
+		assert.deepEqual(logs, ['e1 1', 'e2 1', 'runs 2']); // ideally it's only 2 runs, one or two more would also be acceptable but not the 8 that it's today
+		logs.length = 0;
+
+		resolve.click();
+		await tick();
+		log.click();
+		await tick();
+		assert.htmlEqual(div.innerHTML, '<p>1</p> <p>2</p> <p>2</p>');
+		assert.deepEqual(logs, ['e1 2', 'e2 2', 'runs 3']);
+	}
+});

packages/svelte/tests/runtime-runes/samples/async-derived-not-overfiring/main.svelte

@@ -0,0 +1,29 @@
+<script>
+	let a = $state(0);
+	let b = $state(0);
+	let runs = 0;
+
+	let d = $derived((runs++, a + b));
+
+	const queued = [];
+	function push(v) {
+		if (!v) return v;
+		return new Promise((resolve) => {
+			queued.push(() => resolve(v));
+		});
+	}
+
+	$effect(() => console.log('e1 ' + d));
+	$effect(() => console.log('e2 ' + d));
+</script>
+
+<button onclick={() => a++}>a++</button>
+<button onclick={() => b++}>b++</button>
+<button onclick={() => console.log('runs ' + runs)}>log runs</button>
+<button onclick={() => queued.shift()?.()}>resolve</button>
+
+<div>
+	<p>{await push(a)}</p>
+	<p>{d}</p>
+	<p>{d}</p>
+</div>

packages/svelte/tests/runtime-runes/samples/async-derived-not-underfiring/_config.js

@@ -0,0 +1,28 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	skip: true, // TODO fix
+	async test({ assert, target, logs }) {
+		await tick();
+
+		const [a, b, resolve] = target.querySelectorAll('button');
+		const [p] = target.querySelectorAll('p');
+
+		assert.deepEqual(logs, ['b: 0, d: 0']);
+		logs.length = 0;
+
+		a.click();
+		await tick();
+		b.click();
+		await tick();
+		assert.htmlEqual(p.innerHTML, '0 1');
+		assert.deepEqual(logs, ['b: 1, d: 0']);
+		logs.length = 0;
+
+		resolve.click();
+		await tick();
+		assert.htmlEqual(p.innerHTML, '2 1');
+		assert.deepEqual(logs, ['b: 1, d: 2']);
+	}
+});

packages/svelte/tests/runtime-runes/samples/async-derived-not-underfiring/main.svelte

@@ -0,0 +1,22 @@
+<script>
+	let a = $state(0);
+	let b = $state(0);
+
+	let d = $derived(a * 2);
+
+	const queued = [];
+	function push(v) {
+		if (!v) return v;
+		return new Promise((resolve) => {
+			queued.push(() => resolve(v));
+		});
+	}
+
+	$effect(() => console.log(`b: ${b}, d: ${d}`));
+</script>
+
+<button onclick={() => a++}>a++</button>
+<button onclick={() => b++}>b++</button>
+<button onclick={() => queued.shift()?.()}>resolve</button>
+
+<p>{await push(d)} {b}</p>