@depup/svelte 5.53.3-depup.0

package/src/compiler/phases/2-analyze/visitors/CallExpression.js

@@ -0,0 +1,339 @@
+/** @import { ArrowFunctionExpression, CallExpression, Expression, FunctionDeclaration, FunctionExpression, Identifier, VariableDeclarator } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { Context } from '../types' */
+import { get_rune } from '../../scope.js';
+import * as e from '../../../errors.js';
+import { get_parent } from '../../../utils/ast.js';
+import { is_pure, is_safe_identifier } from './shared/utils.js';
+import { dev, locate_node, source } from '../../../state.js';
+import * as b from '#compiler/builders';
+import { ExpressionMetadata } from '../../nodes.js';
+
+/**
+ * @param {CallExpression} node
+ * @param {Context} context
+ */
+export function CallExpression(node, context) {
+	const parent = /** @type {AST.SvelteNode} */ (get_parent(context.path, -1));
+
+	const rune = get_rune(node, context.state.scope);
+
+	if (rune && rune !== '$inspect') {
+		for (const arg of node.arguments) {
+			if (arg.type === 'SpreadElement') {
+				e.rune_invalid_spread(node, rune);
+			}
+		}
+	}
+
+	switch (rune) {
+		case null:
+			if (!is_safe_identifier(node.callee, context.state.scope)) {
+				context.state.analysis.needs_context = true;
+			}
+
+			break;
+
+		case '$bindable':
+			if (node.arguments.length > 1) {
+				e.rune_invalid_arguments_length(node, '$bindable', 'zero or one arguments');
+			}
+
+			if (
+				parent.type !== 'AssignmentPattern' ||
+				context.path.at(-3)?.type !== 'ObjectPattern' ||
+				context.path.at(-4)?.type !== 'VariableDeclarator' ||
+				get_rune(
+					/** @type {VariableDeclarator} */ (context.path.at(-4)).init,
+					context.state.scope
+				) !== '$props'
+			) {
+				e.bindable_invalid_location(node);
+			}
+
+			// We need context in case the bound prop is stale
+			context.state.analysis.needs_context = true;
+
+			break;
+
+		case '$host':
+			if (node.arguments.length > 0) {
+				e.rune_invalid_arguments(node, '$host');
+			} else if (context.state.ast_type === 'module' || !context.state.analysis.custom_element) {
+				e.host_invalid_placement(node);
+			}
+
+			break;
+
+		case '$props':
+			if (context.state.has_props_rune) {
+				e.props_duplicate(node, rune);
+			}
+
+			context.state.has_props_rune = true;
+
+			if (
+				parent.type !== 'VariableDeclarator' ||
+				context.state.ast_type !== 'instance' ||
+				context.state.scope !== context.state.analysis.instance.scope
+			) {
+				e.props_invalid_placement(node);
+			}
+
+			if (node.arguments.length > 0) {
+				e.rune_invalid_arguments(node, rune);
+			}
+
+			break;
+
+		case '$props.id': {
+			const grand_parent = get_parent(context.path, -2);
+
+			if (context.state.analysis.props_id) {
+				e.props_duplicate(node, rune);
+			}
+
+			if (
+				parent.type !== 'VariableDeclarator' ||
+				parent.id.type !== 'Identifier' ||
+				context.state.ast_type !== 'instance' ||
+				context.state.scope !== context.state.analysis.instance.scope ||
+				grand_parent.type !== 'VariableDeclaration'
+			) {
+				e.props_id_invalid_placement(node);
+			}
+
+			if (node.arguments.length > 0) {
+				e.rune_invalid_arguments(node, rune);
+			}
+
+			context.state.analysis.props_id = parent.id;
+
+			break;
+		}
+
+		case '$state':
+		case '$state.raw':
+		case '$derived':
+		case '$derived.by': {
+			const valid =
+				is_variable_declaration(parent, context) ||
+				is_class_property_definition(parent) ||
+				is_class_property_assignment_at_constructor_root(parent, context);
+
+			if (!valid) {
+				e.state_invalid_placement(node, rune);
+			}
+
+			if ((rune === '$derived' || rune === '$derived.by') && node.arguments.length !== 1) {
+				e.rune_invalid_arguments_length(node, rune, 'exactly one argument');
+			} else if (node.arguments.length > 1) {
+				e.rune_invalid_arguments_length(node, rune, 'zero or one arguments');
+			}
+
+			break;
+		}
+
+		case '$effect':
+		case '$effect.pre':
+			if (parent.type !== 'ExpressionStatement') {
+				e.effect_invalid_placement(node);
+			}
+
+			if (node.arguments.length !== 1) {
+				e.rune_invalid_arguments_length(node, rune, 'exactly one argument');
+			}
+
+			// `$effect` needs context because Svelte needs to know whether it should re-run
+			// effects that invalidate themselves, and that's determined by whether we're in runes mode
+			context.state.analysis.needs_context = true;
+
+			break;
+
+		case '$effect.tracking':
+			if (node.arguments.length !== 0) {
+				e.rune_invalid_arguments(node, rune);
+			}
+
+			break;
+
+		case '$effect.root':
+			if (node.arguments.length !== 1) {
+				e.rune_invalid_arguments_length(node, rune, 'exactly one argument');
+			}
+
+			break;
+
+		case '$effect.pending':
+			if (context.state.expression) {
+				context.state.expression.has_state = true;
+			}
+
+			break;
+
+		case '$inspect':
+			if (node.arguments.length < 1) {
+				e.rune_invalid_arguments_length(node, rune, 'one or more arguments');
+			}
+
+			break;
+
+		case '$inspect().with':
+			if (node.arguments.length !== 1) {
+				e.rune_invalid_arguments_length(node, rune, 'exactly one argument');
+			}
+
+			break;
+
+		case '$inspect.trace': {
+			if (node.arguments.length > 1) {
+				e.rune_invalid_arguments_length(node, rune, 'zero or one arguments');
+			}
+
+			const grand_parent = context.path.at(-2);
+			const fn = context.path.at(-3);
+
+			if (
+				parent.type !== 'ExpressionStatement' ||
+				grand_parent?.type !== 'BlockStatement' ||
+				!(
+					fn?.type === 'FunctionDeclaration' ||
+					fn?.type === 'FunctionExpression' ||
+					fn?.type === 'ArrowFunctionExpression'
+				) ||
+				grand_parent.body[0] !== parent
+			) {
+				e.inspect_trace_invalid_placement(node);
+			}
+
+			if (fn.generator) {
+				e.inspect_trace_generator(node);
+			}
+
+			if (dev) {
+				if (node.arguments[0]) {
+					context.state.scope.tracing = b.thunk(/** @type {Expression} */ (node.arguments[0]));
+				} else {
+					const label = get_function_label(context.path.slice(0, -2)) ?? 'trace';
+					const loc = `(${locate_node(fn)})`;
+
+					context.state.scope.tracing = b.thunk(b.literal(label + ' ' + loc));
+				}
+
+				context.state.analysis.tracing = true;
+			}
+
+			break;
+		}
+
+		case '$state.eager':
+			if (node.arguments.length !== 1) {
+				e.rune_invalid_arguments_length(node, rune, 'exactly one argument');
+			}
+
+			break;
+
+		case '$state.snapshot':
+			if (node.arguments.length !== 1) {
+				e.rune_invalid_arguments_length(node, rune, 'exactly one argument');
+			}
+
+			break;
+	}
+
+	// `$inspect(foo)` or `$derived(foo) should not trigger the `static-state-reference` warning
+	if (rune === '$derived') {
+		const expression = new ExpressionMetadata();
+
+		context.next({
+			...context.state,
+			function_depth: context.state.function_depth + 1,
+			derived_function_depth: context.state.function_depth + 1,
+			expression
+		});
+
+		if (expression.has_await) {
+			context.state.analysis.async_deriveds.add(node);
+		}
+	} else if (rune === '$inspect') {
+		context.next({ ...context.state, function_depth: context.state.function_depth + 1 });
+	} else {
+		context.next();
+	}
+
+	if (context.state.expression) {
+		// TODO We assume that any dependencies are stateful, which isn't necessarily the case — see
+		// https://github.com/sveltejs/svelte/issues/13266. This check also includes dependencies
+		// outside the call expression itself (e.g. `{blah && pure()}`) resulting in additional
+		// false positives, but for now we accept that trade-off
+		if (!is_pure(node.callee, context) || context.state.expression.dependencies.size > 0) {
+			context.state.expression.has_call = true;
+			context.state.expression.has_state = true;
+		}
+	}
+}
+
+/**
+ * @param {AST.SvelteNode[]} nodes
+ */
+function get_function_label(nodes) {
+	const fn = /** @type {FunctionExpression | FunctionDeclaration | ArrowFunctionExpression} */ (
+		nodes.at(-1)
+	);
+
+	if ((fn.type === 'FunctionDeclaration' || fn.type === 'FunctionExpression') && fn.id != null) {
+		return fn.id.name;
+	}
+
+	const parent = nodes.at(-2);
+	if (!parent) return;
+
+	if (parent.type === 'CallExpression') {
+		return source.slice(parent.callee.start, parent.callee.end) + '(...)';
+	}
+
+	if (parent.type === 'Property' && !parent.computed) {
+		return /** @type {Identifier} */ (parent.key).name;
+	}
+
+	if (parent.type === 'VariableDeclarator' && parent.id.type === 'Identifier') {
+		return parent.id.name;
+	}
+}
+
+/**
+ * @param {AST.SvelteNode} parent
+ * @param {Context} context
+ */
+function is_variable_declaration(parent, context) {
+	return parent.type === 'VariableDeclarator' && get_parent(context.path, -3).type !== 'ConstTag';
+}
+
+/**
+ * @param {AST.SvelteNode} parent
+ */
+function is_class_property_definition(parent) {
+	return parent.type === 'PropertyDefinition' && !parent.static && !parent.computed;
+}
+
+/**
+ * @param {AST.SvelteNode} node
+ * @param {Context} context
+ */
+function is_class_property_assignment_at_constructor_root(node, context) {
+	if (
+		node.type === 'AssignmentExpression' &&
+		node.operator === '=' &&
+		node.left.type === 'MemberExpression' &&
+		node.left.object.type === 'ThisExpression' &&
+		((node.left.property.type === 'Identifier' && !node.left.computed) ||
+			node.left.property.type === 'PrivateIdentifier' ||
+			node.left.property.type === 'Literal')
+	) {
+		// MethodDefinition (-5) -> FunctionExpression (-4) -> BlockStatement (-3) -> ExpressionStatement (-2) -> AssignmentExpression (-1)
+		const parent = get_parent(context.path, -5);
+		return parent?.type === 'MethodDefinition' && parent.kind === 'constructor';
+	}
+
+	return false;
+}

