Merge branch 'develop' into HelenBurge-patch-2

Author: daniel-montalvo

.github/scripts/pr-preview.mjs

@@ -0,0 +1,28 @@
+#!/usr/bin/env zx
+import 'zx/globals';
+import { config, cloneWcagActRules, commitAndPush } from './commons.mjs'
+
+await cloneWcagActRules(config);
+await generateProposedRulePages(config);
+await generateTestCases(config);
+// const commitMessage = (await $`git log -1 --pretty=%B`).stdout;
+// await commitAndPush(config, commitMessage);
+
+async function generateProposedRulePages({ tmpDir, rulesDir, glossaryDir, testAssetsDir }) {
+  await $`node ./node_modules/act-tools/dist/cli/rule-transform.js \
+  --rulesDir "${rulesDir}" \
+  --glossaryDir "${glossaryDir}" \
+  --testAssetsDir "${testAssetsDir}" \
+  --outDir "${tmpDir}" \
+  --proposed
+  `;
+}
+
+async function generateTestCases({ tmpDir, rulesDir, testAssetsDir }) {
+  await $`node ./node_modules/act-tools/dist/cli/build-examples.js \
+    --rulesDir "${rulesDir}" \
+    --testAssetsDir "${testAssetsDir}" \
+    --outDir "${tmpDir}" \
+    --proposed
+  `;
+}

.github/workflows/wai-deploy.yml

@@ -23,6 +23,9 @@ jobs:
       - run: git config --global url."https://github.com/".insteadOf ssh://[email protected]/
       - name: Install dependencies
         run: npm ci
+      # Since we control this we can safely just always use the latest
+      - name: Install act-tools latest
+        run: npm install github:act-rules/act-tools#main
       - name: Configure git
         run: |
           git config --global url."https://${{ secrets.WAI_GIT_NAME }}:${{ secrets.WAI_GIT_ACCESS_TOKEN }}@github.com".insteadOf "https://github.com"

.gitignore

@@ -72,3 +72,6 @@ yarn.lock
 
 # Tmp build directory
 wcag-act-rules-tmp/
+
+# Local Netlify folder
+.netlify

__tests__/spelling-ignore.yml

@@ -240,6 +240,7 @@
 - unitless
 - luminance
 - disambiguated
+- superclass
 - grey
 
 # Parts of Unicode
@@ -295,3 +296,6 @@
 - A-lum-min
 - B-lum-max
 - B-lum-min
+
+#Browsers Internal Roles
+- SvgRoot

_rules/aria-attr-defined-5f99a7.md

