Merge 4e76efacb4 into 8fb7ceeba5

.changeset/green-tables-warn.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: warn on click handlers for table row and cell elements

packages/svelte/src/compiler/phases/2-analyze/visitors/shared/a11y/index.js

@@ -613,6 +613,12 @@ function has_disabled_attribute(attribute_map) {
  * @returns {typeof ElementInteractivity[keyof typeof ElementInteractivity]}
  */
 function element_interactivity(tag_name, attribute_map) {
+	if (tag_name === 'tr' || tag_name === 'td' || tag_name === 'th') {
+		return attribute_map.has('role')
+			? ElementInteractivity.Static
+			: ElementInteractivity.NonInteractive;
+	}
+
 	if (
 		interactive_element_role_schemas.some((schema) => match_schema(schema, tag_name, attribute_map))
 	) {

packages/svelte/tests/validator/samples/a11y-click-events-have-key-events/input.svelte

@@ -26,6 +26,12 @@
 <footer on:click={noop}></footer>
 <!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
 <footer on:click={noop}></footer>
+<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
+<tr on:click={noop}></tr>
+<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
+<td on:click={noop}></td>
+<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
+<th on:click={noop}></th>
 
 <!-- should not warn -->
 <div class="foo"></div>

packages/svelte/tests/validator/samples/a11y-click-events-have-key-events/warnings.json

@@ -94,5 +94,41 @@
 			"line": 28,
 			"column": 33
 		}
+	},
+	{
+		"code": "a11y_click_events_have_key_events",
+		"message": "Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as `<button type=\"button\">` or `<a>` might be more appropriate",
+		"start": {
+			"line": 30,
+			"column": 0
+		},
+		"end": {
+			"line": 30,
+			"column": 25
+		}
+	},
+	{
+		"code": "a11y_click_events_have_key_events",
+		"message": "Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as `<button type=\"button\">` or `<a>` might be more appropriate",
+		"start": {
+			"line": 32,
+			"column": 0
+		},
+		"end": {
+			"line": 32,
+			"column": 25
+		}
+	},
+	{
+		"code": "a11y_click_events_have_key_events",
+		"message": "Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as `<button type=\"button\">` or `<a>` might be more appropriate",
+		"start": {
+			"line": 34,
+			"column": 0
+		},
+		"end": {
+			"line": 34,
+			"column": 25
+		}
 	}
 ]

packages/svelte/tests/validator/samples/a11y-no-interactive-element-to-noninteractive-role/warnings.json

@@ -683,18 +683,6 @@
 			"line": 146
 		}
 	},
-	{
-		"code": "a11y_no_interactive_element_to_noninteractive_role",
-		"end": {
-			"column": 25,
-			"line": 147
-		},
-		"message": "`<tr>` cannot have role 'listitem'",
-		"start": {
-			"column": 0,
-			"line": 147
-		}
-	},
 	{
 		"code": "a11y_no_interactive_element_to_noninteractive_role",
 		"end": {