package/src/compiler/phases/2-analyze/visitors/ClassBody.js

@@ -0,0 +1,156 @@
+/** @import { AssignmentExpression, CallExpression, ClassBody, PropertyDefinition, Expression, PrivateIdentifier, MethodDefinition } from 'estree' */
+/** @import { StateField } from '#compiler' */
+/** @import { Context } from '../types' */
+import * as b from '#compiler/builders';
+import { get_rune } from '../../scope.js';
+import * as e from '../../../errors.js';
+import { is_state_creation_rune } from '../../../../utils.js';
+import { get_name } from '../../nodes.js';
+import { regex_invalid_identifier_chars } from '../../patterns.js';
+
+/**
+ * @param {ClassBody} node
+ * @param {Context} context
+ */
+export function ClassBody(node, context) {
+	if (!context.state.analysis.runes) {
+		context.next();
+		return;
+	}
+
+	/** @type {string[]} */
+	const private_ids = [];
+
+	for (const prop of node.body) {
+		if (
+			(prop.type === 'MethodDefinition' || prop.type === 'PropertyDefinition') &&
+			prop.key.type === 'PrivateIdentifier'
+		) {
+			private_ids.push(prop.key.name);
+		}
+	}
+
+	/** @type {Map<string, StateField>} */
+	const state_fields = new Map();
+
+	/** @type {Map<string, Array<MethodDefinition['kind'] | 'prop' | 'assigned_prop'>>} */
+	const fields = new Map();
+
+	context.state.analysis.classes.set(node, state_fields);
+
+	/** @type {MethodDefinition | null} */
+	let constructor = null;
+
+	/**
+	 * @param {PropertyDefinition | AssignmentExpression} node
+	 * @param {Expression | PrivateIdentifier} key
+	 * @param {Expression | null | undefined} value
+	 */
+	function handle(node, key, value) {
+		const name = get_name(key);
+		if (name === null) return;
+
+		const rune = get_rune(value, context.state.scope);
+
+		if (rune && is_state_creation_rune(rune)) {
+			if (state_fields.has(name)) {
+				e.state_field_duplicate(node, name);
+			}
+
+			const _key = (node.type === 'AssignmentExpression' || !node.static ? '' : '@') + name;
+			const field = fields.get(_key);
+
+			// if there's already a method or assigned field, error
+			if (field && !(field.length === 1 && field[0] === 'prop')) {
+				e.duplicate_class_field(node, _key);
+			}
+
+			state_fields.set(name, {
+				node,
+				type: rune,
+				// @ts-expect-error for public state this is filled out in a moment
+				key: key.type === 'PrivateIdentifier' ? key : null,
+				value: /** @type {CallExpression} */ (value)
+			});
+		}
+	}
+
+	for (const child of node.body) {
+		if (child.type === 'PropertyDefinition' && !child.computed && !child.static) {
+			handle(child, child.key, child.value);
+			const key = /** @type {string} */ (get_name(child.key));
+			const field = fields.get(key);
+			if (!field) {
+				fields.set(key, [child.value ? 'assigned_prop' : 'prop']);
+				continue;
+			}
+			e.duplicate_class_field(child, key);
+		}
+
+		if (child.type === 'MethodDefinition') {
+			if (child.kind === 'constructor') {
+				constructor = child;
+			} else if (!child.computed) {
+				const key = (child.static ? '@' : '') + get_name(child.key);
+				const field = fields.get(key);
+				if (!field) {
+					fields.set(key, [child.kind]);
+					continue;
+				}
+				if (
+					field.includes(child.kind) ||
+					field.includes('prop') ||
+					field.includes('assigned_prop')
+				) {
+					e.duplicate_class_field(child, key);
+				}
+				if (child.kind === 'get') {
+					if (field.length === 1 && field[0] === 'set') {
+						field.push('get');
+						continue;
+					}
+				} else if (child.kind === 'set') {
+					if (field.length === 1 && field[0] === 'get') {
+						field.push('set');
+						continue;
+					}
+				} else {
+					field.push(child.kind);
+					continue;
+				}
+				e.duplicate_class_field(child, key);
+			}
+		}
+	}
+
+	if (constructor) {
+		for (const statement of constructor.value.body.body) {
+			if (statement.type !== 'ExpressionStatement') continue;
+			if (statement.expression.type !== 'AssignmentExpression') continue;
+
+			const { left, right } = statement.expression;
+
+			if (left.type !== 'MemberExpression') continue;
+			if (left.object.type !== 'ThisExpression') continue;
+			if (left.computed && left.property.type !== 'Literal') continue;
+
+			handle(statement.expression, left.property, right);
+		}
+	}
+
+	for (const [name, field] of state_fields) {
+		if (name[0] === '#') {
+			continue;
+		}
+
+		let deconflicted = name.replace(regex_invalid_identifier_chars, '_');
+		while (private_ids.includes(deconflicted)) {
+			deconflicted = '_' + deconflicted;
+		}
+
+		private_ids.push(deconflicted);
+		field.key = b.private_id(deconflicted);
+	}
+
+	context.next({ ...context.state, state_fields });
+}

