feat(rules): split button name rule into button only and button input…

… rules (#1615)
dequelabs · Jun 7, 2019 · ce20fbf · ce20fbf
1 parent 14ed6dc
commit ce20fbf
Show file tree

Hide file tree

Showing 7 changed files with 42 additions and 17 deletions.
diff --git a/doc/rule-descriptions.md b/doc/rule-descriptions.md
@@ -19,7 +19,7 @@
 | autocomplete-valid                  | Ensure the autocomplete attribute is correct and suitable for the form field                                               | Serious            | cat.forms, wcag21aa, wcag135                                                 | true               |
 | avoid-inline-spacing                | Ensure that text spacing set through style attributes can be adjusted with custom stylesheets                              | Serious            | wcag21, wcag1412                                                             | true               |
 | blink                               | Ensures &lt;blink&gt; elements are not used                                                                                | Serious            | cat.time-and-media, wcag2a, wcag222, section508, section508.22.j             | true               |
-| button-name                         | Ensures buttons have discernible text                                                                                      | Serious, Critical  | cat.name-role-value, wcag2a, wcag412, section508, section508.22.a            | true               |
+| button-name                         | Ensures buttons have discernible text                                                                                      | Critical           | cat.name-role-value, wcag2a, wcag412, section508, section508.22.a            | true               |
 | bypass                              | Ensures each page has at least one mechanism for a user to bypass navigation and jump straight to the content              | Serious            | cat.keyboard, wcag2a, wcag241, section508, section508.22.o                   | true               |
 | checkboxgroup                       | Ensures related &lt;input type=&quot;checkbox&quot;&gt; elements have a group and that the group designation is consistent | Critical           | cat.forms, best-practice                                                     | true               |
 | color-contrast                      | Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds                    | Serious            | cat.color, wcag2aa, wcag143                                                  | true               |
@@ -43,6 +43,7 @@
 | html-xml-lang-mismatch              | Ensure that HTML elements with both valid lang and xml:lang attributes agree on the base language of the page              | Moderate           | cat.language, wcag2a, wcag311                                                | true               |
 | image-alt                           | Ensures &lt;img&gt; elements have alternate text or a role of none or presentation                                         | Critical           | cat.text-alternatives, wcag2a, wcag111, section508, section508.22.a          | true               |
 | image-redundant-alt                 | Ensure button and link text is not repeated as image alternative                                                           | Minor              | cat.text-alternatives, best-practice                                         | true               |
+| input-button-name                   | Ensures input buttons have discernible text                                                                                | Critical           | cat.name-role-value, wcag2a, wcag412, section508, section508.22.a            | true               |
 | input-image-alt                     | Ensures &lt;input type=&quot;image&quot;&gt; elements have alternate text                                                  | Critical           | cat.text-alternatives, wcag2a, wcag111, section508, section508.22.a          | true               |
 | label-content-name-mismatch         | Ensures that elements labelled through their content must have their visible text as part of their accessible name         | Serious            | wcag21a, wcag253, experimental                                               | true               |
 | label-title-only                    | Ensures that every form element is not solely labeled using the title or aria-describedby attributes                       | Serious            | cat.forms, best-practice                                                     | true               |

diff --git a/lib/rules/button-name.json b/lib/rules/button-name.json
@@ -1,6 +1,6 @@
 {
 	"id": "button-name",
-	"selector": "button, [role=\"button\"], input[type=\"button\"], input[type=\"submit\"], input[type=\"reset\"]",
+	"selector": "button, [role=\"button\"]",
 	"tags": [
 		"cat.name-role-value",
 		"wcag2a",
@@ -14,14 +14,12 @@
 	},
 	"all": [],
 	"any": [
-		"non-empty-if-present",
-		"non-empty-value",
 		"button-has-visible-text",
 		"aria-label",
 		"aria-labelledby",
 		"role-presentation",
 		"role-none",
 		"non-empty-title"
 	],
-	"none": ["focusable-no-name"]
+	"none": []
 }
diff --git a/lib/rules/input-button-name.json b/lib/rules/input-button-name.json
@@ -0,0 +1,26 @@
+{
+	"id": "input-button-name",
+	"selector": "input[type=\"button\"], input[type=\"submit\"], input[type=\"reset\"]",
+	"tags": [
+		"cat.name-role-value",
+		"wcag2a",
+		"wcag412",
+		"section508",
+		"section508.22.a"
+	],
+	"metadata": {
+		"description": "Ensures input buttons have discernible text",
+		"help": "Input buttons must have discernible text"
+	},
+	"all": [],
+	"any": [
+		"non-empty-if-present",
+		"non-empty-value",
+		"aria-label",
+		"aria-labelledby",
+		"role-presentation",
+		"role-none",
+		"non-empty-title"
+	],
+	"none": []
+}
diff --git a/test/integration/rules/button-name/button-name.html b/test/integration/rules/button-name/button-name.html
@@ -10,4 +10,4 @@
 <div id="emptydiv"></div>
 <button id="combo" aria-label="Aria Name">Name</button>
 <button id="buttonTitle" title="Title"></button>
-<input id="inputTitle" title="Search" type="button" />
+<button id="buttonvalue" value="foo" tabindex="-1"></button>
diff --git a/test/integration/rules/button-name/button-name.json b/test/integration/rules/button-name/button-name.json
@@ -6,14 +6,8 @@
 		["#val"],
 		["#alempty"],
 		["#albmissing"],
-		["#albempty"]
+		["#albempty"],
+		["#buttonvalue"]
 	],
-	"passes": [
-		["#text"],
-		["#al"],
-		["#alb"],
-		["#combo"],
-		["#buttonTitle"],
-		["#inputTitle"]
-	]
+	"passes": [["#text"], ["#al"], ["#alb"], ["#combo"], ["#buttonTitle"]]
 }
diff --git a/test/integration/rules/input-button-name/input-button-name.html b/test/integration/rules/input-button-name/input-button-name.html
@@ -15,4 +15,7 @@
 	<input type="reset" id="pass7" />
 	<input type="reset" value="" id="fail6" />
 	<input type="reset" value="Something" id="pass8" />
+	<input type="button" title="Something" id="pass9" />
+	<input type="submit" title="Something" id="pass10" />
+	<input type="reset" title="Something" id="pass11" />
 </form>
diff --git a/test/integration/rules/input-button-name/input-button-name.json b/test/integration/rules/input-button-name/input-button-name.json
@@ -1,6 +1,6 @@
 {
 	"description": "input-button-name test",
-	"rule": "button-name",
+	"rule": "input-button-name",
 	"violations": [
 		["#fail1"],
 		["#fail2"],
@@ -17,6 +17,9 @@
 		["#pass5"],
 		["#pass6"],
 		["#pass7"],
-		["#pass8"]
+		["#pass8"],
+		["#pass9"],
+		["#pass10"],
+		["#pass11"]
 	]
 }