mirror of https://github.com/sveltejs/svelte
parent
68e2eee3b1
commit
5a05dc54f1
@ -0,0 +1,54 @@
|
||||
import { flushSync, tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target }) {
|
||||
const [a, b, c, ok] = target.querySelectorAll('button');
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<h1>b</h1>
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>c</button>
|
||||
<button>ok</button>
|
||||
<p>pending...</p>
|
||||
`
|
||||
);
|
||||
|
||||
await Promise.resolve();
|
||||
await Promise.resolve();
|
||||
await Promise.resolve();
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<h1>c</h1>
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>c</button>
|
||||
<button>ok</button>
|
||||
<p>c</p>
|
||||
`
|
||||
);
|
||||
|
||||
flushSync(() => ok.click());
|
||||
|
||||
flushSync(() => b.click());
|
||||
await Promise.resolve();
|
||||
await Promise.resolve();
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<h1>b</h1>
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>c</button>
|
||||
<button>ok</button>
|
||||
<p>b</p>
|
||||
`
|
||||
);
|
||||
}
|
||||
});
|
@ -0,0 +1,43 @@
|
||||
<script lang=ts>
|
||||
let route = $state('b');
|
||||
let ok = $state(false);
|
||||
|
||||
function goto(r) {
|
||||
return Promise.resolve().then(() => {
|
||||
route = r;
|
||||
throw new Error('nope');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<h1>{route}</h1>
|
||||
<button onclick={() => route = 'a'}>a</button>
|
||||
<button onclick={() => route = 'b'}>b</button>
|
||||
<button onclick={() => route = 'c'}>c</button>
|
||||
<button onclick={() => ok = true}>ok</button>
|
||||
|
||||
<svelte:boundary>
|
||||
{#if route === 'a'}
|
||||
<p>a</p>
|
||||
{/if}
|
||||
|
||||
{#if route === 'b'}
|
||||
{#if ok}
|
||||
<p>b</p>
|
||||
{:else}
|
||||
{await goto('c')}
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
{#if route === 'c'}
|
||||
<p>c</p>
|
||||
{/if}
|
||||
|
||||
{#snippet pending()}
|
||||
<p>pending...</p>
|
||||
{/snippet}
|
||||
|
||||
{#snippet failed(error, reset)}
|
||||
<button onclick={reset}>retry</button>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
Loading…
Reference in new issue