fix: add validation around disallowed sequence expressions to element attributes (#11149)

.changeset/fresh-dots-destroy.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: add validation around disallowed sequence expressions to element attributes

packages/svelte/src/compiler/phases/2-analyze/validation.js

@@ -98,7 +98,12 @@ function validate_element(node, context) {
 			if (context.state.analysis.runes && is_expression) {
 				const expression = attribute.value[0].expression;
 				if (expression.type === 'SequenceExpression') {
-					error(expression, 'invalid-sequence-expression');
+					let i = /** @type {number} */ (expression.start);
+					while (--i > 0) {
+						const char = context.state.analysis.source[i];
+						if (char === '(') break; // parenthesized sequence expressions are ok
+						if (char === '{') error(expression, 'invalid-sequence-expression');
+					}
 				}
 			}
 

packages/svelte/tests/compiler-errors/samples/attribute-sequence-expression-2/_config.js

@@ -0,0 +1,10 @@
+import { test } from '../../test';
+
+export default test({
+	error: {
+		code: 'invalid-sequence-expression',
+		message:
+			'Sequence expressions are not allowed as attribute/directive values in runes mode, unless wrapped in parentheses',
+		position: [124, 131]
+	}
+});

packages/svelte/tests/compiler-errors/samples/attribute-sequence-expression-2/main.svelte

@@ -0,0 +1,9 @@
+<script>
+	let { x, y, z } = $props();
+</script>
+
+<!-- allowed -->
+<span foo={(x, y, z)} />
+
+<!-- not allowed -->
+<span foo={x, y, z} />