diff --git a/.changeset/thin-years-rhyme.md b/.changeset/thin-years-rhyme.md new file mode 100644 index 0000000000..14faa1a9a2 --- /dev/null +++ b/.changeset/thin-years-rhyme.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +feat: migrate `` diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js index 8d1392f821..0a64088c5a 100644 --- a/packages/svelte/src/compiler/migrate/index.js +++ b/packages/svelte/src/compiler/migrate/index.js @@ -427,6 +427,26 @@ const template = { next(); }, SvelteElement(node, { state, next }) { + if (node.tag.type === 'Literal') { + let is_static = true; + + let a = /** @type {number} */ (node.tag.start); + let b = /** @type {number} */ (node.tag.end); + let quote_mark = state.str.original[a - 1]; + + while (state.str.original[--a] !== '=') { + if (state.str.original[a] === '{') { + is_static = false; + break; + } + } + + if (is_static && state.str.original[b] === quote_mark) { + state.str.prependLeft(a + 1, '{'); + state.str.appendRight(/** @type {number} */ (node.tag.end) + 1, '}'); + } + } + handle_events(node, state); next(); }, diff --git a/packages/svelte/src/compiler/phases/1-parse/state/element.js b/packages/svelte/src/compiler/phases/1-parse/state/element.js index 5a2dccb551..cb6f24f868 100644 --- a/packages/svelte/src/compiler/phases/1-parse/state/element.js +++ b/packages/svelte/src/compiler/phases/1-parse/state/element.js @@ -280,7 +280,13 @@ export default function tag(parser) { // TODO in 6.0, error element.tag = chunk.type === 'Text' - ? { type: 'Literal', value: chunk.data, raw: `'${chunk.raw}'` } + ? { + type: 'Literal', + value: chunk.data, + raw: `'${chunk.raw}'`, + start: chunk.start, + end: chunk.end + } : chunk.expression; } else { element.tag = chunk.expression; diff --git a/packages/svelte/tests/migrate/samples/svelte-element/input.svelte b/packages/svelte/tests/migrate/samples/svelte-element/input.svelte new file mode 100644 index 0000000000..234ca717af --- /dev/null +++ b/packages/svelte/tests/migrate/samples/svelte-element/input.svelte @@ -0,0 +1,6 @@ + + + + + + diff --git a/packages/svelte/tests/migrate/samples/svelte-element/output.svelte b/packages/svelte/tests/migrate/samples/svelte-element/output.svelte new file mode 100644 index 0000000000..09a9960f56 --- /dev/null +++ b/packages/svelte/tests/migrate/samples/svelte-element/output.svelte @@ -0,0 +1,6 @@ + + + + + + diff --git a/packages/svelte/tests/migrate/test.ts b/packages/svelte/tests/migrate/test.ts index a3c247245c..5aa86a194f 100644 --- a/packages/svelte/tests/migrate/test.ts +++ b/packages/svelte/tests/migrate/test.ts @@ -21,7 +21,7 @@ const { test, run } = suite(async (config, cwd) => { fs.writeFileSync(`${cwd}/_actual.svelte`, actual); const expected = try_read_file(`${cwd}/output.svelte`); - assert.deepEqual(actual, expected); + assert.deepEqual(actual.trim(), expected?.trim()); } });