fixes shadow hydration escaping

.changeset/late-foxes-clean.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fixes shadow hydration escaping

packages/kit/src/runtime/server/page/render.js

@@ -2,7 +2,7 @@ import devalue from 'devalue';
 import { readable, writable } from 'svelte/store';
 import { coalesce_to_error } from '../../../utils/error.js';
 import { hash } from '../../hash.js';
-import { escape_html_attr } from '../../../utils/escape.js';
+import { escape_html_attr, escape_json_in_html } from '../../../utils/escape.js';
 import { s } from '../../../utils/misc.js';
 import { create_prerendering_url_proxy } from './utils.js';
 import { Csp, csp_ready } from './csp.js';
@@ -261,7 +261,7 @@ export async function render_response({
 
 			if (shadow_props) {
 				// prettier-ignore
-				body += `<script type="application/json" data-type="svelte-props">${s(shadow_props)}</script>`;
+				body += `<script type="application/json" data-type="svelte-props">${escape_json_in_html(s(shadow_props))}</script>`;
 			}
 		}
 

packages/kit/src/utils/escape.js

@@ -1,6 +1,5 @@
 /** @type {Record<string, string>} */
-const escape_json_string_in_html_dict = {
-	'"': '\\"',
+const escape_json_in_html_dict = {
 	'<': '\\u003C',
 	'>': '\\u003E',
 	'/': '\\u002F',
@@ -15,7 +14,38 @@ const escape_json_string_in_html_dict = {
 	'\u2029': '\\u2029'
 };
 
-/** @param {string} str */
+/** @type {Record<string, string>} */
+const escape_json_string_in_html_dict = {
+	'"': '\\"',
+	...escape_json_in_html_dict
+};
+
+/**
+ * escape a json string to be embedded into a script data tag
+ *
+ * <script>
+ *   output here
+ * </script>
+ * @param {string} str
+ */
+export function escape_json_in_html(str) {
+	return escape(
+		str,
+		escape_json_in_html_dict,
+		(code) => `\\u${code.toString(16).toUpperCase()}`
+	);
+}
+
+/**
+ * escape a json string to be embedded into a larger json object thats going to be embedded in html
+ *
+ * <script>
+ *   {
+ *     "foo":"output here"
+ *   }
+ * </script>
+ * @param {string} str
+ */
 export function escape_json_string_in_html(str) {
 	return escape(
 		str,

packages/kit/test/apps/basics/src/routes/xss/shadow.js

@@ -0,0 +1,8 @@
+/** @type {import('@sveltejs/kit').RequestHandler} */
+export function get() {
+	return {
+		body: {
+			pwned: '</script><script>window.pwned = 1</script>'
+		}
+	};
+}

packages/kit/test/apps/basics/src/routes/xss/shadow.svelte

@@ -0,0 +1,5 @@
+<script>
+	export let pwned;
+</script>
+<h1>failed script inject is: {pwned}</h1>
+

packages/kit/test/apps/basics/test/test.js

@@ -1992,4 +1992,14 @@ test.describe.parallel('XSS', () => {
 		// @ts-expect-error - check global injected variable
 		expect(await page.evaluate(() => window.pwned)).toBeUndefined();
 	});
+
+	test('no xss via shadow endpoint', async ({ page }) => {
+		await page.goto('/xss/shadow')
+
+		// @ts-expect-error - check global injected variable
+		expect(await page.evaluate(() => window.pwned)).toBeUndefined();
+		expect(await page.textContent('h1')).toBe(
+			'failed script inject is: </script><script>window.pwned = 1</script>'
+		);
+	});
 });