chore: fix tests to follow latest Svelte 5 (#751)

I just added Node 22 but CI does not pass in #750 sveltejs/svelte#11327 changes warning messages, so I mainly copied exist tests and optimized for Svelte 5.
sveltejs · May 7, 2024 · 60e784e · 60e784e
1 parent ade400a
commit 60e784e
Show file tree

Hide file tree

Showing 137 changed files with 739 additions and 105 deletions.
diff --git a/docs-svelte-kit/src/lib/components/ESLintPlayground.svelte b/docs-svelte-kit/src/lib/components/ESLintPlayground.svelte
@@ -190,10 +190,9 @@
 				<ol>
 					{#each messages as msg, i (`${msg.line}:${msg.column}:${msg.ruleId}@${i}`)}
 						<li class="message">
-							<!-- svelte-ignore a11y-invalid-attribute -->
-							<a href="#" on:click={(evt) => onClickMessage(evt, msg)} class="message-link"
-								>[{msg.line}:{msg.column}]</a
-							>:
+							<button on:click={(evt) => onClickMessage(evt, msg)} class="message-link">
+								[{msg.line}:{msg.column}]
+							</button>:
 							{msg.message}
 							<a
 								class="rule-link {getRule(msg.ruleId)?.classes}"
@@ -268,6 +267,12 @@
 		color: #8080f2;
 	}
 	.message-link {
+		background-color: transparent;
+		border: none;
+		cursor: pointer;
+		outline: none;
+		padding: 0;
+		appearance: none;
 		color: #40b3ff;
 	}
 </style>
diff --git a/docs-svelte-kit/src/routes/+layout.svelte b/docs-svelte-kit/src/routes/+layout.svelte
@@ -33,7 +33,7 @@
 
 <SideMenu {sidebarOpen} hiddenMenu={frontmatter.hiddenMenu} />
 
-<!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
+<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
 <main
 	class:hidden-menu={frontmatter.hiddenMenu}
 	on:click={sidebarOpen ? resetSidebarOpen : null}

diff --git a/eslint.config.mjs b/eslint.config.mjs
@@ -128,7 +128,8 @@ const config = [
 		},
 		rules: {
 			'n/file-extension-in-import': 'off',
-			'n/no-unsupported-features/es-syntax': 'off'
+			'n/no-unsupported-features/es-syntax': 'off',
+			'n/no-unsupported-features/es-builtins': 'off'
 		}
 	},
 	{

diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-input.svelte
@@ -1,5 +1,5 @@
-<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<!-- svelte-ignore a11y_autofocus a11y_missing_attribute -->
 <img src="foo" alt="Foo" />
 
-<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<!-- svelte-ignore a11y_autofocus a11y_missing_attribute -->
 <img src="foo" alt="Foo" autofocus />
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-svelte4-errors.yaml b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-svelte4-errors.yaml
@@ -0,0 +1,12 @@
+- message: svelte-ignore comment is used, but not warned
+  line: 1
+  column: 20
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 1
+  column: 35
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 4
+  column: 35
+  suggestions: null
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-svelte4-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-svelte4-input.svelte
@@ -0,0 +1,5 @@
+<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<img src="foo" alt="Foo" />
+
+<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<img src="foo" alt="Foo" autofocus />
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-svelte4-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/html-comment-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-input.svelte
@@ -1,7 +1,7 @@
 <div>
 	{#if true}
 		A
-		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+		<!-- svelte-ignore a11y_label_has_associated_control a11y_no_noninteractive_tabindex -->
 	{:else}
 		<label tabindex="0">Click</label>
 		<ul tabindex="0"></ul>

diff --git a/.../fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-requirements.json b/.../fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/...ixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-svelte4-errors.yaml b/...ixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-svelte4-errors.yaml
@@ -0,0 +1,8 @@
+- message: svelte-ignore comment is used, but not warned
+  line: 4
+  column: 22
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 4
+  column: 56
+  suggestions: null
diff --git a/...xtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-svelte4-input.svelte b/...xtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-svelte4-input.svelte
@@ -0,0 +1,9 @@
+<div>
+	{#if true}
+		A
+		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+	{:else}
+		<label tabindex="0">Click</label>
+		<ul tabindex="0"></ul>
+	{/if}
+</div>
diff --git a/...s/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-svelte4-requirements.json b/...s/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore01-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-input.svelte
@@ -1,7 +1,7 @@
 <div>
 	{#each [] as e}
 		A
-		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+		<!-- svelte-ignore a11y_label_has_associated_control a11y_no_noninteractive_tabindex -->
 	{:else}
 		<label tabindex="0">Click</label>
 		<ul tabindex="0"></ul>

diff --git a/.../fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-requirements.json b/.../fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/...ixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-svelte4-errors.yaml b/...ixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-svelte4-errors.yaml
@@ -0,0 +1,8 @@
+- message: svelte-ignore comment is used, but not warned
+  line: 4
+  column: 22
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 4
+  column: 56
+  suggestions: null
diff --git a/...xtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-svelte4-input.svelte b/...xtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-svelte4-input.svelte
@@ -0,0 +1,9 @@
+<div>
+	{#each [] as e}
+		A
+		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+	{:else}
+		<label tabindex="0">Click</label>
+		<ul tabindex="0"></ul>
+	{/each}
+</div>
diff --git a/...s/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-svelte4-requirements.json b/...s/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore02-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-input.svelte
@@ -1,18 +1,18 @@
 <div>
 	{#await Promise.resolve(42)}
-		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+		<!-- svelte-ignore a11y_label_has_associated_control a11y_no_noninteractive_tabindex -->
 	{:then name}
 		<label tabindex="0">Click</label>
 		<ul tabindex="0"></ul>
-		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+		<!-- svelte-ignore a11y_label_has_associated_control a11y_no_noninteractive_tabindex -->
 	{:catch name}
 		<label tabindex="0">Click</label>
 		<ul tabindex="0"></ul>
 	{/await}
 </div>
 <div>
 	{#await Promise.resolve(42)}
-		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+		<!-- svelte-ignore a11y_label_has_associated_control a11y_no_noninteractive_tabindex -->
 	{:then name}
 		<label tabindex="0">Click</label>
 		<ul tabindex="0"></ul>

diff --git a/.../fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-requirements.json b/.../fixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/...ixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-svelte4-errors.yaml b/...ixtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-svelte4-errors.yaml
@@ -0,0 +1,24 @@
+- message: svelte-ignore comment is used, but not warned
+  line: 3
+  column: 22
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 3
+  column: 56
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 7
+  column: 22
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 7
+  column: 56
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 15
+  column: 22
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 15
+  column: 56
+  suggestions: null
diff --git a/...xtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-svelte4-input.svelte b/...xtures/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-svelte4-input.svelte
@@ -0,0 +1,20 @@
+<div>
+	{#await Promise.resolve(42)}
+		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+	{:then name}
+		<label tabindex="0">Click</label>
+		<ul tabindex="0"></ul>
+		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+	{:catch name}
+		<label tabindex="0">Click</label>
+		<ul tabindex="0"></ul>
+	{/await}
+</div>
+<div>
+	{#await Promise.resolve(42)}
+		<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+	{:then name}
+		<label tabindex="0">Click</label>
+		<ul tabindex="0"></ul>
+	{/await}
+</div>
diff --git a/...s/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-svelte4-requirements.json b/...s/rules/no-unused-svelte-ignore/invalid/invalid-svelte-ignore03-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/script-comment01-errors.yaml b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/script-comment01-errors.yaml
@@ -1,3 +1,7 @@
+- message: svelte-ignore comment is used, but not warned
+  line: 4
+  column: 19
+  suggestions: null
 - message: svelte-ignore comment is used, but not warned
   line: 7
   column: 20

diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-input.svelte
@@ -2,18 +2,18 @@
 </script>
 
 <!-- ✓ GOOD -->
-<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<!-- svelte-ignore a11y_autofocus a11y_missing_attribute -->
 <img src="https://example.com/img.png" autofocus />
 
 <!-- ✗ BAD -->
-<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<!-- svelte-ignore a11y_autofocus a11y_missing_attribute -->
 <img src="https://example.com/img.png" alt="Foo" />
 
 <div class="foo">
 	<div class="bar" />
 </div>
 
-<!-- svelte-ignore css-unused-selector -->
+<!-- svelte-ignore css_unused_selector -->
 <style lang="postcss">
 	.foo {
 		height: 20px;

diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-svelte4-errors.yaml b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-svelte4-errors.yaml
@@ -0,0 +1,12 @@
+- message: svelte-ignore comment is used, but not warned
+  line: 9
+  column: 20
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 9
+  column: 35
+  suggestions: null
+- message: svelte-ignore comment is used, but not warned
+  line: 16
+  column: 20
+  suggestions: null
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-svelte4-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-svelte4-input.svelte
@@ -0,0 +1,26 @@
+<script>
+</script>
+
+<!-- ✓ GOOD -->
+<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<img src="https://example.com/img.png" autofocus />
+
+<!-- ✗ BAD -->
+<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<img src="https://example.com/img.png" alt="Foo" />
+
+<div class="foo">
+	<div class="bar" />
+</div>
+
+<!-- svelte-ignore css-unused-selector -->
+<style lang="postcss">
+	.foo {
+		height: 20px;
+		width: 20px;
+		& .bar {
+			height: 10px;
+			width: 10px;
+		}
+	}
+</style>
diff --git a/...s/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-svelte4-requirements.json b/...s/fixtures/rules/no-unused-svelte-ignore/invalid/transform-test-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/element-ignore01-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/element-ignore01-input.svelte
@@ -1,4 +1,4 @@
-<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
+<!-- svelte-ignore a11y_no_noninteractive_tabindex -->
 <span tabindex="0">
 	<span class="element"></span>
 </span>
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/element-ignore01-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/valid/element-ignore01-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/element-ignore01-svelte4-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/element-ignore01-svelte4-input.svelte
@@ -0,0 +1,4 @@
+<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
+<span tabindex="0">
+	<span class="element"></span>
+</span>
diff --git a/...s/fixtures/rules/no-unused-svelte-ignore/valid/element-ignore01-svelte4-requirements.json b/...s/fixtures/rules/no-unused-svelte-ignore/valid/element-ignore01-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/html-comment-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/html-comment-input.svelte
@@ -1,2 +1,2 @@
-<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<!-- svelte-ignore a11y_autofocus a11y_missing_attribute -->
 <img src="foo" autofocus />
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/html-comment-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/valid/html-comment-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/html-comment-svelte4-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/html-comment-svelte4-input.svelte
@@ -0,0 +1,2 @@
+<!-- svelte-ignore a11y-autofocus a11y-missing-attribute -->
+<img src="foo" autofocus />
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/html-comment-svelte4-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/valid/html-comment-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/script-comment-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/script-comment-input.svelte
@@ -1,8 +1,8 @@
 <script>
 	let count = $state(0);
 	let doubled = $derived(count * 2);
-	// svelte-ignore static-state-reference
+	// svelte-ignore state_referenced_locally
 	console.log(count);
-	// svelte-ignore static-state-reference
+	// svelte-ignore state_referenced_locally
 	console.log(doubled);
 </script>
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore01-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore01-input.svelte
@@ -1,4 +1,4 @@
-<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+<!-- svelte-ignore a11y_label_has_associated_control a11y_no_noninteractive_tabindex -->
 <div class="dropdown">
 	<label tabindex="0">Click</label>
 	<ul tabindex="0"></ul>

diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore01-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore01-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore01-svelte4-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore01-svelte4-input.svelte
@@ -0,0 +1,5 @@
+<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+<div class="dropdown">
+	<label tabindex="0">Click</label>
+	<ul tabindex="0"></ul>
+</div>
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore01-svelte4-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore01-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore02-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore02-input.svelte
@@ -1,5 +1,5 @@
-<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
 TEXT
+<!-- svelte-ignore a11y_label_has_associated_control a11y_no_noninteractive_tabindex -->
 <div class="dropdown">
 	<label tabindex="0">Click</label>
 	<ul tabindex="0"></ul>

diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore02-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore02-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": ">=5.0.0-0"
+}
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore02-svelte4-input.svelte b/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore02-svelte4-input.svelte
@@ -0,0 +1,6 @@
+<!-- svelte-ignore a11y-label-has-associated-control a11y-no-noninteractive-tabindex -->
+TEXT
+<div class="dropdown">
+	<label tabindex="0">Click</label>
+	<ul tabindex="0"></ul>
+</div>
diff --git a/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore02-svelte4-requirements.json b/tests/fixtures/rules/no-unused-svelte-ignore/valid/svelte-ignore02-svelte4-requirements.json
@@ -0,0 +1,3 @@
+{
+	"svelte": "^3.0.0 || ^4.0.0"
+}