mirror of https://github.com/sveltejs/svelte
parent
1fd17a2ec3
commit
201bf3704b
@ -1,16 +1,12 @@
|
|||||||
|
import { tick } from 'svelte';
|
||||||
import { test } from '../../test';
|
import { test } from '../../test';
|
||||||
|
|
||||||
export default test({
|
export default test({
|
||||||
html: `<h1>Loading...</h1>`,
|
html: `<h1>Loading...</h1>`,
|
||||||
|
|
||||||
async test({ assert, target }) {
|
async test({ assert, target }) {
|
||||||
await new Promise((resolve) => setTimeout(resolve, 100));
|
await tick();
|
||||||
assert.htmlEqual(
|
|
||||||
target.innerHTML,
|
assert.htmlEqual(target.innerHTML, `<h1>Hello, world!</h1>`);
|
||||||
`
|
|
||||||
<h1>Hello, world!</h1>
|
|
||||||
<input type="text"/>
|
|
||||||
`
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -1,23 +1,16 @@
|
|||||||
<script>
|
<script>
|
||||||
let name = $state('world');
|
let name = $state('world');
|
||||||
/**
|
|
||||||
* @template T
|
|
||||||
* @param {T} value
|
|
||||||
* @param {number} ms
|
|
||||||
* @returns {Promise<T>}
|
|
||||||
*/
|
|
||||||
function wait(value, ms) {
|
|
||||||
return new Promise(resolve => setTimeout(resolve, ms, value));
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<svelte:boundary>
|
<svelte:boundary>
|
||||||
{#snippet pending()}
|
{#snippet pending()}
|
||||||
<h1>Loading...</h1>
|
<h1>Loading...</h1>
|
||||||
{/snippet}
|
{/snippet}
|
||||||
|
|
||||||
{#snippet greet()}
|
{#snippet greet()}
|
||||||
{@const greeting = await wait(`Hello, ${name}!`, 50)}
|
{@const greeting = await `Hello, ${name}!`}
|
||||||
<h1>{greeting}</h1>
|
<h1>{greeting}</h1>
|
||||||
<input type="text" bind:value={name} />
|
|
||||||
{/snippet}
|
{/snippet}
|
||||||
|
|
||||||
{@render greet()}
|
{@render greet()}
|
||||||
</svelte:boundary>
|
</svelte:boundary>
|
||||||
|
Loading…
Reference in new issue