fix

.changeset/fifty-llamas-know.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: simplify `<pre>` cleaning

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

@@ -1,7 +1,7 @@
 /** @import { TemplateOperation } from '../types.js' */
 /** @import { ObjectExpression, Identifier, ArrayExpression, Property, Expression, Literal } from 'estree' */
 import * as b from '../../../../utils/builders.js';
-import { regex_is_valid_identifier } from '../../../patterns.js';
+import { regex_is_valid_identifier, regex_starts_with_newline } from '../../../patterns.js';
 import fix_attribute_casing from './fix-attribute-casing.js';
 
 /**
@@ -127,6 +127,18 @@ function create_anchor(element, data = '') {
  */
 function create_text(element, value) {
 	if (!element) return b.literal(value);
+
+	// TODO this is temporary, but i want the tests to keep passing in the meantime
+	// @ts-expect-error
+	const name = element?.properties[0].value.value;
+
+	if ((name === 'pre' || name === 'textarea') && regex_starts_with_newline.test(value)) {
+		// @ts-expect-error
+		if (!element.properties.find((prop) => prop.key.name === 'c')) {
+			value = value.replace(regex_starts_with_newline, '');
+		}
+	}
+
 	const c = get_or_create_prop(element, 'c', b.array([]));
 	/** @type {ArrayExpression} */ (c.value).elements.push(b.literal(value));
 }

packages/svelte/src/compiler/phases/3-transform/utils.js

@@ -273,27 +273,12 @@ export function clean_nodes(
 
 	var first = trimmed[0];
 
-	// initial newline inside a `<pre>` is disregarded, if not followed by another newline
+	// if first text node inside a <pre> is a single newline, discard it, because otherwise
-	if (
+	// the browser will do it for us which could break hydration
-		parent.type === 'RegularElement' &&
+	if (parent.type === 'RegularElement' && parent.name === 'pre' && first?.type === 'Text') {
-		// we also want to do the replacement on the textarea if we are in functional template mode because createTextNode behave differently
+		if (first.data === '\n' || first.data === '\r\n') {
-		// then template.innerHTML
+			trimmed.shift();
-		(parent.name === 'pre' || (is_functional_template_mode && parent.name === 'textarea')) &&
+			first = trimmed[0];
-		first?.type === 'Text'
-	) {
-		const text = first.data.replace(regex_starts_with_newline, '');
-		if (text !== first.data) {
-			const tmp = text.replace(regex_starts_with_newline, '');
-			// do an extra replacement if we are in functional template mode because createTextNode behave differently
-			// then template.innerHTML
-			if (text === tmp || is_functional_template_mode) {
-				first.data = text;
-				first.raw = first.raw.replace(regex_starts_with_newline, '');
-				if (first.data === '') {
-					trimmed.shift();
-					first = trimmed[0];
-				}
-			}
 		}
 	}