package/src/compiler/phases/2-analyze/visitors/ClassDeclaration.js

@@ -0,0 +1,25 @@
+/** @import { ClassDeclaration } from 'estree' */
+/** @import { Context } from '../types' */
+import * as w from '../../../warnings.js';
+import { validate_identifier_name } from './shared/utils.js';
+
+/**
+ * @param {ClassDeclaration} node
+ * @param {Context} context
+ */
+export function ClassDeclaration(node, context) {
+	if (context.state.analysis.runes && node.id !== null) {
+		validate_identifier_name(context.state.scope.get(node.id.name));
+	}
+
+	// In modules, we allow top-level module scope only, in components, we allow the component scope,
+	// which is function_depth of 1. With the exception of `new class` which is also not allowed at
+	// component scope level either.
+	const allowed_depth = context.state.ast_type === 'module' ? 0 : 1;
+
+	if (context.state.scope.function_depth > allowed_depth) {
+		w.perf_avoid_nested_class(node);
+	}
+
+	context.next();
+}

package/src/compiler/phases/2-analyze/visitors/ClassDirective.js

@@ -0,0 +1,13 @@
+/** @import { AST } from '#compiler' */
+/** @import { Context } from '../types' */
+
+import { mark_subtree_dynamic } from './shared/fragment.js';
+
+/**
+ * @param {AST.ClassDirective} node
+ * @param {Context} context
+ */
+export function ClassDirective(node, context) {
+	mark_subtree_dynamic(context.path);
+	context.next({ ...context.state, expression: node.metadata.expression });
+}

