From a422950ed55aee1b20e00e3c94e7124b9debb400 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 12 Oct 2023 14:12:47 +0200
Subject: [PATCH] Create rule S6793: ARIA properties in DOM elements should
 have valid values (#3200)

You can preview this rule
[here](https://sonarsource.github.io/rspec/#/rspec/S6793/javascript)
(updated a few minutes after each push).
---
 rules/S6793/javascript/metadata.json  | 26 ++++++++++++++++++++++
 rules/S6793/javascript/rule.adoc      | 31 +++++++++++++++++++++++++++
 rules/S6793/metadata.json             |  2 ++
 rules/S6807/javascript/rule.adoc      |  4 ++--
 shared_content/jsts/aria-intro-1.adoc |  1 +
 5 files changed, 62 insertions(+), 2 deletions(-)
 create mode 100644 rules/S6793/javascript/metadata.json
 create mode 100644 rules/S6793/javascript/rule.adoc
 create mode 100644 rules/S6793/metadata.json
 create mode 100644 shared_content/jsts/aria-intro-1.adoc

diff --git a/rules/S6793/javascript/metadata.json b/rules/S6793/javascript/metadata.json
new file mode 100644
index 0000000000..f4120fc4d4
--- /dev/null
+++ b/rules/S6793/javascript/metadata.json
@@ -0,0 +1,26 @@
+{
+  "title": "ARIA properties in DOM elements should have valid values",
+  "type": "CODE_SMELL",
+  "status": "ready",
+  "remediation": {
+    "func": "Constant\/Issue",
+    "constantCost": "5min"
+  },
+  "tags": [
+    "react",
+    "a11y"
+  ],
+  "defaultSeverity": "Major",
+  "ruleSpecification": "RSPEC-6793",
+  "sqKey": "S6793",
+  "scope": "All",
+  "defaultQualityProfiles": ["Sonar way"],
+  "quickfix": "infeasible",
+  "code": {
+    "impacts": {
+      "MAINTAINABILITY": "LOW",
+      "RELIABILITY": "MEDIUM"
+    },
+    "attribute": "LOGICAL"
+  }
+}
diff --git a/rules/S6793/javascript/rule.adoc b/rules/S6793/javascript/rule.adoc
new file mode 100644
index 0000000000..cd335deb06
--- /dev/null
+++ b/rules/S6793/javascript/rule.adoc
@@ -0,0 +1,31 @@
+== Why is this an issue?
+
+include::../../../shared_content/jsts/aria-intro-1.adoc[]
+
+This rule checks that the values of ARIA attributes "aria-*" in DOM elements are valid.
+
+== How to fix it in JSX
+
+Check that each element with a defined ARIA attribute has a valid value.
+
+[source,javascript,diff-id=1,diff-type=noncompliant]
+----
+<span aria-hidden="ok">foo</span>
+----
+
+To fix the code use a valid value for the aria-* attribute.
+
+[source,javascript,diff-id=1,diff-type=compliant]
+----
+<span aria-hidden="true">foo</span>
+----
+
+== Resources
+=== Documentation
+
+* https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques[MDN - Using ARIA: Roles, states, and properties]
+* https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes[MDN - ARIA states and properties (Reference)]
+
+=== Standards
+
+* https://www.w3.org/TR/wai-aria-1.2/[W3C - Accessible Rich Internet Applications (WAI-ARIA) 1.2]
diff --git a/rules/S6793/metadata.json b/rules/S6793/metadata.json
new file mode 100644
index 0000000000..2c63c08510
--- /dev/null
+++ b/rules/S6793/metadata.json
@@ -0,0 +1,2 @@
+{
+}
diff --git a/rules/S6807/javascript/rule.adoc b/rules/S6807/javascript/rule.adoc
index f3fc245919..a8a5246aed 100644
--- a/rules/S6807/javascript/rule.adoc
+++ b/rules/S6807/javascript/rule.adoc
@@ -1,12 +1,12 @@
 == Why is this an issue?
 
-ARIA (Accessible Rich Internet Applications) attributes are used to enhance the accessibility of web content and web applications. These attributes provide additional information about an element's role, state, properties, and values to assistive technologies like screen readers.
+include::../../../shared_content/jsts/aria-intro-1.adoc[]
 
 Each role in ARIA has a set of required attributes that must be included for the role to be properly understood by assistive technologies. These attributes are known as "required aria-* properties".
 
 For example, if an element has a role of "checkbox", it must also include the aria-checked property. This property indicates whether the checkbox is checked (true), unchecked (false), or in a mixed state (mixed).
 
-This rules checks that each element with a defined ARIA role also has all required attributes.
+This rule checks that each element with a defined ARIA role also has all required attributes.
 
 == How to fix it in JSX
 
diff --git a/shared_content/jsts/aria-intro-1.adoc b/shared_content/jsts/aria-intro-1.adoc
new file mode 100644
index 0000000000..ff638b9cd8
--- /dev/null
+++ b/shared_content/jsts/aria-intro-1.adoc
@@ -0,0 +1 @@
+ARIA (Accessible Rich Internet Applications) attributes are used to enhance the accessibility of web content and web applications. These attributes provide additional information about an element's role, state, properties, and values to assistive technologies like screen readers.