feat: add derived with functions suggestions

Author: paoloricciuti

src/lib/mcp/autofixers/add-autofixers-issues.test.ts

@@ -273,4 +273,75 @@ describe('add_autofixers_issues', () => {
 			},
 		);
 	});
+
+	describe('derived_with_function', () => {
+		it(`should add suggestions when using a function as the first argument to $derived`, () => {
+			const content = run_autofixers_on_code(`
+			<script>
+				const value = $derived(() => {
+					return 43;
+				});
+			</script>`);
+
+			expect(content.suggestions.length).toBeGreaterThanOrEqual(1);
+			expect(content.suggestions).toContain(
+				'You are passing a function to $derived when declaring "value" but $derived expects an expression. You can use $derived.by instead.',
+			);
+		});
+
+		it(`should add suggestions when using a function as the first argument to $derived in classes`, () => {
+			const content = run_autofixers_on_code(`
+			<script>
+				class Double {
+					value = $derived(() => 43);
+				}
+			</script>`);
+
+			expect(content.suggestions.length).toBeGreaterThanOrEqual(1);
+			expect(content.suggestions).toContain(
+				'You are passing a function to $derived when declaring "value" but $derived expects an expression. You can use $derived.by instead.',
+			);
+		});
+
+		it(`should add suggestions when using a function as the first argument to $derived in classes constructors`, () => {
+			const content = run_autofixers_on_code(`
+			<script>
+				class Double {
+					value;
+
+					constructor(){
+						this.value = $derived(function() { return 44; });
+					}
+				}
+			</script>`);
+
+			expect(content.suggestions.length).toBeGreaterThanOrEqual(1);
+			expect(content.suggestions).toContain(
+				'You are passing a function to $derived when declaring "value" but $derived expects an expression. You can use $derived.by instead.',
+			);
+		});
+
+		it(`should add suggestions when using a function as the first argument to $derived without the declaring part if it's not an identifier`, () => {
+			const content = run_autofixers_on_code(`
+			<script>
+				const { destructured } = $derived(() => 43);
+			</script>`);
+
+			expect(content.suggestions.length).toBeGreaterThanOrEqual(1);
+			expect(content.suggestions).toContain(
+				'You are passing a function to $derived but $derived expects an expression. You can use $derived.by instead.',
+			);
+		});
+
+		it(`should add suggestions when using a function as the first argument to $derived.by`, () => {
+			const content = run_autofixers_on_code(`
+			<script>
+				const { destructured } = $derived.by(() => 43);
+			</script>`);
+
+			expect(content.suggestions).not.toContain(
+				'You are passing a function to $derived but $derived expects an expression. You can use $derived.by instead.',
+			);
+		});
+	});
 });

src/lib/mcp/autofixers/visitors/derived-with-function.ts

@@ -0,0 +1,41 @@
+import type { Identifier, PrivateIdentifier } from 'estree';
+import type { Autofixer } from '.';
+
+export const derived_with_function: Autofixer = {
+	CallExpression(node, { state, path }) {
+		if (
+			node.callee.type === 'Identifier' &&
+			node.callee.name === '$derived' &&
+			state.parsed.is_rune(node, ['$derived']) &&
+			(node.arguments[0].type === 'ArrowFunctionExpression' ||
+				node.arguments[0].type === 'FunctionExpression')
+		) {
+			const parent = path[path.length - 1];
+			let variable_id: Identifier | PrivateIdentifier | undefined;
+			if (parent.type === 'VariableDeclarator' && parent.id.type === 'Identifier') {
+				// const something = $derived(...)
+				variable_id = parent.id;
+			} else if (parent.type === 'PropertyDefinition') {
+				// class X { something = $derived(...) }
+				variable_id =
+					parent.key.type === 'Identifier'
+						? parent.key
+						: parent.key.type === 'PrivateIdentifier'
+							? parent.key
+							: undefined;
+			} else if (parent.type === 'AssignmentExpression') {
+				// this.something = $derived(...)
+				variable_id =
+					parent.left.type === 'MemberExpression'
+						? parent.left.property.type === 'Identifier'
+							? parent.left.property
+							: undefined
+						: undefined;
+			}
+
+			state.output.suggestions.push(
+				`You are passing a function to $derived ${variable_id ? `when declaring "${variable_id.name}" ` : ''}but $derived expects an expression. You can use $derived.by instead.`,
+			);
+		}
+	},
+};

src/lib/mcp/autofixers/visitors/index.ts

@@ -14,3 +14,4 @@ export type Autofixer = Visitors<Node | AST.SvelteNode, AutofixerState>;
 export * from './assign-in-effect.js';
 export * from './set-or-update-state.js';
 export * from './imported-runes.js';
+export * from './derived-with-function.js';