WebAIM - Web Accessibility In Mind

E-mail List Archives

[eslint] [react] onchange issue in new browsers

for

From:
Date: Mar 31, 2017 5:11AM

Hi!

I am enabling an accessibility plugin for my eslint in a react project.
The plugin is this one https://github.com/evcohen/eslint-plugin-jsx-a11y

And i have a problem with the rule: jsx-a11y/no-onchange. I had the
description of the rule from the project:

*Enforce usage of onBlur over/in parallel with onChange on select menu
elements for accessibility. onBlur should be used instead of onChange,
unless absolutely necessary and it causes no negative consequences for
keyboard only or screen reader users. onBlur is a more declarative action
by the user: for instance in a dropdown, using the arrow keys to toggle
between options will trigger the onChange event in some browsers.
Regardless, when a change of context results from an onBlur event or an
onChange event, the user should be notified of the change unless it occurs
below the currently focused element.*

I know that the explanation is very good but I feel like this is a old
browser issue. Where the select execute the onchage when you are using the
arrow key to pic your selection.

The question is:
am I wrong and i should enforce this rule?
I prefer to document the scenarios where this is wrong instead of enforce a
rule. But if this is wrong in the most cases, let's enforce the rule.