fix: don't require commas between warnings in legacy mode (#11669)

also add commas in migration
closes #11666

.changeset/twelve-beans-drive.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: don't require warning codes to be separated by commas in non-runes mode

packages/svelte/src/compiler/utils/extract_svelte_ignore.js

@@ -31,16 +31,16 @@ export function extract_svelte_ignore(offset, text, runes) {
 	/** @type {string[]} */
 	const ignores = [];
 
+	if (runes) {
 		// Warnings have to be separated by commas, everything after is interpreted as prose
 		for (const match of text.slice(length).matchAll(/([\w$-]+)(,)?/gm)) {
 			const code = match[1];
 
+			if (w.codes.includes(code)) {
 				ignores.push(code);
-
-		if (!w.codes.includes(code)) {
+			} else {
 				const replacement = replacements[code] ?? code.replace(/-/g, '_');
 
-			if (runes) {
 				// The type cast is for some reason necessary to pass the type check in CI
 				const start = offset + /** @type {number} */ (match.index);
 				const end = start + code.length;
@@ -51,15 +51,28 @@ export function extract_svelte_ignore(offset, text, runes) {
 					const suggestion = fuzzymatch(code, w.codes);
 					w.unknown_code({ start, end }, code, suggestion);
 				}
-			} else if (w.codes.includes(replacement)) {
-				ignores.push(replacement);
-			}
 			}
 
 			if (!match[2]) {
 				break;
 			}
 		}
+	} else {
+		// Non-runes mode: lax parsing, backwards compat with old codes
+		for (const match of text.slice(length).matchAll(/[\w$-]+/gm)) {
+			const code = match[0];
+
+			ignores.push(code);
+
+			if (!w.codes.includes(code)) {
+				const replacement = replacements[code] ?? code.replace(/-/g, '_');
+
+				if (w.codes.includes(replacement)) {
+					ignores.push(replacement);
+				}
+			}
+		}
+	}
 
 	return ignores;
 }
@@ -76,8 +89,12 @@ export function migrate_svelte_ignore(text) {
 	const length = match[0].length;
 	return (
 		text.substring(0, length) +
-		text
-			.substring(length)
-			.replace(/\w+-\w+(-\w+)*/g, (code) => replacements[code] ?? code.replace(/-/g, '_'))
+		text.substring(length).replace(/\w+-\w+(-\w+)*/g, (code, _, idx) => {
+			let replacement = replacements[code] ?? code.replace(/-/g, '_');
+			if (/\w+-\w+/.test(text.substring(length + idx + code.length))) {
+				replacement += ',';
+			}
+			return replacement;
+		})
 	);
 }

packages/svelte/tests/migrate/samples/svelte-ignore/input.svelte

@@ -7,3 +7,6 @@
 
 <!-- svelte-ignore a11y-something-something -->
 <div></div>
+
+<!-- svelte-ignore a11y-something-something a11y-something-something2 -->
+<div></div>

packages/svelte/tests/migrate/samples/svelte-ignore/output.svelte

@@ -7,3 +7,6 @@
 
 <!-- svelte-ignore a11y_something_something -->
 <div></div>
+
+<!-- svelte-ignore a11y_something_something, a11y_something_something2 -->
+<div></div>

packages/svelte/tests/validator/samples/ignore-warning-dash-backwards-compat/input.svelte

@@ -12,3 +12,9 @@
 
 <!-- svelte-ignore a11y-misplaced-scope -->
 <div scope></div>
+
+<!-- svelte-ignore a11y-missing-attribute a11y-misplaced-scope -->
+<div>
+	<img src="this-is-fine.jpg">
+	<div scope></div>
+</div>