fix: correctly validate undefined snippet params with default value

Author: paoloricciuti

.changeset/angry-mayflies-matter.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly validate `undefined` snippet params with default value

packages/svelte/src/compiler/phases/3-transform/client/visitors/SnippetBlock.js

@@ -24,6 +24,8 @@ export function SnippetBlock(node, context) {
 	const transform = { ...context.state.transform };
 	const child_state = { ...context.state, transform };
 
+	let fallback_arr = [];
+
 	for (let i = 0; i < node.parameters.length; i++) {
 		const argument = node.parameters[i];
 
@@ -49,6 +51,9 @@ export function SnippetBlock(node, context) {
 		for (const path of paths) {
 			const name = /** @type {Identifier} */ (path.node).name;
 			const needs_derived = path.has_default_value; // to ensure that default value is only called once
+			if (needs_derived) {
+				fallback_arr.push(i);
+			}
 			const fn = b.thunk(
 				/** @type {Expression} */ (context.visit(path.expression?.(b.maybe_call(b.id(arg_alias)))))
 			);
@@ -67,12 +72,16 @@ export function SnippetBlock(node, context) {
 		}
 	}
 	if (dev) {
+		const [anchor, ...validations_args] = args;
 		declarations.unshift(
 			b.stmt(
 				b.call(
 					'$.validate_snippet_args',
 					.../** @type {Identifier[]} */ (
-						args.map((arg) => (arg?.type === 'Identifier' ? arg : arg?.left))
+						[anchor, b.array(fallback_arr.map((i) => b.literal(i))), ...validations_args].map(
+							(arg) =>
+								arg?.type === 'Identifier' || arg.type === 'ArrayExpression' ? arg : arg?.left
+						)
 					)
 				)
 			)

packages/svelte/src/internal/client/dev/validation.js

@@ -1,14 +1,16 @@
 import { invalid_snippet_arguments } from '../../shared/errors.js';
 /**
  * @param {Node} anchor
+ * @param {number[]} with_fallback_idx
  * @param {...(()=>any)[]} args
  */
-export function validate_snippet_args(anchor, ...args) {
+export function validate_snippet_args(anchor, with_fallback_idx, ...args) {
 	if (typeof anchor !== 'object' || !(anchor instanceof Node)) {
 		invalid_snippet_arguments();
 	}
-	for (let arg of args) {
-		if (typeof arg !== 'function') {
+	for (let i = 0; i < args.length; i++) {
+		const arg = args[i];
+		if (typeof arg !== 'function' && !(with_fallback_idx.includes(i) && arg === undefined)) {
 			invalid_snippet_arguments();
 		}
 	}

packages/svelte/tests/runtime-runes/samples/validate-undefined-snippet-default-arg/_config.js

@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<p>default</p>`
+});

packages/svelte/tests/runtime-runes/samples/validate-undefined-snippet-default-arg/main.svelte

@@ -0,0 +1,5 @@
+{#snippet test(param = "default")}
+    <p>{param}</p>
+{/snippet}
+
+{@render test()}