[fix] propagate bindings correctly

Fixes #8103 introduced through #7981 while keeping the referenced bug in that PR fixed.
This expands the "are the values equal"-check from just member expressions (bind:foo={member.expression}) to all occasions, because in loop scenarios the ctx object is temporarily lagging behind when doing the $$invalidate call.

Author: dummdidumm

src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts

@@ -373,17 +373,14 @@ export default class InlineComponentWrapper extends Wrapper {
 				}
 			`);
 
-			let invalidate_binding = b`
-				${lhs} = #value;
-				${renderer.invalidate(dependencies[0])};
+			// Always check for equality, don't wait for the dirty check in invalidate later
+			// as it may not be updated correctly yet in loop conditions.
+			const invalidate_binding = b`
+				if ($$self.$$.not_equal(${lhs}, #value)) {
+					${lhs} = #value;
+					${renderer.invalidate(dependencies[0])};
+				}
 			`;
-			if (binding.expression.node.type === 'MemberExpression') {
-				invalidate_binding = b`
-					if ($$self.$$.not_equal(${lhs}, #value)) {
-						${invalidate_binding}
-					}
-				`;
-			}
 
 			const body = b`
 				function ${id}(${params}) {
@@ -393,7 +390,7 @@ export default class InlineComponentWrapper extends Wrapper {
 
 			component.partly_hoisted.push(body);
 
-			return b`@binding_callbacks.push(() => @bind(${this.var}, '${binding.name}', ${id}, ${snippet}));`;
+			return b`@binding_callbacks.push(() => @bind(${this.var}, '${binding.name}', ${id}));`;
 		});
 
 		const munged_handlers = this.node.handlers.map(handler => {

src/runtime/internal/Component.ts

@@ -5,13 +5,11 @@ import { children, detach, start_hydrating, end_hydrating } from './dom';
 import { transition_in } from './transitions';
 import { T$$ } from './types';
 
-export function bind(component, name, callback, value) {
+export function bind(component, name, callback) {
 	const index = component.$$.props[name];
 	if (index !== undefined) {
 		component.$$.bound[index] = callback;
-		if (value === undefined) {
-			callback(component.$$.ctx[index]);
-		}
+		callback(component.$$.ctx[index]);
 	}
 }
 

test/runtime/samples/binding-indirect-value/Component.svelte

@@ -0,0 +1,6 @@
+<script>
+	export let value;
+	value = "bar";
+</script>
+
+Child component "{value}"<br />

test/runtime/samples/binding-indirect-value/_config.js

@@ -0,0 +1,8 @@
+export default {
+	async test({ assert, target }) {
+		assert.htmlEqual(target.innerHTML, `
+		Parent component "bar"<br />
+		Child component "bar"<br />
+		`);
+	}
+};

test/runtime/samples/binding-indirect-value/main.svelte

@@ -0,0 +1,8 @@
+<script>
+	import Component from "./Component.svelte";
+
+	let value = "foo";
+</script>
+
+Parent component "{value}"<br />
+<Component bind:value />