fix: only escape characters in SSR template

Adjusts the escaping mechanism done for server compilation. For template literals it's now only applied when explicitly told, which is the case for generated literals from the html template. Fixes a bug where a template literal string inside the `@html` tag was wrongfully escaped (#10359 (comment))
sveltejs · Feb 20, 2024 · 8a5ea74 · 8a5ea74
1 parent b80d9bd
commit 8a5ea74
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 4 deletions.
diff --git a/.changeset/neat-boats-shake.md b/.changeset/neat-boats-shake.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: only escape characters in SSR template
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js b/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js
@@ -32,10 +32,11 @@ function t_string(value) {
 
 /**
  * @param {import('estree').Expression} value
+ * @param {boolean} [needs_escaping]
  * @returns {import('./types').TemplateExpression}
  */
-function t_expression(value) {
-	return { type: 'expression', value };
+function t_expression(value, needs_escaping = false) {
+	return { type: 'expression', value, needs_escaping };
 }
 
 /**
@@ -94,7 +95,8 @@ function serialize_template(template, out = b.id('out')) {
 			} else if (template_item.type === 'expression') {
 				const value = template_item.value;
 				if (value.type === 'TemplateLiteral') {
-					last.value.raw += sanitize_template_string(value.quasis[0].value.raw);
+					const raw = value.quasis[0].value.raw;
+					last.value.raw += template_item.needs_escaping ? sanitize_template_string(raw) : raw;
 					quasis.push(...value.quasis.slice(1));
 					expressions.push(...value.expressions);
 					continue;
@@ -198,7 +200,7 @@ function process_children(nodes, parent, { visit, state }) {
 			}
 		}
 
-		state.template.push(t_expression(b.template(quasis, expressions)));
+		state.template.push(t_expression(b.template(quasis, expressions), true));
 	}
 
 	for (let i = 0; i < nodes.length; i += 1) {

diff --git a/packages/svelte/src/compiler/phases/3-transform/server/types.d.ts b/packages/svelte/src/compiler/phases/3-transform/server/types.d.ts
@@ -12,6 +12,7 @@ import type { ComponentAnalysis } from '../../types.js';
 export type TemplateExpression = {
 	type: 'expression';
 	value: Expression;
+	needs_escaping: boolean;
 };
 
 export type TemplateString = {

diff --git a/packages/svelte/tests/runtime-runes/samples/html-tag-escaping/_config.js b/packages/svelte/tests/runtime-runes/samples/html-tag-escaping/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: `s s s \\u73`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/html-tag-escaping/main.svelte b/packages/svelte/tests/runtime-runes/samples/html-tag-escaping/main.svelte
@@ -0,0 +1,5 @@
+{@html `\u{73}`}
+{@html '\u{73}'}
+{@html "\u{73}"}
+
+\u{73}