File tree Expand file tree Collapse file tree 2 files changed +82
-0
lines changed
packages/svelte/tests/runtime-runes/samples/async-state-eager-if Expand file tree Collapse file tree 2 files changed +82
-0
lines changed Original file line number Diff line number Diff line change 1+ import { tick } from 'svelte' ;
2+ import { test } from '../../test' ;
3+
4+ export default test ( {
5+ mode : [ 'client' ] ,
6+
7+ compileOptions : {
8+ dev : true
9+ } ,
10+
11+ async test ( { assert, target } ) {
12+ const [ count , shift ] = target . querySelectorAll ( 'button' ) ;
13+
14+ shift . click ( ) ;
15+ await tick ( ) ;
16+ assert . htmlEqual ( target . innerHTML , `<button>0</button><button>shift</button><p>0</p>` ) ;
17+
18+ count . click ( ) ;
19+ await tick ( ) ;
20+ assert . htmlEqual (
21+ target . innerHTML ,
22+ `<button>1</button><button>shift</button><p>0</p><p>updating</p>`
23+ ) ;
24+
25+ count . click ( ) ;
26+ await tick ( ) ;
27+ assert . htmlEqual (
28+ target . innerHTML ,
29+ `<button>2</button><button>shift</button><p>0</p><p>updating</p>`
30+ ) ;
31+
32+ count . click ( ) ;
33+ await tick ( ) ;
34+ assert . htmlEqual (
35+ target . innerHTML ,
36+ `<button>3</button><button>shift</button><p>0</p><p>updating</p>`
37+ ) ;
38+
39+ shift . click ( ) ;
40+ await tick ( ) ;
41+ assert . htmlEqual (
42+ target . innerHTML ,
43+ `<button>3</button><button>shift</button><p>1</p><p>updating</p>`
44+ ) ;
45+
46+ shift . click ( ) ;
47+ await tick ( ) ;
48+ assert . htmlEqual (
49+ target . innerHTML ,
50+ `<button>3</button><button>shift</button><p>2</p><p>updating</p>`
51+ ) ;
52+
53+ shift . click ( ) ;
54+ await tick ( ) ;
55+ assert . htmlEqual ( target . innerHTML , `<button>3</button><button>shift</button><p>3</p>` ) ;
56+ }
57+ } ) ;
Original file line number Diff line number Diff line change 1+ <script >
2+ let count = $state (0 );
3+ let eager = $derived ($state .eager (count));
4+
5+ let resolvers = [];
6+
7+ function push (value ) {
8+ const { promise , resolve } = Promise .withResolvers ();
9+ resolvers .push (() => resolve (value));
10+ return promise;
11+ }
12+ </script >
13+
14+ <button onclick ={() => count += 1 }>{eager }</button >
15+ <button onclick ={() => resolvers .shift ()?.()}>shift</button >
16+
17+ <svelte:boundary >
18+ <p >{await push (count )}</p >
19+
20+ {#if count !== eager }
21+ <p >updating</p >
22+ {/if }
23+
24+ {#snippet pending ()}{/ snippet }
25+ </svelte:boundary >
You can’t perform that action at this time.
0 commit comments