mirror of https://github.com/sveltejs/svelte
parent
b5df097f7b
commit
952ea25ed1
@ -0,0 +1,41 @@
|
||||
import { flushSync, tick } from 'svelte';
|
||||
import { deferred } from '../../../../src/internal/shared/utils.js';
|
||||
import { test } from '../../test';
|
||||
|
||||
/** @type {Array<ReturnType<typeof deferred>>} */
|
||||
let items = [];
|
||||
|
||||
export default test({
|
||||
html: `<p>pending</p>`,
|
||||
|
||||
get props() {
|
||||
items = [deferred(), deferred(), deferred()];
|
||||
|
||||
return {
|
||||
items
|
||||
};
|
||||
},
|
||||
|
||||
async test({ assert, target, component }) {
|
||||
items[0].resolve('a');
|
||||
items[1].resolve('b');
|
||||
items[2].resolve('c');
|
||||
await Promise.resolve();
|
||||
await Promise.resolve();
|
||||
await tick();
|
||||
flushSync();
|
||||
assert.htmlEqual(target.innerHTML, '<p>a</p><p>b</p><p>c</p>');
|
||||
|
||||
items = [deferred(), deferred(), deferred(), deferred()];
|
||||
component.items = items;
|
||||
await tick();
|
||||
assert.htmlEqual(target.innerHTML, '<p>a</p><p>b</p><p>c</p>');
|
||||
|
||||
items[0].resolve('b');
|
||||
items[1].resolve('c');
|
||||
items[2].resolve('d');
|
||||
items[3].resolve('e');
|
||||
await tick();
|
||||
assert.htmlEqual(target.innerHTML, '<p>b</p><p>c</p><p>d</p><p>e</p>');
|
||||
}
|
||||
});
|
@ -0,0 +1,13 @@
|
||||
<script>
|
||||
let { items } = $props();
|
||||
</script>
|
||||
|
||||
<svelte:boundary>
|
||||
{#each items as deferred}
|
||||
<p>{await deferred.promise}</p>
|
||||
{/each}
|
||||
|
||||
{#snippet pending()}
|
||||
<p>pending</p>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
Loading…
Reference in new issue