fix: prevent duplicate imports (#12931)

Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>

.changeset/spicy-cars-cheer.md

@@ -0,0 +1,5 @@
+---
+'svelte-migrate': patch
+---
+
+fix: prevent duplicate imports

packages/migrate/migrations/svelte-5/migrate.js

@@ -1,6 +1,6 @@
 import fs from 'node:fs';
 import { Project, ts, Node } from 'ts-morph';
-import { update_pkg } from '../../utils.js';
+import { add_named_import, update_pkg } from '../../utils.js';
 
 export function update_pkg_json() {
 	fs.writeFileSync(
@@ -94,14 +94,7 @@ function update_component_instantiation(source) {
 							?.remove();
 					}
 
-					if (source.getImportDeclaration('svelte')) {
-						source.getImportDeclaration('svelte')?.addNamedImport(method);
-					} else {
-						source.addImportDeclaration({
-							moduleSpecifier: 'svelte',
-							namedImports: [method]
-						});
-					}
+					add_named_import(source, 'svelte', method);
 
 					const declaration = parent
 						.getParentIfKind(ts.SyntaxKind.VariableDeclaration)
@@ -114,7 +107,7 @@ function update_component_instantiation(source) {
 								const call_expr = parent.getParentIfKind(ts.SyntaxKind.CallExpression);
 								if (call_expr) {
 									call_expr.replaceWithText(`unmount(${usage.getText()})`);
-									source.getImportDeclaration('svelte')?.addNamedImport('unmount');
+									add_named_import(source, 'svelte', 'unmount');
 								}
 							}
 						}

packages/migrate/migrations/svelte-5/migrate.spec.js

@@ -73,6 +73,35 @@ function destroy() {
 	);
 });
 
+test('Updates component creation with multiple components', () => {
+	const result = transform_module_code(
+		`import App from './App.svelte';
+import Child from './Child.svelte';
+
+const x = new App({
+  target: document.getElementById('app')!
+});
+const y = new Child({
+  target: document.getElementById('child')!
+});
+`
+	);
+	assert.equal(
+		result,
+		`import App from './App.svelte';
+import Child from './Child.svelte';
+import { mount } from "svelte";
+
+const x = mount(App, {
+  target: document.getElementById('app')!
+});
+const y = mount(Child, {
+  target: document.getElementById('child')!
+});
+`
+	);
+});
+
 test('Update package.json', () => {
 	const result = update_pkg_json_content(`{
 	"name": "svelte-app",

packages/migrate/migrations/sveltekit-2/migrate.js

@@ -1,6 +1,11 @@
 import fs from 'node:fs';
 import { Project, Node, SyntaxKind } from 'ts-morph';
-import { log_migration, log_on_ts_modification, update_pkg } from '../../utils.js';
+import {
+	add_named_import,
+	log_migration,
+	log_on_ts_modification,
+	update_pkg
+} from '../../utils.js';
 import path from 'node:path';
 
 export function update_pkg_json() {
@@ -112,17 +117,7 @@ export function update_svelte_config_content(code) {
 			?.setModuleSpecifier('@sveltejs/vite-plugin-svelte');
 	} else {
 		namedImport.remove();
-		const vps = source.getImportDeclaration(
-			(i) => i.getModuleSpecifierValue() === '@sveltejs/vite-plugin-svelte'
-		);
-		if (vps) {
-			vps.addNamedImport('vitePreprocess');
-		} else {
-			source.addImportDeclaration({
-				moduleSpecifier: '@sveltejs/vite-plugin-svelte',
-				namedImports: ['vitePreprocess']
-			});
-		}
+		add_named_import(source, '@sveltejs/vite-plugin-svelte', 'vitePreprocess');
 	}
 
 	logger();

packages/migrate/utils.js

@@ -401,3 +401,21 @@ export function read_samples(test_file) {
 
 	return samples;
 }
+
+/**
+ * @param {import('ts-morph').SourceFile} source
+ * @param {string} _import
+ * @param {string} method
+ */
+export function add_named_import(source, _import, method) {
+	const existing = source.getImportDeclaration(_import);
+	if (existing) {
+		if (existing.getNamedImports().some((i) => i.getName() === method)) return;
+		existing?.addNamedImport(method);
+	} else {
+		source.addImportDeclaration({
+			moduleSpecifier: _import,
+			namedImports: [method]
+		});
+	}
+}