fix: don't reset static elements with debug/snippets (#17477)

.changeset/little-aliens-pick.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't reset static elements with debug/snippets

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

@@ -21,7 +21,7 @@ import {
 	build_set_class,
 	build_set_style
 } from './shared/element.js';
-import { process_children } from './shared/fragment.js';
+import { process_children, is_static_element } from './shared/fragment.js';
 import { build_render_statement, build_template_chunk, Memoizer } from './shared/utils.js';
 import { visit_event_attribute } from './shared/events.js';
 
@@ -356,8 +356,9 @@ export function RegularElement(node, context) {
 		let arg = context.state.node;
 
 		// If `hydrate_node` is set inside the element, we need to reset it
-		// after the element has been hydrated
+		// after the element has been hydrated. We need to check if any child
-		let needs_reset = trimmed.some((node) => node.type !== 'Text');
+		// would actually advance the hydrate_node cursor - static elements don't.
+		let needs_reset = trimmed.some((node) => node.type !== 'Text' && !is_static_element(node));
 
 		// The same applies if it's a `<template>` element, since we need to
 		// set the value of `hydrate_node` to `node.content`

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

@@ -98,7 +98,7 @@ export function process_children(nodes, initial, is_element, context) {
 
 			let child_state = context.state;
 
-			if (is_static_element(node, context.state)) {
+			if (is_static_element(node)) {
 				skipped += 1;
 			} else if (
 				node.type === 'EachBlock' &&
@@ -137,9 +137,8 @@ export function process_children(nodes, initial, is_element, context) {
 
 /**
  * @param {AST.SvelteNode} node
- * @param {ComponentContext["state"]} state
  */
-function is_static_element(node, state) {
+export function is_static_element(node) {
 	if (node.type !== 'RegularElement') return false;
 	if (node.fragment.metadata.dynamic) return false;
 	if (is_custom_element_node(node)) return false; // we're setting all attributes on custom elements through properties

packages/svelte/tests/hydration/samples/no-reset-debug/_config.js

@@ -0,0 +1,3 @@
+import { test } from '../../test';
+
+export default test({});

packages/svelte/tests/hydration/samples/no-reset-debug/main.svelte

@@ -0,0 +1,8 @@
+<script>
+	let test = 42;
+</script>
+
+<div>
+	{@debug test}
+	<span>something</span>
+</div>

packages/svelte/tests/hydration/samples/no-reset-snippet/_config.js

@@ -0,0 +1,3 @@
+import { test } from '../../test';
+
+export default test({});

packages/svelte/tests/hydration/samples/no-reset-snippet/main.svelte

@@ -0,0 +1,6 @@
+<div>
+	{#snippet test()}
+		
+	{/snippet}
+	<span>something</span>
+</div>