fix: make dialog element and role interactive (#15429)

Fixes #8283

Also see jsx-eslint/eslint-plugin-jsx-a11y#932

Author: arty-name

.changeset/gentle-humans-call.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: make dialog element and role interactive

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

@@ -30,7 +30,7 @@ const non_interactive_roles = non_abstract_roles
 			// 'generic' is meant to have no semantic meaning.
 			// 'cell' is treated as CellRole by the AXObject which is interactive, so we treat 'cell' it as interactive as well.
 			!['toolbar', 'tabpanel', 'generic', 'cell'].includes(name) &&
-			!role?.superClass.some((classes) => classes.includes('widget'))
+			!role?.superClass.some((classes) => classes.includes('widget') || classes.includes('window'))
 		);
 	})
 	.concat(

packages/svelte/tests/validator/samples/a11y-no-noninteractive-element-interactions/input.svelte

@@ -3,6 +3,7 @@
 <div role="button" tabindex="-1" on:click={() => {}} on:keypress={() => {}}></div>
 <div role="listitem" aria-hidden="true" on:click={() => {}} on:keypress={() => {}}></div>
 <button on:click={() => {}}>click me</button>
+<dialog on:click={() => {}}>alert</dialog>
 <h1 contenteditable="true" on:keydown={() => {}}>Heading</h1>
 <h1>Heading</h1>
 

packages/svelte/tests/validator/samples/a11y-no-noninteractive-element-interactions/warnings.json

@@ -3,60 +3,60 @@
 		"code": "a11y_no_noninteractive_element_interactions",
 		"end": {
 			"column": 51,
-			"line": 10
+			"line": 11
 		},
 		"message": "Non-interactive element `<div>` should not be assigned mouse or keyboard event listeners",
 		"start": {
 			"column": 0,
-			"line": 10
+			"line": 11
 		}
 	},
 	{
 		"code": "a11y_no_noninteractive_element_interactions",
 		"end": {
 			"column": 58,
-			"line": 11
+			"line": 12
 		},
 		"message": "Non-interactive element `<h1>` should not be assigned mouse or keyboard event listeners",
 		"start": {
 			"column": 0,
-			"line": 11
+			"line": 12
 		}
 	},
 	{
 		"code": "a11y_no_noninteractive_element_interactions",
 		"end": {
 			"column": 50,
-			"line": 12
+			"line": 13
 		},
 		"message": "Non-interactive element `<h1>` should not be assigned mouse or keyboard event listeners",
 		"start": {
 			"column": 0,
-			"line": 12
+			"line": 13
 		}
 	},
 	{
 		"code": "a11y_no_noninteractive_element_interactions",
 		"end": {
 			"column": 30,
-			"line": 13
+			"line": 14
 		},
 		"message": "Non-interactive element `<p>` should not be assigned mouse or keyboard event listeners",
 		"start": {
 			"column": 0,
-			"line": 13
+			"line": 14
 		}
 	},
 	{
 		"code": "a11y_no_noninteractive_element_interactions",
 		"end": {
 			"column": 50,
-			"line": 14
+			"line": 15
 		},
 		"message": "Non-interactive element `<div>` should not be assigned mouse or keyboard event listeners",
 		"start": {
 			"column": 0,
-			"line": 14
+			"line": 15
 		}
 	}
 ]