Javascript: about react-a11y

[malin1988]

I want to use your default configs without react-a11y included, what should i do?

[ljharb]

If you're not using react, use https://npmjs.com/eslint-config-airbnb-base.

If you are using react, why would you not want react-a11y?

[bastoune]

Hi @ljharb , I have the same issue as malin.

The reason for me is that I have a huge project in which I can't put errors in every files, I don't want my developres to commit scuicide. We want to improve our code style, but step by step.

At least, I would like to put it in wanr, not in error.

I tried to override it with
"jsx-a11y/no-static-element-interactions": "off",
Or

"jsx-a11y/no-static-element-interactions": "warn",
Or
"jsx-a11y/no-static-element-interactions": [ "warn", { "handlers": [ "onClick", "onMouseDown", "onMouseUp", "onKeyPress", "onKeyDown", "onKeyUp" ] } ],

But nothing seems to work

[ljharb]

@bastoune I'm not sure what specific issue you're having, but putting "jsx-a11y/no-static-element-interactions": "warn", in your root .eslintrc should definitely work for your entire project (unless you have nested eslintrc files that are extending "airbnb"). Please file a new issue if you're still having trouble.

I'm going to close this one, since it seems answered.

[atif089]

+1 to @bastoune .

I was wondering if there is a way to temporarily disable all the jsx-a11y rules. It would be great to have a config which I can use to have all the rules minus jsx-a11y

[ljharb]

I’m having a hard time understanding the use case where you want to lint your code but you don’t want it to be accessible?

[atif089]

When I have a big existing app and do not have the budget to make it accessible yet like internal products

[ljharb]

I'm sure that you already pass some of the rules in some places - it'd be much easier on your future budget to enable all the rules, but add overrides to permit all current violations, rather than allowing new violations to continue creeping in :-)

[oustn]

Maybe you can do like this:

'extends': [ 'airbnb-base', 'airbnb/rules/react' ],

[fotonmoton]

@oustn, thanks, your solution works for me.

[benfletcher]

@ljharb FWIW, I'm using React in a CLI app (using Ink) and the a11y rules have very little application there, so this solution is great. Accessibility in CLI apps is an issue, it's just that the a11y rules don't really help much when React is rendered in that context.

[gravitypersists]

I’m having a hard time understanding the use case where you want to lint your code but you don’t want it to be accessible?

This eslint configuration is perhaps the most popular configuration within the universe of react and you can't understand why somebody would be building a UI where a11y isn't a concern?

There's many reasons why somebody isn't concerned about a11y. I'm building internal software tools for a small subset of scientists, for example.

[ljharb]

@gravitypersists you still have a legal and an ethical obligation to ensure that whether you have a scientist who needs accommodations or not, that you be capable of hiring one. There does not exist a use case where a11y isn't a concern - whether ethical, or legal/financial. If you think there is, you're deluding yourself.

[gravitypersists]

cool opinion. nice horse. not all UI is standard web forms and inputs. :/ Aim for breadth with a tool like this, not some ulterior sense of ethical compass.

[ljharb]

If it’s in a browser and built with html, it should be.