diff --git a/docs/rules/no-onchange.md b/docs/rules/no-onchange.md index a1835a71..101631fe 100644 --- a/docs/rules/no-onchange.md +++ b/docs/rules/no-onchange.md @@ -1,5 +1,9 @@ # no-onchange +::: warning Deprecated +This rule is based on reports of behavior of [old browsers (eg. IE 10 and below)](https://www.quirksmode.org/dom/events/change.html#t05). In the meantime, this behavior has been corrected, both in newer versions of browsers as well as [in the DOM spec](https://bugzilla.mozilla.org/show_bug.cgi?id=969068#c2). +::: + Enforce usage of `@blur` over/in parallel with `@change` on select menu elements for accessibility. `@blur` **should** be used instead of `@change`, unless absolutely necessary and it causes no negative consequences for keyboard only or screen reader users. `@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 `@change` event in some browsers. Regardless, when a change of context results from an `@blur` event or an `@change` event, the user should be notified of the change unless it occurs below the currently focused element. ## 🔧 Options diff --git a/src/configs/recommended.ts b/src/configs/recommended.ts index 3297d766..47ec21e1 100644 --- a/src/configs/recommended.ts +++ b/src/configs/recommended.ts @@ -28,7 +28,6 @@ const recommended: Linter.BaseConfig = { "vuejs-accessibility/no-access-key": "error", "vuejs-accessibility/no-autofocus": "error", "vuejs-accessibility/no-distracting-elements": "error", - "vuejs-accessibility/no-onchange": "error", "vuejs-accessibility/no-redundant-roles": "error", "vuejs-accessibility/no-static-element-interactions": "error", "vuejs-accessibility/role-has-required-aria-props": "error", diff --git a/src/rules/no-onchange.ts b/src/rules/no-onchange.ts index b85f73fb..6c1f399f 100644 --- a/src/rules/no-onchange.ts +++ b/src/rules/no-onchange.ts @@ -10,6 +10,7 @@ import { const rule: Rule.RuleModule = { meta: { type: "problem", + deprecated: true, docs: { url: makeDocsURL("no-onchange") },