diff --git a/.changeset/late-zebras-argue.md b/.changeset/late-zebras-argue.md new file mode 100644 index 000000000000..94a9940b2ea7 --- /dev/null +++ b/.changeset/late-zebras-argue.md @@ -0,0 +1,5 @@ +--- +"svelte": patch +--- + +fix: SSR template escaping 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 index 2d172b09bcdf..3d21d6972fe3 100644 --- a/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js +++ b/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js @@ -40,14 +40,9 @@ import { } from '../../../../internal/server/hydration.js'; import { filename, locator } from '../../../state.js'; -export const block_open = string(BLOCK_OPEN); -export const block_close = string(BLOCK_CLOSE); -export const block_anchor = string(BLOCK_ANCHOR); - -/** @param {string} value */ -function string(value) { - return b.literal(sanitize_template_string(value)); -} +export const block_open = b.literal(BLOCK_OPEN); +export const block_close = b.literal(BLOCK_CLOSE); +export const block_anchor = b.literal(BLOCK_ANCHOR); /** * @param {import('estree').Node} node @@ -93,7 +88,8 @@ function serialize_template(template, out = b.id('$$payload.out'), operator = '+ if (!last) quasis.push((last = b.quasi('', false))); if (node.type === 'Literal') { - last.value.raw += node.value; + last.value.raw += + typeof node.value === 'string' ? sanitize_template_string(node.value) : node.value; } else if (node.type === 'TemplateLiteral') { last.value.raw += node.quasis[0].value.raw; quasis.push(...node.quasis.slice(1)); @@ -1203,14 +1199,14 @@ const template_visitors = { throw new Error('Node should have been handled elsewhere'); }, RegularElement(node, context) { - context.state.template.push(string(`<${node.name}`)); + context.state.template.push(b.literal(`<${node.name}`)); const body = serialize_element_attributes(node, context); - context.state.template.push(string('>')); + context.state.template.push(b.literal('>')); if ((node.name === 'script' || node.name === 'style') && node.fragment.nodes.length === 1) { context.state.template.push( - string(/** @type {import('#compiler').Text} */ (node.fragment.nodes[0]).data), - string(`${node.name}>`) + b.literal(/** @type {import('#compiler').Text} */ (node.fragment.nodes[0]).data), + b.literal(`${node.name}>`) ); return; @@ -1285,7 +1281,7 @@ const template_visitors = { } if (!VoidElements.includes(node.name) && namespace !== 'foreign') { - state.template.push(string(`${node.name}>`)); + state.template.push(b.literal(`${node.name}>`)); } if (state.options.dev) { @@ -1524,9 +1520,9 @@ const template_visitors = { }, TitleElement(node, context) { // title is guaranteed to contain only text/expression tag children - const template = [string('
`${foo}\\n`
\n`${foo}\\n`
\n`\n`${foo}\n`
+{@html "`"}