-
Notifications
You must be signed in to change notification settings - Fork 181
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add rule S6825 (
jsx-a11y/no-aria-hidden-on-focusable
): Focusable el…
…ements should not have `aria-hidden` attribute (#4292)
- Loading branch information
1 parent
0ef5749
commit c03babc
Showing
6 changed files
with
105 additions
and
1 deletion.
There are no files selected for viewing
5 changes: 5 additions & 0 deletions
5
its/ruling/src/test/expected/jsts/vuetify/typescript-S6825.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
{ | ||
"vuetify:packages/vuetify/src/components/VTextarea/VTextarea.tsx": [ | ||
277 | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
36 changes: 36 additions & 0 deletions
36
...script-checks/src/main/java/org/sonar/javascript/checks/NoAriaHiddenOnFocusableCheck.java
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
/** | ||
* SonarQube JavaScript Plugin | ||
* Copyright (C) 2011-2023 SonarSource SA | ||
* mailto:info AT sonarsource DOT com | ||
* | ||
* This program is free software; you can redistribute it and/or | ||
* modify it under the terms of the GNU Lesser General Public | ||
* License as published by the Free Software Foundation; either | ||
* version 3 of the License, or (at your option) any later version. | ||
* | ||
* This program is distributed in the hope that it will be useful, | ||
* but WITHOUT ANY WARRANTY; without even the implied warranty of | ||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU | ||
* Lesser General Public License for more details. | ||
* | ||
* You should have received a copy of the GNU Lesser General Public License | ||
* along with this program; if not, write to the Free Software Foundation, | ||
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | ||
*/ | ||
package org.sonar.javascript.checks; | ||
|
||
import org.sonar.check.Rule; | ||
import org.sonar.plugins.javascript.api.EslintBasedCheck; | ||
import org.sonar.plugins.javascript.api.JavaScriptRule; | ||
import org.sonar.plugins.javascript.api.TypeScriptRule; | ||
|
||
@TypeScriptRule | ||
@JavaScriptRule | ||
@Rule(key = "S6825") | ||
public class NoAriaHiddenOnFocusableCheck implements EslintBasedCheck { | ||
|
||
@Override | ||
public String eslintKey() { | ||
return "no-aria-hidden-on-focusable"; | ||
} | ||
} |
33 changes: 33 additions & 0 deletions
33
...avascript-checks/src/main/resources/org/sonar/l10n/javascript/rules/javascript/S6825.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
<h2>Why is this an issue?</h2> | ||
<p>ARIA (Accessible Rich Internet Applications) is a set of attributes that define ways to make web content and web applications more accessible to | ||
people with disabilities. The 'aria-hidden' attribute is used to indicate that an element and all of its descendants are not visible or perceivable to | ||
any user as implemented by assistive technologies.</p> | ||
<p>However, when 'aria-hidden' is used on a focusable element, it can create a confusing and inaccessible experience for screen reader users. This is | ||
because the element will still be included in the tab order, so a screen reader user can navigate to it, but it will not be announced by the screen | ||
reader due to the 'aria-hidden' attribute.</p> | ||
<p>This rule ensures that focusable elements are not hidden from screen readers using the 'aria-hidden' attribute.</p> | ||
<h2>How to fix it</h2> | ||
<p>Check if the element is focusable. Focusable elements should not have 'aria-hidden' attribute.</p> | ||
<h3>Code examples</h3> | ||
<h4>Noncompliant code example</h4> | ||
<pre data-diff-id="1" data-diff-type="noncompliant"> | ||
<button aria-hidden="true">Click me</button> | ||
</pre> | ||
<p>Remove 'aria-hidden' attribute.</p> | ||
<h4>Compliant solution</h4> | ||
<pre data-diff-id="1" data-diff-type="compliant"> | ||
<button>Click me</button> | ||
</pre> | ||
<h2>Resources</h2> | ||
<h3>Documentation</h3> | ||
<ul> | ||
<li> <a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques">MDN - Using ARIA: Roles, states, and properties</a> | ||
</li> | ||
<li> <a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden">MDN - aria-hidden attribute (Reference)</a> | ||
</li> | ||
</ul> | ||
<h3>Standards</h3> | ||
<ul> | ||
<li> <a href="https://www.w3.org/TR/wai-aria-1.2/">W3C - Accessible Rich Internet Applications (WAI-ARIA) 1.2</a> </li> | ||
</ul> | ||
|
28 changes: 28 additions & 0 deletions
28
...avascript-checks/src/main/resources/org/sonar/l10n/javascript/rules/javascript/S6825.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
{ | ||
"title": "Focusable elements should not have \"aria-hidden\" attribute", | ||
"type": "CODE_SMELL", | ||
"status": "ready", | ||
"remediation": { | ||
"func": "Constant\/Issue", | ||
"constantCost": "5min" | ||
}, | ||
"tags": [ | ||
"a11y", | ||
"react" | ||
], | ||
"defaultSeverity": "Major", | ||
"ruleSpecification": "RSPEC-6825", | ||
"sqKey": "S6825", | ||
"scope": "All", | ||
"quickfix": "targeted", | ||
"code": { | ||
"impacts": { | ||
"RELIABILITY": "MEDIUM" | ||
}, | ||
"attribute": "CONVENTIONAL" | ||
}, | ||
"compatibleLanguages": [ | ||
"JAVASCRIPT", | ||
"TYPESCRIPT" | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -298,6 +298,7 @@ | |
"S6821", | ||
"S6822", | ||
"S6823", | ||
"S6824" | ||
"S6824", | ||
"S6825" | ||
] | ||
} |