fix: do not warn for binding_property_non_reactive if binding is a store in an each

Author: paoloricciuti

.changeset/little-laws-sit.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: do not warn for `binding_property_non_reactive` if binding is a store in an each

packages/svelte/src/compiler/phases/3-transform/client/types.d.ts

@@ -45,6 +45,7 @@ export interface ComponentClientTransformState extends ClientTransformState {
 	readonly hoisted: Array<Statement | ModuleDeclaration>;
 	readonly events: Set<string>;
 	readonly is_instance: boolean;
+	readonly store_to_invalidate?: string;
 
 	/** Stuff that happens before the render effect(s) */
 	readonly init: Statement[];

packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js

@@ -143,7 +143,8 @@ export function EachBlock(node, context) {
 
 	const child_state = {
 		...context.state,
-		transform: { ...context.state.transform }
+		transform: { ...context.state.transform },
+		store_to_invalidate
 	};
 
 	/** The state used when generating the key function, if necessary */

packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js

@@ -309,12 +309,16 @@ export function validate_binding(state, binding, expression) {
 
 	const loc = locator(binding.start);
 
+	const obj = /** @type {Expression} */ (expression.object);
+
 	state.init.push(
 		b.stmt(
 			b.call(
 				'$.validate_binding',
 				b.literal(state.analysis.source.slice(binding.start, binding.end)),
-				b.thunk(/** @type {Expression} */ (expression.object)),
+				b.thunk(
+					state.store_to_invalidate ? b.sequence([b.call('$.mark_store_binding'), obj]) : obj
+				),
 				b.thunk(
 					/** @type {Expression} */ (
 						expression.computed

packages/svelte/tests/runtime-runes/samples/each-bind-store-no-warning/_config.js

@@ -0,0 +1,10 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+	async test({ assert, warnings }) {
+		assert.deepEqual(warnings, []);
+	}
+});

packages/svelte/tests/runtime-runes/samples/each-bind-store-no-warning/main.svelte

@@ -0,0 +1,10 @@
+<svelte:options runes />
+<script>
+	import { writable } from 'svelte/store';
+
+	const array = writable([{ name: "" }]);
+</script>
+
+{#each $array as item}
+	<div><input bind:value={item.name} /></div>
+{/each}