diff --git a/.changeset/nice-avocados-move.md b/.changeset/nice-avocados-move.md new file mode 100644 index 0000000000..49f6ed2169 --- /dev/null +++ b/.changeset/nice-avocados-move.md @@ -0,0 +1,5 @@ +--- +"svelte": patch +--- + +fix: improve ssr output of dynamic textarea elements diff --git a/packages/svelte/src/compiler/phases/2-analyze/validation.js b/packages/svelte/src/compiler/phases/2-analyze/validation.js index 67d45226f3..b43e5bea65 100644 --- a/packages/svelte/src/compiler/phases/2-analyze/validation.js +++ b/packages/svelte/src/compiler/phases/2-analyze/validation.js @@ -609,6 +609,22 @@ const validation = { error(arg, 'invalid-render-spread-argument'); } } + const is_inside_textarea = context.path.find((n) => { + return ( + n.type === 'SvelteElement' && + n.name === 'svelte:element' && + n.tag.type === 'Literal' && + n.tag.value === 'textarea' + ); + }); + if (is_inside_textarea) { + error( + node, + 'invalid-tag-placement', + 'inside ', + + test({ assert, target }) { + assert.htmlEqual( + target.innerHTML, + ` + + ` + ); + } +}); diff --git a/packages/svelte/tests/runtime-legacy/samples/dynamic-element-textarea/main.svelte b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-textarea/main.svelte new file mode 100644 index 0000000000..0ac8ee1e2d --- /dev/null +++ b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-textarea/main.svelte @@ -0,0 +1 @@ + diff --git a/packages/svelte/tests/snapshot/samples/export-state/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/export-state/_expected/client/index.svelte.js index c9ba1e7c73..4cc594e9d0 100644 --- a/packages/svelte/tests/snapshot/samples/export-state/_expected/client/index.svelte.js +++ b/packages/svelte/tests/snapshot/samples/export-state/_expected/client/index.svelte.js @@ -1,4 +1,4 @@ /* index.svelte.js generated by Svelte VERSION */ import * as $ from "svelte/internal"; -export const object = $.proxy({ ok: true }); +export const object = $.proxy({ ok: true }); \ No newline at end of file diff --git a/packages/svelte/tests/snapshot/samples/export-state/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/export-state/_expected/server/index.svelte.js index d7bc4c8f33..a3b619df6e 100644 --- a/packages/svelte/tests/snapshot/samples/export-state/_expected/server/index.svelte.js +++ b/packages/svelte/tests/snapshot/samples/export-state/_expected/server/index.svelte.js @@ -1,4 +1,4 @@ /* index.svelte.js generated by Svelte VERSION */ import * as $ from "svelte/internal/server"; -export const object = { ok: true }; +export const object = { ok: true }; \ No newline at end of file diff --git a/packages/svelte/tests/snapshot/samples/svelte-element/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/svelte-element/_expected/server/index.svelte.js index 405a452271..88a0ca6dcd 100644 --- a/packages/svelte/tests/snapshot/samples/svelte-element/_expected/server/index.svelte.js +++ b/packages/svelte/tests/snapshot/samples/svelte-element/_expected/server/index.svelte.js @@ -9,18 +9,7 @@ export default function Svelte_element($$payload, $$props) { const anchor = $.create_anchor($$payload); $$payload.out += `${anchor}`; - - if (tag) { - const anchor_1 = $.create_anchor($$payload); - - $$payload.out += `<${tag}>`; - - if (!$.VoidElements.has(tag)) { - $$payload.out += `${anchor_1}`; - $$payload.out += `${anchor_1}`; - } - } - + if (tag) $.element($$payload, tag, () => {}, () => {}); $$payload.out += `${anchor}`; $.bind_props($$props, { tag }); $.pop();