@@ -65,7 +65,7 @@ This `article` element has an `aria-atomic` attribute which is defined in [WAI-A
 This `div` element with a role of `dialog` has an `aria-modal` attribute which is defined in [WAI-ARIA Specifications][].
 
 ```html
-<div role="dialog" aria-modal="true">Contains modal content...</div>
+<div role="dialog" aria-modal="true" aria-label="Modal title">Contains modal content...</div>
 ```
 
 #### Passed Example 3

_rules/aria-required-id-references-in6db8.md

@@ -78,7 +78,7 @@ The `aria-controls` [attribute value][] of this `scrollbar` matches the `id` of
 The `aria-controls` [attribute value][] of this expanded `combobox` matches the `id` of the `ul` element in the same document.
 
 ```html
-<label for="tag_combo">Tag</label>
+<label for="tag_combo" id="tag_label">Tag</label>
 <input
 	type="text"
 	id="tag_combo"
@@ -87,7 +87,7 @@ The `aria-controls` [attribute value][] of this expanded `combobox` matches the
 	aria-controls="popup_listbox"
 	aria-activedescendant="selected_option"
 />
-<ul role="listbox" id="popup_listbox">
+<ul role="listbox" id="popup_listbox" aria-labelledby="tag_label">
 	<li role="option">Zebra</li>
 	<li role="option" id="selected_option">Zoom</li>
 </ul>

_rules/aria-required-owned-element-bc4a75.md

@@ -4,7 +4,7 @@ name: ARIA required owned elements
 rules_format: 1.1
 rule_type: atomic
 description: |
-  This rule checks that an element with an explicit semantic role has at least one of its required owned elements.
+  This rule checks that an element with an explicit role that restricts which elements it can own only owns such elements.
 accessibility_requirements:
   wcag20:1.3.1: # Info and Relationships (A)
     forConformance: true
@@ -80,7 +80,7 @@ This element with the `list` role only owns elements with the `listitem` role. T
 This element with the `grid` role only owns elements with the `row` role, and the element with the `row` role only owns elements with the `gridcell` role. The `row` role is one of the [required owned elements][] for `grid`, and `gridcell` is one of the [required owned elements][] for `row`.
 
 ```html
-<table role="grid">
+<table role="grid" aria-label="grid name">
 	<tr role="row">
 		<td role="gridcell">Item 1</td>
 	</tr>
@@ -250,7 +250,7 @@ This `ul` element does not have an [explicit semantic role][].
 This element with the `progressbar` role does not need [required owned elements][].
 
 ```html
-<div role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">20 %</div>
+<div role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" aria-label="Completion">20 %</div>
 ```
 
 #### Inapplicable Example 4

_rules/aria-state-or-property-permitted-5c01ea.md

@@ -110,7 +110,7 @@ The `aria-busy` [state][] is a [global][] [state][] that is [supported][] by all
 
 #### Passed Example 4
 
-The `aria-label` [property][] is a [global][] [property][]. It is allowed on any [semantic role][].
+The `aria-label` [property][] is a [global][] [property][]. It is allowed on any [semantic role][], except where specifically prohibited.
 
 ```html
 <div role="button" aria-label="OK">✓</div>
@@ -129,28 +129,28 @@ The `aria-checked` [state][] is [required][] for the [semantic][semantic role] `
 The `aria-controls` [property][] is [required][] for the [semantic][semantic role] `combobox`.
 
 ```html
-<div role="combobox" aria-controls="id1" aria-expanded="false">My combobox</div>
+<div role="combobox" aria-controls="id1" aria-expanded="false" aria-label="My combobox">My combobox</div>
 ```
 
 #### Passed Example 7
 
 The `aria-controls` [property][] is [required][] for the [semantic][semantic role] `combobox`. [WAI-ARIA states and properties][wai-aria state or property] with empty value are still applicable to this rule.
 
 ```html
-<div role="combobox" aria-expanded="false" aria-controls>My combobox</div>
+<div role="combobox" aria-expanded="false" aria-controls aria-label="My combobox">My combobox</div>
 ```
 
 #### Passed Example 8
 
 The `aria-controls` [property][] is [required][] for the [semantic][semantic role] `combobox`. [WAI-ARIA states and properties][wai-aria state or property] with empty value (specified as an empty string) are still applicable to this rule.
 
 ```html
-<div role="combobox" aria-expanded="false" aria-controls="">My combobox</div>
+<div role="combobox" aria-expanded="false" aria-controls="" aria-label="My combobox">My combobox</div>
 ```
 
 #### Passed Example 9
 
-The `aria-label` [property][] is [global][]. It is allowed on any [semantic role][], including roles from the [WAI-ARIA Graphics Module](https://www.w3.org/TR/graphics-aria-1.0). This rule is applicable to SVG elements.
+The `aria-label` [property][] is [global][]. It is allowed on any [semantic role][], except where specifically prohibited, including roles from the [WAI-ARIA Graphics Module](https://www.w3.org/TR/graphics-aria-1.0). This rule is applicable to SVG elements.
 
 ```html
 <svg xmlns="http://www.w3.org/2000/svg" role="graphics-object" width="100" height="100" aria-label="yellow circle">
@@ -174,6 +174,29 @@ This `input` element does not have an [explicit role][] of `textbox`, but the `a
 <label>Password<input type="password" aria-required="true"/></label>
 ```
 
+#### Passed Example 12
+
+This `div` element has an [explicit role][] of `switch`; the `aria-required` [property][] is [inherited][] from the `checkbox` [superclass role](https://www.w3.org/TR/wai-aria-1.2/#superclassrole).
+
+```html
+<div role="switch" aria-checked="false" tabindex="0" aria-required="true">
+	<span class="label">Notifications</span>
+	<span class="switch" style="position: relative; display: inline-block; top: 6px; border: 2px solid black; border-radius: 12px; height: 20px; width: 40px;">
+		<span style="position: absolute; top: 2px; left: 2px; display: inline-block; border: 2px solid black; border-radius: 8px; height: 12px; width: 12px; background: black;"></span>
+	</span>
+	<span class="on" aria-hidden="true" style="display: none;">On</span>
+	<span class="off" aria-hidden="true">Off</span>
+</div>
+```
+
+#### Passed Example 13
+
+This `div` element has an [explicit role][] of `separator`. The `aria-valuemin`, `aria-valuemax` and `aria-valuenow` [properties][property] are [supported][] for the `separator` role when the element is [focusable][].
+
+```html
+<div role="separator" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" tabindex="0">My separator</div>
+```
+
 ### Failed
 
 #### Failed Example 1
@@ -200,14 +223,22 @@ The `aria-label` property is [prohibited][] for an element with a `generic` role
 <div aria-label="Bananas"></div>
 ```
 
+#### Failed Example 4
+
+The `aria-label` property is [prohibited][] for an element with a `paragraph` role.
+
+```html
+<div role="paragraph" aria-label="Bananas"></div>
+```
+
 ### Inapplicable
 
 #### Inapplicable Example 1
 
 This `div` element has no [WAI-ARIA state or property][].
 
 ```html
-<div role="region">A region of content</div>
+<div role="group">A group of content</div>
 ```
 
 #### Inapplicable Example 2

_rules/autocomplete-valid-value-73f2c2.md

@@ -69,7 +69,6 @@ The purpose of a control is programmatically identifiable even when its `autocom
 
 - While `autocomplete` is a promising technique for supporting personalization in HTML, support for this in assistive technologies is fairly limited.
 - Implementation of [Presentational Roles Conflict Resolution][] varies from one browser or assistive technology to another. Depending on this, some elements can have a [semantic role][] of `none` and fail this rule with some technology but users of other technologies would not experience any accessibility issue.
-- In some user agents, querying the value of the `autocomplete` property returns an empty string ("") even when the attribute was set according to the rule's expectations. It affects assistive technologies which rely on this property to personalize input fields collecting information about the user.
 - Authors may assign inappropriate `autocomplete` attribute values. Moreover, HTML specifications restrict certain `autocomplete` attribute values to specific form controls. Mismatches between `autocomplete` attribute values and form control types may or may not lead to a failure of [success criterion 1.3.5 Identify Input Purpose](https://www.w3.org/TR/WCAG22/#identify-input-purpose). However, this rule focuses exclusively on validating valid `autocomplete` attribute values, disregarding their contextual appropriateness.
 
 ### Bibliography

_rules/block-collapsible-3e12e1.md

@@ -39,16 +39,14 @@ For each [block of repeated content][] in each test target, which is before (in
 
 ### Assumptions
 
-There are no assumptions.
+Usually the same [instrument][] removes both [visibility][visible] and [inclusion in the accessibility tree][included in the accessibility tree] of a [block of repeated content][]. That [instrument][] may remove all [blocks of repeated content][block of repeated content]. If there is no [block of repeated content][] before the non-repeated content the rule passes.
+
+[Technique SCR28: Using an expandable and collapsible menu to bypass block of content][tech scr28] does not have any requirements concerning the location of the [instruments][instrument] in relation to the [block of repeated content][] they control, hence this rule doesn't. It is likely a good idea to either keep each [instrument][] close to the start of the [block of repeated content][] it controls; or to group them all in one place near the start of the document. Notably, [instruments][instrument] located after (in reading order) the block they collapse are likely not satisfying [Success Criterion 2.4.1 Bypass blocks][sc241], which this rule is designed for. Thus, it is possible to pass this rule without satisfying [Success Criterion 2.4.1 Bypass blocks][sc241].
 
 ### Accessibility Support
 
 There are no accessibility support issues known.
 
-Usually the same [instrument][] removes both [visibility][visible] and [inclusion in the accessibility tree][included in the accessibility tree] of a [block of repeated content][]. That [instrument][] may remove all [blocks of repeated content][block of repeated content]. If there is no [block of repeated content][] before the non-repeated content the rule passes.
-
-[Technique SCR28: Using an expandable and collapsible menu to bypass block of content][tech scr28] does not have any requirements concerning the location of the [instruments][instrument] in relation to the [block of repeated content][] they control, hence this rule doesn't. It is likely a good idea to either keep each [instrument][] close to the start of the [block of repeated content][] it controls; or to group them all in one place near the start of the document. Notably, [instruments][instrument] located after (in reading order) the block they collapse are likely not satisfying [Success Criterion 2.4.1 Bypass blocks][sc241], which this rule is designed for. Thus, it is possible to pass this rule without satisfying [Success Criterion 2.4.1 Bypass blocks][sc241].
-
 ### Bibliography
 
 - [Technique SCR28: Using an expandable and collapsible menu to bypass block of content][tech scr28]