Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add rule S6827 (jsx-a11y/anchor-has-content): Anchors should contain accessible content #4296

Merged
merged 9 commits into from
Oct 19, 2023
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"ant-design:components/dropdown/__tests__/index.test.js": [
125
]
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"ant-design:components/badge/__tests__/index.test.tsx": [
142,
145,
148
]
}
25 changes: 25 additions & 0 deletions its/ruling/src/test/expected/jsts/sonar-web/javascript-S6827.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
{
ilia-kebets-sonarsource marked this conversation as resolved.
Show resolved Hide resolved
"sonar-web:src/main/js/apps/background-tasks/stats.js": [
40
],
"sonar-web:src/main/js/apps/background-tasks/tasks.js": [
88
],
"sonar-web:src/main/js/apps/global-permissions/permission-groups.js": [
10
],
"sonar-web:src/main/js/apps/global-permissions/permission-users.js": [
10
],
"sonar-web:src/main/js/apps/permission-templates/permission-template.js": [
77,
85
],
"sonar-web:src/main/js/apps/project-permissions/project.js": [
54,
62
],
"sonar-web:src/main/js/components/shared/checkbox.js": [
35
]
}
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 = "S6827")
public class AnchorHasContentCheck implements EslintBasedCheck {

@Override
public String eslintKey() {
return "anchor-has-content";
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,7 @@ public static List<Class<? extends JavaScriptCheck>> getAllChecks() {
AlertUseCheck.class,
AlphabeticalSortCheck.class,
AlwaysUseCurlyBracesCheck.class,
AnchorHasContentCheck.class,
AnchorPrecedenceCheck.class,
AngleBracketTypeAssertionCheck.class,
ArgumentTypesCheck.class,
Expand Down
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">
&lt;button aria-hidden="true"&gt;Click me&lt;/button&gt;
</pre>
<p>Remove 'aria-hidden' attribute.</p>
<h4>Compliant solution</h4>
<pre data-diff-id="1" data-diff-type="compliant">
&lt;button&gt;Click me&lt;/button&gt;
</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>

Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
{
"title": "Anchors should contain accessible content",
"type": "CODE_SMELL",
"status": "ready",
"remediation": {
"func": "Constant\/Issue",
"constantCost": "5min"
},
"tags": [
"react",
"accessibility"
],
"defaultSeverity": "Minor",
"ruleSpecification": "RSPEC-6827",
"sqKey": "S6827",
"scope": "All",
"defaultQualityProfiles": ["Sonar way"],
"quickfix": "infeasible",
"code": {
"impacts": {
"MAINTAINABILITY": "LOW",
"RELIABILITY": "LOW"
},
"attribute": "CONVENTIONAL"
},
"compatibleLanguages": [
"JAVASCRIPT",
"TYPESCRIPT"
]
}
Original file line number Diff line number Diff line change
Expand Up @@ -299,6 +299,7 @@
"S6822",
"S6823",
"S6824",
"S6825"
"S6825",
"S6827"
]
}