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