File tree Expand file tree Collapse file tree 2 files changed +50
-0
lines changed
packages/svelte/tests/runtime-runes/samples/array-push-in-effect Expand file tree Collapse file tree 2 files changed +50
-0
lines changed Original file line number Diff line number Diff line change 1+ import { flushSync } from 'svelte' ;
2+ import { test } from '../../test' ;
3+
4+ export default test ( {
5+ /**
6+ * Ensure that mutating an array with push inside an $effect
7+ * does not cause an infinite re-execution loop.
8+ */
9+ test ( { assert, target } ) {
10+ const button = target . querySelector ( 'button' ) ;
11+
12+ // initial render — effect should have run once
13+ assert . htmlEqual (
14+ target . innerHTML ,
15+ `
16+ <button>inc</button>
17+ <p>0</p>
18+ `
19+ ) ;
20+
21+ // increment count; effect should append one new entry only
22+ flushSync ( ( ) => button ?. click ( ) ) ;
23+
24+ assert . htmlEqual (
25+ target . innerHTML ,
26+ `
27+ <button>inc</button>
28+ <p>0</p>
29+ <p>1</p>
30+ `
31+ ) ;
32+ }
33+ } ) ;
Original file line number Diff line number Diff line change 1+ <script >
2+ let count = $state (0 );
3+ let log = $state ([]);
4+
5+ $effect (() => {
6+ log .push (count);
7+ });
8+
9+ function inc () {
10+ count += 1 ;
11+ }
12+ </script >
13+
14+ <button on:click ={inc }>inc</button >
15+ {#each log as item }
16+ <p >{item }</p >
17+ {/each }
You can’t perform that action at this time.
0 commit comments