package/src/compiler/phases/2-analyze/visitors/Component.js

@@ -0,0 +1,26 @@
+/** @import { AST } from '#compiler' */
+/** @import { Context } from '../types' */
+import { visit_component } from './shared/component.js';
+
+/**
+ * @param {AST.Component} node
+ * @param {Context} context
+ */
+export function Component(node, context) {
+	const binding = context.state.scope.get(
+		node.name.includes('.') ? node.name.slice(0, node.name.indexOf('.')) : node.name
+	);
+
+	node.metadata.dynamic =
+		context.state.analysis.runes && // Svelte 4 required you to use svelte:component to switch components
+		binding !== null &&
+		(binding.kind !== 'normal' || node.name.includes('.'));
+
+	if (binding) {
+		node.metadata.expression.has_state = node.metadata.dynamic;
+		node.metadata.expression.dependencies.add(binding);
+		node.metadata.expression.references.add(binding);
+	}
+
+	visit_component(node, context);
+}

package/src/compiler/phases/2-analyze/visitors/ConstTag.js

@@ -0,0 +1,45 @@
+/** @import { AST } from '#compiler' */
+/** @import { Context } from '../types' */
+import * as e from '../../../errors.js';
+import { validate_opening_tag } from './shared/utils.js';
+
+/**
+ * @param {AST.ConstTag} node
+ * @param {Context} context
+ */
+export function ConstTag(node, context) {
+	if (context.state.analysis.runes) {
+		validate_opening_tag(node, context.state, '@');
+	}
+
+	const parent = context.path.at(-1);
+	const grand_parent = context.path.at(-2);
+
+	if (
+		parent?.type !== 'Fragment' ||
+		(grand_parent?.type !== 'IfBlock' &&
+			grand_parent?.type !== 'SvelteFragment' &&
+			grand_parent?.type !== 'Component' &&
+			grand_parent?.type !== 'SvelteComponent' &&
+			grand_parent?.type !== 'EachBlock' &&
+			grand_parent?.type !== 'AwaitBlock' &&
+			grand_parent?.type !== 'SnippetBlock' &&
+			grand_parent?.type !== 'SvelteBoundary' &&
+			grand_parent?.type !== 'KeyBlock' &&
+			((grand_parent?.type !== 'RegularElement' && grand_parent?.type !== 'SvelteElement') ||
+				!grand_parent.attributes.some((a) => a.type === 'Attribute' && a.name === 'slot')))
+	) {
+		e.const_tag_invalid_placement(node);
+	}
+
+	const declaration = node.declaration.declarations[0];
+
+	context.visit(declaration.id);
+	context.visit(declaration.init, {
+		...context.state,
+		expression: node.metadata.expression,
+		// We're treating this like a $derived under the hood
+		function_depth: context.state.function_depth + 1,
+		derived_function_depth: context.state.function_depth + 1
+	});
+}

package/src/compiler/phases/2-analyze/visitors/DebugTag.js

@@ -0,0 +1,15 @@
+/** @import { AST } from '#compiler' */
+/** @import { Context } from '../types' */
+import { validate_opening_tag } from './shared/utils.js';
+
+/**
+ * @param {AST.DebugTag} node
+ * @param {Context} context
+ */
+export function DebugTag(node, context) {
+	if (context.state.analysis.runes) {
+		validate_opening_tag(node, context.state, '@');
+	}
+
+	context.next();
+}