fix: hydrate if blocks correctly (#17784)

We were not using the correct node to analyze the if block marker

Fixes #17751

.changeset/long-readers-shine.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: hydrate if blocks correctly

packages/svelte/src/internal/client/dom/blocks/if.js

@@ -6,7 +6,8 @@ import {
 	read_hydration_instruction,
 	skip_nodes,
 	set_hydrate_node,
-	set_hydrating
+	set_hydrating,
+	hydrate_node
 } from '../hydration.js';
 import { block } from '../../reactivity/effects.js';
 import { BranchManager } from './branches.js';
@@ -19,7 +20,10 @@ import { HYDRATION_START, HYDRATION_START_ELSE } from '../../../../constants.js'
  * @returns {void}
  */
 export function if_block(node, fn, elseif = false) {
+	/** @type {TemplateNode | undefined} */
+	var marker;
 	if (hydrating) {
+		marker = hydrate_node;
 		hydrate_next();
 	}
 
@@ -32,8 +36,7 @@ export function if_block(node, fn, elseif = false) {
 	 */
 	function update_branch(key, fn) {
 		if (hydrating) {
-			const data = read_hydration_instruction(node);
+			var data = read_hydration_instruction(/** @type {TemplateNode} */ (marker));
-
 			/**
 			 * @type {number | false}
 			 * "[" = branch 0, "[1" = branch 1, "[2" = branch 2, ..., "[!" = else (false)

packages/svelte/tests/runtime-runes/samples/async-if-else/_config.js

@@ -0,0 +1,17 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	mode: ['hydrate'],
+
+	async test({ assert, target }) {
+		const e = target.querySelector('#else-branch');
+
+		assert.equal(e?.isConnected, true);
+
+		await tick();
+
+		assert.equal(e?.isConnected, true);
+		assert.htmlEqual(target.innerHTML, '<p id="else-branch">else branch</p>');
+	}
+});

packages/svelte/tests/runtime-runes/samples/async-if-else/main.svelte

@@ -0,0 +1,5 @@
+{#if await false}
+	<p id="if-branch">if branch</p>
+{:else}
+	<p id="else-branch">{await 'else branch'}</p>
+{/if}