Skip to content

Commit a9e7827

Browse files
committed
fix: wrap each block expression in derived to encapsulte effects
1 parent dc8ae82 commit a9e7827

File tree

2 files changed

+16
-8
lines changed

2 files changed

+16
-8
lines changed

.changeset/tender-apples-scream.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'svelte': patch
3+
---
4+
5+
fix: wrap each block expression in derived to encapsulte effects

packages/svelte/src/internal/client/dom/blocks/each.js

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,9 @@ import { source, mutable_source, internal_set } from '../../reactivity/sources.j
3535
import { array_from, is_array } from '../../../shared/utils.js';
3636
import { INERT } from '../../constants.js';
3737
import { queue_micro_task } from '../task.js';
38-
import { active_effect, active_reaction } from '../../runtime.js';
38+
import { active_effect, active_reaction, get } from '../../runtime.js';
3939
import { DEV } from 'esm-env';
40+
import { derived_safe_equal } from '../../reactivity/deriveds.js';
4041

4142
/**
4243
* The row of a keyed each block that is currently updating. We track this
@@ -135,15 +136,17 @@ export function each(node, flags, get_collection, get_key, render_fn, fallback_f
135136

136137
var was_empty = false;
137138

138-
block(() => {
139+
// TODO: ideally we could use derived for runes mode but because of the ability
140+
// to use a store which can be mutated, we can't do that here as mutating a store
141+
// will still result in the collection array being the same from the store
142+
var each_array = derived_safe_equal(() => {
139143
var collection = get_collection();
140144

141-
var array = is_array(collection)
142-
? collection
143-
: collection == null
144-
? []
145-
: array_from(collection);
145+
return is_array(collection) ? collection : collection == null ? [] : array_from(collection);
146+
});
146147

148+
block(() => {
149+
var array = get(each_array);
147150
var length = array.length;
148151

149152
if (was_empty && length === 0) {
@@ -254,7 +257,7 @@ export function each(node, flags, get_collection, get_key, render_fn, fallback_f
254257
// that a mutation occurred and it's made the collection MAYBE_DIRTY, so reading the
255258
// collection again can provide consistency to the reactive graph again as the deriveds
256259
// will now be `CLEAN`.
257-
get_collection();
260+
get(each_array);
258261
});
259262

260263
if (hydrating) {

0 commit comments

Comments
 (0)