mirror of https://github.com/sveltejs/svelte
parent
7d853cf27b
commit
eaf4d0d808
@ -0,0 +1,53 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target }) {
|
||||
const [override, release, resolve] = target.querySelectorAll('button');
|
||||
|
||||
resolve.click();
|
||||
await tick();
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>override</button>
|
||||
<button>release</button>
|
||||
<button>resolve</button>
|
||||
<p>before</p>
|
||||
<p>before</p>
|
||||
`
|
||||
);
|
||||
|
||||
override.click();
|
||||
await tick();
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>override</button>
|
||||
<button>release</button>
|
||||
<button>resolve</button>
|
||||
<p>during</p>
|
||||
<p>during</p>
|
||||
`
|
||||
);
|
||||
|
||||
release.click();
|
||||
await tick();
|
||||
|
||||
resolve.click();
|
||||
await tick();
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>override</button>
|
||||
<button>release</button>
|
||||
<button>resolve</button>
|
||||
<p>after</p>
|
||||
<p>after</p>
|
||||
`
|
||||
);
|
||||
}
|
||||
});
|
@ -0,0 +1,45 @@
|
||||
<script lang=ts>
|
||||
let deferred = Promise.withResolvers();
|
||||
let value = $state();
|
||||
let override = $state();
|
||||
let current = $derived(override ?? value);
|
||||
let promise = $state(update(['before']));
|
||||
|
||||
async function update (v) {
|
||||
deferred = Promise.withResolvers();
|
||||
await deferred.promise;
|
||||
value = v;
|
||||
};
|
||||
|
||||
function indirect() {
|
||||
override;
|
||||
return promise.then(() => current);
|
||||
}
|
||||
</script>
|
||||
|
||||
<button onclick={() => {
|
||||
override = ['during'];
|
||||
}}>override</button>
|
||||
|
||||
<button onclick={() => {
|
||||
override = null;
|
||||
promise = update(['after']);
|
||||
}}>release</button>
|
||||
|
||||
<button onclick={() => {
|
||||
deferred.resolve(null);
|
||||
}}>resolve</button>
|
||||
|
||||
<svelte:boundary>
|
||||
{#each await indirect() as entry}
|
||||
<p>{entry}</p>
|
||||
{/each}
|
||||
|
||||
{#each current as entry}
|
||||
<p>{entry}</p>
|
||||
{/each}
|
||||
|
||||
{#snippet pending()}
|
||||
<p>pending...</p>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
Loading…
Reference in new issue