Remove deprecated a11y-no-onchange warning (#6457)

Author: geoffrich

site/content/docs/05-accessibility-warnings.md

@@ -191,25 +191,6 @@ Enforce that heading elements (`h1`, `h2`, etc.) and anchors have content and th
 
 ---
 
-### `a11y-no-onchange`
-
-Enforce usage of `on:blur` over/in parallel with `on:change` on select menu elements for accessibility. `on:blur` should be used instead of `on:change`, unless absolutely necessary and it causes no negative consequences for keyboard only or screen reader users. `on:blur` is a more declarative action by the user: for instance in a dropdown, using the arrow keys to toggle between options will trigger the `on:change` event in some browsers. Regardless, when a change of context results from an `on:blur` event or an `on:change` event, the user should be notified of the change unless it occurs below the currently focused element.
-
-```sv
-<select on:change={e => {}} on:blur={e => {}}>
-    <option>foo</option>
-    <option>bar</option>
-</select>
-
-<!-- A11y: on:blur must be used instead of on:change, unless absolutely necessary and it causes no negative consequences for keyboard only or screen reader users. -->
-<select on:change={e => {}}>
-    <option>foo</option>
-    <option>bar</option>
-</select>
-```
-
----
-
 ### `a11y-positive-tabindex`
 
 Avoid positive `tabIndex` property values to synchronize the flow of the page with keyboard tab order.

site/src/routes/tutorial/[slug]/_TableOfContents.svelte

@@ -77,7 +77,6 @@
 			{selected.chapter.title}
 		</span>
 
-		<!-- svelte-ignore a11y-no-onchange -->
 		<select value={slug} on:change={navigate}>
 			{#each sections as section, i}
 				<optgroup label="{i + 1}. {section.title}">

src/compiler/compile/nodes/Element.ts

@@ -57,11 +57,6 @@ const a11y_required_content = new Set([
 	'h6'
 ]);
 
-const a11y_no_onchange = new Set([
-	'select',
-	'option'
-]);
-
 const a11y_labelable = new Set([
 	'button',
 	'input',
@@ -435,19 +430,14 @@ export default class Element extends Node {
 
 
 	validate_special_cases() {
-		const { component, attributes, handlers } = this;
+		const { component, attributes } = this;
 
 		const attribute_map = new Map();
-		const handlers_map = new Map();
 
 		attributes.forEach(attribute => (
 			attribute_map.set(attribute.name, attribute)
 		));
 
-		handlers.forEach(handler => (
-			handlers_map.set(handler.name, handler)
-		));
-
 		if (this.name === 'a') {
 			const href_attribute = attribute_map.get('href') || attribute_map.get('xlink:href');
 			const id_attribute = attribute_map.get('id');
@@ -543,15 +533,6 @@ export default class Element extends Node {
 			}
 		}
 
-		if (a11y_no_onchange.has(this.name)) {
-			if (handlers_map.has('change') && !handlers_map.has('blur')) {
-				component.warn(this, {
-					code: 'a11y-no-onchange',
-					message: 'A11y: on:blur must be used instead of on:change, unless absolutely necessary and it causes no negative consequences for keyboard only or screen reader users.'
-				});
-			}
-		}
-
 		if (a11y_distracting_elements.has(this.name)) {
 			// no-distracting-elements
 			component.warn(this, {