fix: don't execute scripts inside `@html` when instantiated on the client (#10556)

In Svelte 4, scripts inside `@html` were not executed when it was created client-side. This is because `innerHTML = ..` which was used under the hood does not execute scripts due to security reasons. This adjusts the code so the same is true for Svelte 5.
pull/10558/head
Simon H 9 months ago committed by GitHub
parent b80d9bd654
commit 08978bfae8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -0,0 +1,5 @@
---
"svelte": patch
---
fix: don't execute scripts inside `@html` when instantiated on the client

@ -103,7 +103,9 @@ export function reconcile_html(target, value, svg) {
if (svg) { if (svg) {
html = `<svg>${html}</svg>`; html = `<svg>${html}</svg>`;
} }
var content = create_fragment_with_script_from_html(html); // Don't use create_fragment_with_script_from_html here because that would mean script tags are executed.
// @html is basically `.innerHTML = ...` and that doesn't execute scripts either due to security reasons.
var content = create_fragment_from_html(html);
if (svg) { if (svg) {
content = /** @type {DocumentFragment} */ (/** @type {unknown} */ (content.firstChild)); content = /** @type {DocumentFragment} */ (/** @type {unknown} */ (content.firstChild));
} }

@ -0,0 +1,9 @@
import { test } from '../../assert';
export default test({
// Test that @html does not execute scripts when instantiated in the client.
// Needs to be in this test suite because JSDOM does not quite get this right.
html: `<div></div><script>document.body.innerHTML = 'this should not be executed'</script>`,
skip_if_ssr: 'permanent',
skip_if_hydrate: 'permanent'
});

@ -0,0 +1,2 @@
<div></div>
{@html `<script>document.body.innerHTML = 'this should not be executed'</script>`}
Loading…
Cancel
Save