fix(docs/rules): add missing category tags to rules metadata (#2569)

Add category tags to the rules that were missing them.
Add validation to check during a build for the inclusion of a category on the rule metadata.

Closes issue #2554

Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com>

build/tasks/validate.js

@@ -198,6 +198,10 @@ function createSchemas() {
 				type: 'array',
 				items: {
 					type: 'string'
+				},
+				conform: function hasCategoryTag(tags) { return tags.some(tag => tag.includes('cat.')) },
+				messages: {
+					conform: 'must include a category tag'
 				}
 			},
 			matches: {

lib/rules/accesskeys.json

@@ -2,7 +2,7 @@
 	"id": "accesskeys",
 	"selector": "[accesskey]",
 	"excludeHidden": false,
-	"tags": ["best-practice", "cat.keyboard"],
+	"tags": ["cat.keyboard", "best-practice"],
 	"metadata": {
 		"description": "Ensures every accesskey attribute value is unique",
 		"help": "accesskey attribute value must be unique"

lib/rules/aria-input-field-name.json

@@ -2,7 +2,7 @@
 	"id": "aria-input-field-name",
 	"selector": "[role=\"combobox\"], [role=\"listbox\"], [role=\"searchbox\"], [role=\"slider\"], [role=\"spinbutton\"], [role=\"textbox\"]",
 	"matches": "aria-form-field-name-matches",
-	"tags": ["wcag2a", "wcag412"],
+	"tags": ["cat.aria", "wcag2a", "wcag412"],
 	"metadata": {
 		"description": "Ensures every ARIA input field has an accessible name",
 		"help": "ARIA input fields must have an accessible name"

lib/rules/aria-toggle-field-name.json

@@ -2,7 +2,7 @@
 	"id": "aria-toggle-field-name",
 	"selector": "[role=\"checkbox\"], [role=\"menuitemcheckbox\"], [role=\"menuitemradio\"], [role=\"radio\"], [role=\"switch\"]",
 	"matches": "aria-form-field-name-matches",
-	"tags": ["wcag2a", "wcag412"],
+	"tags": ["cat.aria", "wcag2a", "wcag412"],
 	"metadata": {
 		"description": "Ensures every ARIA toggle field has an accessible name",
 		"help": "ARIA toggle fields have an accessible name"

lib/rules/aria-tooltip-name.json

@@ -2,7 +2,7 @@
 	"id": "aria-tooltip-name",
 	"selector": "[role=\"tooltip\"]",
 	"matches": "aria-form-field-name-matches",
-	"tags": ["wcag2a", "wcag412"],
+	"tags": ["cat.aria", "wcag2a", "wcag412"],
 	"metadata": {
 		"description": "Ensures every ARIA tooltip node has an accessible name",
 		"help": "ARIA tooltip ndoes must have an accessible name"

lib/rules/avoid-inline-spacing.json

@@ -1,7 +1,7 @@
 {
 	"id": "avoid-inline-spacing",
 	"selector": "[style]",
-	"tags": ["wcag21aa", "wcag1412"],
+	"tags": ["cat.structure", "wcag21aa", "wcag1412"],
 	"metadata": {
 		"description": "Ensure that text spacing set through style attributes can be adjusted with custom stylesheets",
 		"help": "Inline text spacing must be adjustable with custom stylesheets"

lib/rules/identical-links-same-purpose.json

@@ -3,7 +3,7 @@
 	"selector": "a[href], area[href], [role=\"link\"]",
 	"excludeHidden": false,
 	"matches": "identical-links-same-purpose-matches",
-	"tags": ["wcag2aaa", "wcag249", "best-practice"],
+	"tags": ["cat.semantics", "wcag2aaa", "wcag249", "best-practice"],
 	"metadata": {
 		"description": "Ensure that links with the same accessible name serve a similar purpose",
 		"help": "Links with the same name have a similar purpose"

lib/rules/label-content-name-mismatch.json

@@ -1,7 +1,7 @@
 {
 	"id": "label-content-name-mismatch",
 	"matches": "label-content-name-mismatch-matches",
-	"tags": ["wcag21a", "wcag253", "experimental"],
+	"tags": ["cat.semantics", "wcag21a", "wcag253", "experimental"],
 	"metadata": {
 		"description": "Ensures that elements labelled through their content must have their visible text as part of their accessible name",
 		"help": "Elements must have their visible text as part of their accessible name"

lib/rules/no-autoplay-audio.json

@@ -3,7 +3,7 @@
 	"excludeHidden": false,
 	"selector": "audio[autoplay], video[autoplay]",
 	"matches": "no-autoplay-audio-matches",
-	"tags": ["wcag2a", "wcag142", "experimental"],
+	"tags": ["cat.time-and-media", "wcag2a", "wcag142", "experimental"],
 	"metadata": {
 		"description": "Ensures <video> or <audio> elements do not autoplay audio for more than 3 seconds without a control mechanism to stop or mute the audio",
 		"help": "<video> or <audio> elements do not autoplay audio"

lib/rules/scrollable-region-focusable.json

@@ -1,7 +1,7 @@
 {
 	"id": "scrollable-region-focusable",
 	"matches": "scrollable-region-focusable-matches",
-	"tags": ["wcag2a", "wcag211"],
+	"tags": ["cat.keyboard", "wcag2a", "wcag211"],
 	"metadata": {
 		"description": "Elements that have scrollable content should be accessible by keyboard",
 		"help": "Ensure that scrollable region has keyboard access"