preserve `$:` label in reactive blocks in SSR mode (#2828) (#3469)

CHANGELOG.md

@@ -4,6 +4,7 @@
 
 * Fix `{#each}` context not shadowing outer scope when using `bind:` ([#1565](https://github.com/sveltejs/svelte/issues/1565))
 * Fix edge cases in matching selectors against elements ([#1710](https://github.com/sveltejs/svelte/issues/1710))
+* Allow exiting a reactive block early with `break $` ([#2828](https://github.com/sveltejs/svelte/issues/2828))
 * Check attributes have changed before setting them to avoid image flicker ([#3579](https://github.com/sveltejs/svelte/pull/3579))
 * Fix generating malformed code for `{@debug}` tags with no dependencies ([#3588](https://github.com/sveltejs/svelte/issue/3588))
 * Use safer `HTMLElement` check before extending class ([#3608](https://github.com/sveltejs/svelte/issue/3608))

src/compiler/compile/render_ssr/index.ts

@@ -98,6 +98,8 @@ export default function ssr(
 					: b`
 						let ${left} = ${right}`;
 			}
+		} else { // TODO do not add label if it's not referenced
+			statement = b`$: { ${statement} }`;
 		}
 
 		return statement;

test/runtime/samples/reactive-block-break/_config.js

@@ -0,0 +1,3 @@
+export default {
+	html: `<h1>1 2</h1>`
+};

test/runtime/samples/reactive-block-break/main.svelte

@@ -0,0 +1,14 @@
+<script>
+	let foo = 0;
+	let bar;
+	$: {
+		bar = foo + 1;
+		if (foo) {
+			break $;
+		}
+		bar = foo + 2;
+	}
+	foo = 1;
+</script>
+
+<h1>{foo} {bar}</h1>