state-eager-derived-block
Rich Harris 2 days ago
parent 69876684d0
commit de994491db

@ -0,0 +1,42 @@
import { tick } from 'svelte';
import { test } from '../../test';
export default test({
mode: ['client'],
compileOptions: {
dev: true
},
async test({ assert, target }) {
const [count, shift] = target.querySelectorAll('button');
shift.click();
await tick();
assert.htmlEqual(target.innerHTML, `<button>0</button><button>shift</button><p>0</p>`);
count.click();
await tick();
assert.htmlEqual(target.innerHTML, `<button>1</button><button>shift</button><p>0</p>`);
count.click();
await tick();
assert.htmlEqual(target.innerHTML, `<button>2</button><button>shift</button><p>0</p>`);
count.click();
await tick();
assert.htmlEqual(target.innerHTML, `<button>3</button><button>shift</button><p>0</p>`);
shift.click();
await tick();
assert.htmlEqual(target.innerHTML, `<button>3</button><button>shift</button><p>1</p>`);
shift.click();
await tick();
assert.htmlEqual(target.innerHTML, `<button>3</button><button>shift</button><p>2</p>`);
shift.click();
await tick();
assert.htmlEqual(target.innerHTML, `<button>3</button><button>shift</button><p>3</p>`);
}
});

@ -0,0 +1,20 @@
<script>
let count = $state(0);
let resolvers = [];
function push(value) {
const { promise, resolve } = Promise.withResolvers();
resolvers.push(() => resolve(value));
return promise;
}
</script>
<button onclick={() => count += 1}>{$state.eager(count)}</button>
<button onclick={() => resolvers.shift()?.()}>shift</button>
<svelte:boundary>
<p>{await push(count)}</p>
{#snippet pending()}{/snippet}
</svelte:boundary>
Loading…
Cancel
Save