handle `<template>` edge case at compile time

packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js

@@ -2178,22 +2178,30 @@ export const template_visitors = {
 			context.visit(node, child_state);
 		}
 
-		process_children(
-			trimmed,
-			() =>
-				b.call(
-					'$.child',
-					node.name === 'template'
-						? b.member(context.state.node, b.id('content'))
-						: context.state.node
-				),
-			true,
-			{ ...context, state: child_state }
-		);
+		/** @type {import('estree').Expression} */
+		let arg = context.state.node;
+
+		// If `hydrate_node` is set inside the element, we need to reset it
+		// after the element has been hydrated
+		let needs_reset = trimmed.some((node) => node.type !== 'Text');
+
+		// The same applies if it's a `<template>` element, since we need to
+		// set the value of `hydrate_node` to `node.content`
+		if (node.name === 'template') {
+			needs_reset = true;
+
+			arg = b.member(arg, b.id('content'));
+			child_state.init.push(b.stmt(b.call('$.reset', arg)));
+		}
+
+		process_children(trimmed, () => b.call('$.child', arg), true, {
+			...context,
+			state: child_state
+		});
 
 		// If `hydrate_node` is set inside the element, we need to reset it
 		// after the element has been hydrated
-		if (trimmed.some((node) => node.type !== 'Text')) {
+		if (needs_reset) {
 			child_state.init.push(b.stmt(b.call('$.reset', context.state.node)));
 		}
 

packages/svelte/src/internal/client/dom/operations.js

@@ -62,12 +62,7 @@ export function child(node) {
 		return node.firstChild;
 	}
 
-	// TODO is there anything we can do in compiler land to optimize the `<template>` edge case?
-	var child = /** @type {TemplateNode} */ (
-		hydrate_node.nodeName === 'TEMPLATE'
-			? /** @type {HTMLTemplateElement} */ (hydrate_node).content.firstChild
-			: hydrate_node.firstChild
-	);
+	var child = /** @type {TemplateNode} */ (hydrate_node.firstChild);
 
 	// Child can be null if we have an element with a single child, like `<p>{text}</p>`, where `text` is empty
 	if (child === null) {