propagate mutation change tracking upward through deps so that adjacent scopes generate proper update code - fixes #1985

src/compile/nodes/shared/TemplateScope.ts

@@ -1,6 +1,6 @@
 export default class TemplateScope {
 	names: Set<string>;
-	dependenciesForName: Map<string, string>;
+	dependenciesForName: Map<string, Set<string>>;
 	mutables: Set<string>;
 	parent?: TemplateScope;
 
@@ -11,7 +11,7 @@ export default class TemplateScope {
 		this.mutables = new Set();
 	}
 
-	add(name, dependencies) {
+	add(name, dependencies: Set<string>) {
 		this.names.add(name);
 		this.dependenciesForName.set(name, dependencies);
 		return this;
@@ -23,8 +23,10 @@ export default class TemplateScope {
 	}
 
 	setMutable(name: string) {
-		if (this.names.has(name)) this.mutables.add(name);
-		else if (this.parent) this.parent.setMutable(name);
+		if (this.names.has(name)) {
+			this.mutables.add(name);
+			if (this.parent && this.dependenciesForName.has(name)) this.dependenciesForName.get(name).forEach(dep => this.parent.setMutable(dep));
+		} else if (this.parent) this.parent.setMutable(name);
 		else this.mutables.add(name);
 	}
 

test/runtime/samples/mutation-tracking-across-sibling-scopes/_config.js

@@ -0,0 +1,12 @@
+export default {
+	async test({ assert, component, target }) {
+		assert.htmlEqual(component.div.innerHTML, '<div>+</div><div>-</div>');
+
+		const event = new window.Event('change');
+		const input = target.querySelector('input');
+		input.checked = false;
+		await input.dispatchEvent(event);
+
+		assert.htmlEqual(component.div.innerHTML, '<div>-</div><div>-</div>');
+	}
+};

test/runtime/samples/mutation-tracking-across-sibling-scopes/main.html

@@ -0,0 +1,18 @@
+{#each things as thing}
+	<div>
+		<input type=checkbox bind:checked={thing.ok} />
+	</div>
+{/each}
+
+<div bind:this={div}>
+	{#each things as other}
+		<div>
+			{other.ok ? '+' : '-'}
+		</div>
+	{/each}
+</div>
+
+<script>
+	const things = [{ ok: true }, { ok: false }];
+	export let div;
+</script>