diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 0bf6b371f4..b0b1853efb 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -10,7 +10,7 @@ import { regex_valid_component_name } from '../phases/1-parse/state/element.js';
import { analyze_component } from '../phases/2-analyze/index.js';
import { get_rune } from '../phases/scope.js';
import { reset, reset_warning_filter } from '../state.js';
-import { extract_identifiers, extract_all_identifiers_from_expression } from '../utils/ast.js';
+import { extract_all_identifiers_from_expression, extract_identifiers } from '../utils/ast.js';
import { migrate_svelte_ignore } from '../utils/extract_svelte_ignore.js';
import { validate_component_options } from '../validate-options.js';
import { is_svg, is_void } from '../../utils.js';
@@ -23,9 +23,10 @@ const style_placeholder = '/*$$__STYLE_CONTENT__$$*/';
* May throw an error if the code is too complex to migrate automatically.
*
* @param {string} source
+ * @param {string} [filename]
* @returns {{ code: string; }}
*/
-export function migrate(source) {
+export function migrate(source, filename) {
try {
// Blank CSS, could contain SCSS or similar that needs a preprocessor.
// Since we don't care about CSS in this migration, we'll just ignore it.
@@ -37,7 +38,7 @@ export function migrate(source) {
});
reset_warning_filter(() => false);
- reset(source, { filename: 'migrate.svelte' });
+ reset(source, { filename: filename ?? 'migrate.svelte' });
let parsed = parse(source);
@@ -64,6 +65,7 @@ export function migrate(source) {
let state = {
scope: analysis.instance.scope,
analysis,
+ filename,
str,
indent,
props: [],
@@ -86,12 +88,14 @@ export function migrate(source) {
createBubbler: analysis.root.unique('createBubbler').name,
bubble: analysis.root.unique('bubble').name,
passive: analysis.root.unique('passive').name,
- nonpassive: analysis.root.unique('nonpassive').name
+ nonpassive: analysis.root.unique('nonpassive').name,
+ svelte_self: analysis.root.unique('SvelteSelf').name
},
legacy_imports: new Set(),
script_insertions: new Set(),
derived_components: new Map(),
- derived_labeled_statements: new Set()
+ derived_labeled_statements: new Set(),
+ has_svelte_self: false
};
if (parsed.module) {
@@ -118,12 +122,21 @@ export function migrate(source) {
state.script_insertions.size > 0 ||
state.props.length > 0 ||
analysis.uses_rest_props ||
- analysis.uses_props;
+ analysis.uses_props ||
+ state.has_svelte_self;
if (!parsed.instance && need_script) {
str.appendRight(0, '
+
+{#if false}
+
+
+
+
+ child
+
+
+ child
+
+
+ child
+
+{/if}
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/svelte-self-name-conflict/output.svelte b/packages/svelte/tests/migrate/samples/svelte-self-name-conflict/output.svelte
new file mode 100644
index 0000000000..fef6e33da8
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/svelte-self-name-conflict/output.svelte
@@ -0,0 +1,21 @@
+
+
+{#if false}
+
+
+
+
+ child
+
+
+ child
+
+
+ child
+
+{/if}
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/svelte-self/input.svelte b/packages/svelte/tests/migrate/samples/svelte-self/input.svelte
new file mode 100644
index 0000000000..41d9bea434
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/svelte-self/input.svelte
@@ -0,0 +1,14 @@
+{#if false}
+
+
+
+
+ child
+
+
+ child
+
+
+ child
+
+{/if}
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/svelte-self/output.svelte b/packages/svelte/tests/migrate/samples/svelte-self/output.svelte
new file mode 100644
index 0000000000..e72e7e0209
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/svelte-self/output.svelte
@@ -0,0 +1,20 @@
+
+
+{#if false}
+
+
+
+
+ child
+
+
+ child
+
+
+ child
+
+{/if}
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/test.ts b/packages/svelte/tests/migrate/test.ts
index 5aa86a194f..41021f920b 100644
--- a/packages/svelte/tests/migrate/test.ts
+++ b/packages/svelte/tests/migrate/test.ts
@@ -12,7 +12,7 @@ const { test, run } = suite(async (config, cwd) => {
.replace(/\s+$/, '')
.replace(/\r/g, '');
- const actual = migrate(input).code;
+ const actual = migrate(input, `${cwd}/output.svelte`).code;
// run `UPDATE_SNAPSHOTS=true pnpm test migrate` to update parser tests
if (process.env.UPDATE_SNAPSHOTS || !fs.existsSync(`${cwd}/output.svelte`)) {
diff --git a/sites/svelte-5-preview/src/lib/Output/Compiler.js b/sites/svelte-5-preview/src/lib/Output/Compiler.js
index ae36368241..94484ecf39 100644
--- a/sites/svelte-5-preview/src/lib/Output/Compiler.js
+++ b/sites/svelte-5-preview/src/lib/Output/Compiler.js
@@ -80,7 +80,8 @@ export default class Compiler {
this.worker.postMessage({
id,
type: 'migrate',
- source: file.source
+ source: file.source,
+ filename: `${file.name}.${file.type}`
});
});
}
diff --git a/sites/svelte-5-preview/src/lib/workers/compiler/index.js b/sites/svelte-5-preview/src/lib/workers/compiler/index.js
index 46853c3984..48bb7f9e3c 100644
--- a/sites/svelte-5-preview/src/lib/workers/compiler/index.js
+++ b/sites/svelte-5-preview/src/lib/workers/compiler/index.js
@@ -133,9 +133,9 @@ function compile({ id, source, options, return_ast }) {
}
/** @param {import("../workers").MigrateMessageData} param0 */
-function migrate({ id, source }) {
+function migrate({ id, source, filename }) {
try {
- const result = svelte.migrate(source);
+ const result = svelte.migrate(source, filename);
return {
id,