Rule 2ee8b8 ("Visible label is part of accessible name"): introducing a new "label in name algorithm".

.github/ISSUE_TEMPLATE/rules-issue-template.md

@@ -4,10 +4,7 @@ about: issues related with ACT Rules
 title: ''
 labels: ''
 assignees: ''
-
----
-
-Please describe the issue with references and relevant examples where necessary.
+---Please describe the issue with references and relevant examples where necessary.
 
 --- or ---
 

__tests__/spelling-ignore.yml

@@ -136,7 +136,7 @@
 - ozplayer
 - GitHub
 
-# Test case anamolies
+# Test case anomalies
 - brewitt-taylor
 - level2-frame1
 - level1-frame2
@@ -146,6 +146,9 @@
 - Sumei
 - Tuttle
 - lnik # intentional misspelling
+- ngizmo
+- nspecification
+- thelabel
 
 # Attributes (repeated words with casing as retext-spell has no config to ignore casing)
 - href
@@ -175,6 +178,9 @@
 - x1
 - y1
 
+# HTML character references
+- nbsp
+
 # DOM Events
 - auxclick
 - compostionend
@@ -241,6 +247,12 @@
 - disambiguated
 - superclass
 - grey
+- substring
+- initialisms
+- sublist
+- tokenize
+- tokenized
+- subsequence
 
 # Parts of Unicode
 - 000A
@@ -250,6 +262,8 @@
 - 4E00
 - 9FFF
 - 4E00–9FFF
+- 00A0
+- KD
 
 # JSON attributes/ metadata/ methods
 - testcases

__tests__/spelling.js

@@ -109,7 +109,9 @@ function getCuratedMarkdownBody(body, options = {}) {
  * @returns {String[]}
  */
 function getSpellIgnored() {
-	const ignoreConfigured = yaml.safeLoad(fs.readFileSync('./__tests__/spelling-ignore.yml', 'utf8'), {schema: yaml.FAILSAFE_SCHEMA}) //added schema due to entries starting with a non-zero digit
+	const ignoreConfigured = yaml.safeLoad(fs.readFileSync('./__tests__/spelling-ignore.yml', 'utf8'), {
+		schema: yaml.FAILSAFE_SCHEMA,
+	}) //added schema due to entries starting with a non-zero digit
 
 	/*
 	Building spelling exception in the shape FOOxxx where xxx is a number.

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

@@ -181,8 +181,13 @@ This `div` element has an [explicit role][] of `switch`; the `aria-required` [pr
 ```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
+		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>

_rules/focusable-no-keyboard-trap-standard-nav-a1b64e.md

@@ -88,43 +88,43 @@ use [standard keyboard navigation](#standard-keyboard-navigation) using the Esca
 ```html
 <div>Main page content with <a href="#">some link</a></div>
 <div aria-hidden="true">
-    <a href="#" id="sentinelBefore" style="position:absolute; top:-999em"
-        >Upon receiving focus, this focus sentinel should wrap focus to the bottom of the modal</a
-    >
+	<a href="#" id="sentinelBefore" style="position:absolute; top:-999em"
+		>Upon receiving focus, this focus sentinel should wrap focus to the bottom of the modal</a
+	>
 </div>
 <div
-    id="sampleModal"
-    role="dialog"
-    aria-label="Sample Modal"
-    aria-modal="true"
-    style="border: solid black 1px; padding: 1rem;"
+	id="sampleModal"
+	role="dialog"
+	aria-label="Sample Modal"
+	aria-modal="true"
+	style="border: solid black 1px; padding: 1rem;"
 >
-    <label>First and last name <input id="dialogFirst"/></label><br />
-    <button id="closeButton">Close button</button>
+	<label>First and last name <input id="dialogFirst"/></label><br />
+	<button id="closeButton">Close button</button>
 </div>
 <div aria-hidden="true">
-    <a href="#" id="sentinelAfter" style="position:absolute; top:-999em"
-        >Upon receiving focus, this focus sentinel should wrap focus to the top of the modal</a
-    >
+	<a href="#" id="sentinelAfter" style="position:absolute; top:-999em"
+		>Upon receiving focus, this focus sentinel should wrap focus to the top of the modal</a
+	>
 </div>
 <script>
-    window.addEventListener('load', () => {
-        document.getElementById('dialogFirst').focus();
-    })
-    document.getElementById('sentinelBefore').addEventListener('focus', () => {
-        document.getElementById('closeButton').focus()
-    })
-    document.getElementById('sentinelAfter').addEventListener('focus', () => {
-        document.getElementById('dialogFirst').focus()
-    })
-    document.getElementById('closeButton').addEventListener('click', () => {
-        document.getElementById('sampleModal').style.display = 'none'
-    })
-    document.getElementById('sampleModal').addEventListener('keydown', (evt) => {
-        if (evt.key === "Escape") {
-            document.getElementById('sampleModal').style.display = 'none';    
-        }
-    })
+	window.addEventListener('load', () => {
+		document.getElementById('dialogFirst').focus()
+	})
+	document.getElementById('sentinelBefore').addEventListener('focus', () => {
+		document.getElementById('closeButton').focus()
+	})
+	document.getElementById('sentinelAfter').addEventListener('focus', () => {
+		document.getElementById('dialogFirst').focus()
+	})
+	document.getElementById('closeButton').addEventListener('click', () => {
+		document.getElementById('sampleModal').style.display = 'none'
+	})
+	document.getElementById('sampleModal').addEventListener('keydown', evt => {
+		if (evt.key === 'Escape') {
+			document.getElementById('sampleModal').style.display = 'none'
+		}
+	})
 </script>
 ```
 

_rules/scrollable-element-keyboard-accessible-0ssw9k.md

@@ -40,8 +40,9 @@ This rule applies to any [HTML element][] that has [visible][] [children][] in t
 
 ## Expectation
 
-For each target element, at least one of the following is true: 
-- the element is included in [sequential focus navigation][]; or 
+For each target element, at least one of the following is true:
+
+- the element is included in [sequential focus navigation][]; or
 - the element has a [descendant][] in the [flat tree][] that is included in [sequential focus navigation][]; or
 - the element is [inert][].
 
@@ -119,7 +120,7 @@ This [scrollable][] `section` element is [inert][] because of the modal dialog,
 ```html
 <style>
 	dialog:-internal-dialog-in-top-layer::backdrop {
-    		background: rgba(1, 1, 1, 0.8);
+		background: rgba(1, 1, 1, 0.8);
 	}
 </style>
 <section style="height: 100px; width: 500px; overflow: scroll;" tabindex="0">
@@ -144,11 +145,11 @@ This [scrollable][] `section` element is [inert][] because of the modal dialog,
 </dialog>
 <script>
 	const openDialog = () => {
-		ppDialog.showModal();
+		ppDialog.showModal()
 		myFrame.tabIndex = '-1'
 	}
-	ppDialog.addEventListener('close', () => myFrame.tabIndex = 0)
-	window.addEventListener('DOMContentLoaded', openDialog);
+	ppDialog.addEventListener('close', () => (myFrame.tabIndex = 0))
+	window.addEventListener('DOMContentLoaded', openDialog)
 </script>
 ```