Create rule S6846 (jsx-a11y/no-access-key): DOM elements should not…

… use the `accesskey` property (#4372)

its/ruling/src/test/expected/jsts/file-for-rules/javascript-S1451.json

@@ -192,11 +192,14 @@
 0
 ],
 "file-for-rules:S6840.js": [
- 0
+0
 ],
 "file-for-rules:S6843.js": [
 0
 ],
+"file-for-rules:S6846.js": [
+0
+],
 "file-for-rules:boundOrAssignedEvalOrArguments.js": [
 0
 ]

its/ruling/src/test/expected/jsts/file-for-rules/javascript-S3798.json

@@ -66,11 +66,14 @@
 2
 ],
 "file-for-rules:S6840.js": [
- 1
+1
 ],
 "file-for-rules:S6843.js": [
 1
 ],
+"file-for-rules:S6846.js": [
+1
+],
 "file-for-rules:boundOrAssignedEvalOrArguments.js": [
 2,
 8

its/ruling/src/test/expected/jsts/file-for-rules/javascript-S6747.json

@@ -1,5 +1,8 @@
 {
 "file-for-rules:S6840.js": [
 2
+],
+"file-for-rules:S6846.js": [
+2
 ]
 }

its/ruling/src/test/expected/jsts/file-for-rules/javascript-S6846.json

@@ -0,0 +1,5 @@
+{
+"file-for-rules:S6846.js": [
+2
+]
+}

its/sources/jsts/custom/S6846.js

@@ -0,0 +1,3 @@
+function div() {
+ return <div accesskey="h" />;
+}

sonar-plugin/javascript-checks/src/main/java/org/sonar/javascript/checks/CheckList.java

@@ -234,6 +234,7 @@ public static List<Class<? extends JavaScriptCheck>> getAllChecks() {
  NestedControlFlowDepthCheck.class,
  NewCapCheck.class,
  NewOperatorMisuseCheck.class,
+ NoAccessKeyCheck.class,
  NoAccessStateInSetstateCheck.class,
  NoAccessorFieldMismatchCheck.class,
  NoAngularBypassSanitizationCheck.class,

sonar-plugin/javascript-checks/src/main/java/org/sonar/javascript/checks/NoAccessKeyCheck.java

@@ -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;
+
+@JavaScriptRule
+@TypeScriptRule
+@Rule(key = "S6846")
+public class NoAccessKeyCheck implements EslintBasedCheck {
+
+ @Override
+ public String eslintKey() {
+ return "no-access-key";
+ }
+}

sonar-plugin/javascript-checks/src/main/resources/org/sonar/l10n/javascript/rules/javascript/S6846.html

@@ -0,0 +1,40 @@
+<h2>Why is this an issue?</h2>
+<p>The <code>accesskey</code> attribute, despite its potential utility, is fraught with numerous issues that limit its effectiveness and
+usability:</p>
+<ul>
+ <li> Screen readers' implementation of <code>accesskey</code> largely depends on the browser used, as they rely on browsers for much of their
+ functionality. Some screen readers may repeatedly indicate the <code>accesskey</code> value each time the element is encountered, potentially
+ causing unnecessary repetition and noise for the user. </li>
+ <li> Conflicts between <code>accesskey</code> shortcuts and other keyboard shortcuts, such as those of browsers, operating systems, assistive
+ technologies, or browser extensions, are frequent. This overlap can lead to uncertainty and potentially trigger unintended actions, causing user
+ confusion. </li>
+ <li> While keyboard shortcuts are vital for screen reader functionality, conflicts can disable either the screen reader or <code>accesskey</code>
+ shortcuts. Typically, screen reader shortcuts take precedence, disabling the <code>accesskey</code> but preserving screen reader functionality.
+ However, this can cause confusion for users attempting to activate an <code>accesskey</code>. </li>
+ <li> No keystroke combinations can guarantee zero conflicts with all browsers, assistive technologies, or operating systems, particularly
+ considering foreign languages. For instance, an <code>accesskey</code> shortcut that works in an English browser may conflict in the same browser
+ set in another language due to different menu naming conventions. </li>
+ <li> While using numerals instead of letters for keyboard shortcuts could reduce conflicts, it’s not a foolproof solution. There’s no standard
+ correlation between numbers and web functions, which could lead to user confusion. </li>
+ <li> Unlike the Windows environment that highlights keyboard shortcuts in menus, web pages or applications lack a standardized method to notify
+ users about available <code>accesskey</code> shortcuts. </li>
+</ul>
+<p>Given these concerns, it is generally recommended to avoid using `accesskey`s.</p>
+<pre data-diff-id="1" data-diff-type="noncompliant">
+function div() {
+ return &lt;div accessKey="h" /&gt;;
+}
+</pre>
+<p>Do not use `accesskey`s at all.</p>
+<pre data-diff-id="1" data-diff-type="compliant">
+function div() {
+ return &lt;div /&gt;;
+}
+</pre>
+<h2>Resources</h2>
+<h3>Documentation</h3>
+<ul>
+ <li> MDN web docs - <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/accesskey">accesskey</a> </li>
+ <li> MDN web docs - <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/accesskey">Accessibility concerns</a> </li>
+</ul>
+

sonar-plugin/javascript-checks/src/main/resources/org/sonar/l10n/javascript/rules/javascript/S6846.json

@@ -0,0 +1,29 @@
+{
+ "title": "DOM elements should not use the \"accesskey\" property",
+ "type": "CODE_SMELL",
+ "status": "ready",
+ "remediation": {
+ "func": "Constant\/Issue",
+ "constantCost": "5min"
+ },
+ "tags": [
+ "accessibility",
+ "react"
+ ],
+ "defaultSeverity": "Major",
+ "ruleSpecification": "RSPEC-6846",
+ "sqKey": "S6846",
+ "scope": "All",
+ "quickfix": "infeasible",
+ "code": {
+ "impacts": {
+ "MAINTAINABILITY": "LOW",
+ "RELIABILITY": "MEDIUM"
+ },
+ "attribute": "CONVENTIONAL"
+ },
+ "compatibleLanguages": [
+ "JAVASCRIPT",
+ "TYPESCRIPT"
+ ]
+}

sonar-plugin/javascript-checks/src/main/resources/org/sonar/l10n/javascript/rules/javascript/Sonar_way_profile.json

@@ -312,6 +312,7 @@
  "S6842",
  "S6843",
  "S6844",
- "S6845"
+ "S6845",
+ "S6846"
  ]
 }