fix nested block not reactive (sveltejs#4294)

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Svelte changelog
 
+## Unreleased
+
+* Fix updating a `<slot>` inside an `{#if}` or other block ([#4292](https://github.com/sveltejs/svelte/issues/4292))
+
 ## 3.17.2
 
 * Fix removing attributes during hydration ([#1733](https://github.com/sveltejs/svelte/issues/1733))

src/compiler/compile/render_dom/Block.ts

@@ -160,6 +160,9 @@ export default class Block {
 		});
 
 		this.has_update_method = true;
+		if (this.parent) {
+			this.parent.add_dependencies(dependencies);
+		}
 	}
 
 	add_element(

test/runtime/samples/component-slot-nested-if/Display.svelte

@@ -0,0 +1,2 @@
+Display:
+<slot></slot>

test/runtime/samples/component-slot-nested-if/Input.svelte

@@ -0,0 +1,6 @@
+<script>
+	let val;
+</script>
+
+<input bind:value={val} />
+<slot {val}></slot>

test/runtime/samples/component-slot-nested-if/_config.js

@@ -0,0 +1,30 @@
+export default {
+	html: `
+    <input>
+	`,
+	async test({ assert, target, snapshot, component, window }) {
+		const input = target.querySelector('input');
+
+		input.value = 'a';
+		await input.dispatchEvent(new window.Event('input'));
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+			<input>
+			Display: a
+		`
+		);
+
+		input.value = 'abc';
+		await input.dispatchEvent(new window.Event('input'));
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+			<input>
+			Display: abc
+		`
+		);
+	},
+};

test/runtime/samples/component-slot-nested-if/main.svelte

@@ -0,0 +1,10 @@
+<script>
+	import Input from "./Input.svelte";
+	import Display from "./Display.svelte";
+</script>
+
+<Input let:val={foo}>
+	{#if foo}
+		<Display>{foo}</Display>
+	{/if}
+</Input>