mirror of https://github.com/sveltejs/svelte
parent
408d51b362
commit
9fd77d22a5
@ -0,0 +1,41 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
const buttons = `
|
||||
<button>fork</button>
|
||||
<button>resolve</button>
|
||||
<button>commit</button>
|
||||
`;
|
||||
|
||||
export default test({
|
||||
async test({ assert, target, logs }) {
|
||||
await tick();
|
||||
const [fork_button, resolve, commit] = target.querySelectorAll('button');
|
||||
|
||||
assert.deepEqual(logs, [[0, true]]);
|
||||
assert.htmlEqual(target.innerHTML, `${buttons}<p>0</p>`);
|
||||
|
||||
fork_button.click();
|
||||
|
||||
await tick();
|
||||
assert.deepEqual(logs, [
|
||||
[0, true],
|
||||
[2, true]
|
||||
]);
|
||||
assert.htmlEqual(target.innerHTML, `${buttons}<p>0</p>`);
|
||||
|
||||
// `delayed` changes, but `nonnegative` stays true. The async expression has
|
||||
// already consumed the fork's `doubled`, so it should not run again.
|
||||
resolve.click();
|
||||
await tick();
|
||||
assert.deepEqual(logs, [
|
||||
[0, true],
|
||||
[2, true]
|
||||
]);
|
||||
assert.htmlEqual(target.innerHTML, `${buttons}<p>0</p>`);
|
||||
|
||||
commit.click();
|
||||
await tick();
|
||||
assert.htmlEqual(target.innerHTML, `${buttons}<p>2</p>`);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,27 @@
|
||||
<script>
|
||||
import { fork } from 'svelte';
|
||||
|
||||
const resolvers = [];
|
||||
let f;
|
||||
|
||||
let count = $state(0);
|
||||
let doubled = $derived(count * 2);
|
||||
let delayed = $derived(await delay(count));
|
||||
let nonnegative = $derived(delayed >= 0);
|
||||
|
||||
function delay(value) {
|
||||
if (value === 0) return value;
|
||||
return new Promise((resolve) => resolvers.push(() => resolve(value)));
|
||||
}
|
||||
|
||||
function load(value, nonnegative) {
|
||||
console.log([value, nonnegative]);
|
||||
return value;
|
||||
}
|
||||
</script>
|
||||
|
||||
<button onclick={() => (f = fork(() => count++))}>fork</button>
|
||||
<button onclick={() => resolvers.shift()?.()}>resolve</button>
|
||||
<button onclick={() => f?.commit()}>commit</button>
|
||||
|
||||
<p>{await load(doubled, nonnegative)}</p>
|
||||
Loading…
Reference in new issue