fix: adjust keyed each block equality handling (#10699)

Fixes #10685
pull/10702/head
Dominic Gannaway 10 months ago committed by GitHub
parent 86f326531c
commit eedb59355f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -0,0 +1,5 @@
---
"svelte": patch
---
fix: adjust keyed each block equality handling

@ -20,8 +20,8 @@ import { current_block, destroy_signal, execute_effect, push_destroy_fn } from '
import { render_effect } from '../../reactivity/effects.js'; import { render_effect } from '../../reactivity/effects.js';
import { source, mutable_source, set } from '../../reactivity/sources.js'; import { source, mutable_source, set } from '../../reactivity/sources.js';
import { trigger_transitions } from '../../transitions.js'; import { trigger_transitions } from '../../transitions.js';
import { is_array } from '../../utils.js'; import { is_array, is_frozen } from '../../utils.js';
import { EACH_BLOCK, EACH_ITEM_BLOCK } from '../../constants.js'; import { EACH_BLOCK, EACH_ITEM_BLOCK, STATE_SYMBOL } from '../../constants.js';
const NEW_BLOCK = -1; const NEW_BLOCK = -1;
const MOVED_BLOCK = 99999999; const MOVED_BLOCK = 99999999;
@ -449,6 +449,10 @@ function reconcile_tracked_array(
apply_transitions, apply_transitions,
keys keys
) { ) {
// If we are working with an array that isn't proxied or frozen, then remove strict equality.
if ((flags & EACH_IS_STRICT_EQUALS) !== 0 && !is_frozen(array) && !(STATE_SYMBOL in array)) {
flags ^= EACH_IS_STRICT_EQUALS;
}
var a_blocks = each_block.v; var a_blocks = each_block.v;
const is_computed_key = keys !== null; const is_computed_key = keys !== null;
var active_transitions = each_block.s; var active_transitions = each_block.s;

@ -0,0 +1,21 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
html: `100\n<button>Update</button>`,
async test({ assert, target }) {
/**
* @type {{ click: () => void; }}
*/
let btn1;
[btn1] = target.querySelectorAll('button');
flushSync(() => {
btn1.click();
});
assert.htmlEqual(target.innerHTML, `1000\n<button>Update</button>`);
}
});

@ -0,0 +1,13 @@
<script>
import { writable } from "svelte/store";
const roomState = writable({
users: {"gary": { name: "gary", value: 100 }},
});
</script>
{#each Object.values($roomState.users) as user (user.name)}
{user.value}
{/each}
<button onclick={() => $roomState.users["gary"].value = 1000}>Update</button>
Loading…
Cancel
Save