Makes aria-braillelabel prohibited whereever aria-label is prohibited. (#1991)

jnurthen · web-flow · commit ef1ad8518bdf · 2023-08-11T09:34:16.000+02:00
Closes #1988 Makes aria-braillelabel prohibited whereever aria-label is prohibited.
diff --git a/index.html b/index.html
@@ -1891,6 +1891,7 @@ <h2>Definition of Roles</h2>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -2179,6 +2180,7 @@ <h2>Definition of Roles</h2>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -2940,6 +2942,7 @@ <h2>Definition of Roles</h2>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -3028,6 +3031,7 @@ <h2>Definition of Roles</h2>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -3355,6 +3359,7 @@ <h2>Definition of Roles</h2>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -3698,6 +3703,7 @@ <h2>Definition of Roles</h2>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-brailleroledescription</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
@@ -4338,6 +4344,7 @@ <h2>Definition of Roles</h2>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -5048,6 +5055,7 @@ <h2>Definition of Roles</h2>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -6075,6 +6083,7 @@ <h5>Presentational Role Inheritance</h5>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -6481,6 +6490,7 @@ <h5>Presentational Role Inheritance</h5>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -8283,6 +8293,7 @@ <h5>Presentational Role Inheritance</h5>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -8441,6 +8452,7 @@ <h5>Presentational Role Inheritance</h5>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -8544,6 +8556,7 @@ <h5>Presentational Role Inheritance</h5>
 									<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 									<td class="role-disallowed">
 											<ul>
+													<li><pref>aria-braillelabel</pref></li>
 													<li><pref>aria-label</pref></li>
 													<li><pref>aria-labelledby</pref></li>
 											</ul>
@@ -8631,6 +8644,7 @@ <h5>Presentational Role Inheritance</h5>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -9187,6 +9201,7 @@ <h5>Presentational Role Inheritance</h5>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -9502,6 +9517,7 @@ <h5>Presentational Role Inheritance</h5>
 						<th class="role-disallowed-head" scope="row">Prohibited States and Properties:</th>
 						<td class="role-disallowed">
 							<ul>
+								<li><pref>aria-braillelabel</pref></li>
 								<li><pref>aria-label</pref></li>
 								<li><pref>aria-labelledby</pref></li>
 							</ul>
@@ -10685,6 +10701,7 @@ <h2>Definitions of States and Properties (all aria-* attributes)</h2>
 					<li>The value of <code>aria-braillelabel</code> does not contain any characters in <a>Unicode Braille Patterns</a> or consists of only characters in <a>Unicode Braille Patterns</a>; the value does not only contain Braille Pattern dots-0.</li>
 					<li>The value of <code>aria-braillelabel</code> is not identical to the element's accessible name.</li>
 				</ol>
+				<p>Authors MUST NOT specify <code>aria-braillelabel</code> on an element which has an explicit or implicit WAI-ARIA role where <code>aria-braillelabel</code> is <a href="#prohibitedattributes">prohibited</a>.</p>
 				<p class="note">Note that <a>Assistive Technologies</a> with braille support can convert the accessible name to Braille. In addition, assistive technologies will be able to customize such braille output according to user preferences. Using only the accessible name, e.g., from content or via <code>aria-label</code> is <strong>almost always</strong> the better user experience and authors are <strong>strongly discouraged</strong> from using <code>aria-braillelabel</code> to replicate <code>aria-label</code>. Instead, <code>aria-braillelabel</code> is meant to be used only if the accessible name cannot provide an adequate braille representation, i.e., when a specialized braille description is very different from a text description converted to Braille. It is very important to note that when using <code>aria-braillelabel</code> authors are solely responsible for localizing the attribute value so that it aligns with the document language. In addition, authors need to design a way to clearly communicate the use of this attribute to the user. For example, this could be done in the product documentation. This is even more important when the value consists of Unicode Braille Patterns because <a>Assistive Technologies</a> will pass such content directly to the user without applying user specific braille translations; in general, authors are <strong>strongly discouraged</strong> from using Unicode Braille Patterns in <code>aria-braillelabel</code>.
 				</p>
 				<p><a>Assistive technologies</a> SHOULD use the value of <code>aria-braillelabel</code> when presenting the accessible name of an element in Braille, but SHOULD NOT change other functionality. For example, an assistive technology that provides aural rendering SHOULD use the accessible name.</p>
@@ -10709,7 +10726,7 @@ <h2>Definitions of States and Properties (all aria-* attributes)</h2>
 				<tbody>
 					<tr>
 						<th class="property-applicability-head" scope="row">Used in Roles:</th>
-						<td class="property-applicability">All elements of the base markup</td>
+						<td class="property-applicability">All elements of the base markup except for some roles or elements that prohibit its use</td>
 					</tr>
 					<tr>
 						<th class="property-descendants-head" scope="row">Inherits into Roles:</th>
diff --git a/validator-tests/braillelabel-prohibited.html b/validator-tests/braillelabel-prohibited.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html lang="en-US">
+<head><title>BrailleLabel Prohibited</title></head>
+<body>
+
+<!--
+URL: https://www.w3.org/TR/wai-aria-1.3/#aria-braillelabel
+RULE: "Authors MUST NOT specify aria-braillelabel on an element which has an explicit or implicit WAI-ARIA role where aria-braillelabel is prohibited."
+-->
+
+<!-- aria-label -->
+<div id="aria-label-1" role="code" aria-braillelabel="foo">bar</div>
+<code id="aria-label-2" aria-label="foo">bar</code>
+
+<div id="aria-label-3" role="deletion" aria-braillelabel="foo">bar</div>
+<del id="aria-label-4" aria-label="foo">bar</del>
+
+<div id="aria-label-5" role="emphasis" aria-braillelabel="foo">bar</div>
+<em id="aria-label-6" aria-label="foo">bar</em>
+
+<div id="aria-label-7" role="generic" aria-braillelabel="foo">bar</div>
+<div id="aria-label-8" aria-label="foo">bar</div>
+
+<div id="aria-label-9" role="insertion" aria-braillelabel="foo">bar</div>
+<ins id="aria-label-10" aria-label="foo">bar</ins>
+
+<div id="aria-label-11" role="paragraph" aria-braillelabel="foo">bar</div>
+<p id="aria-label-12" aria-label="foo">bar</p>
+
+<div id="aria-label-13" role="presentation" aria-braillelabel="foo">bar</div>
+<div id="aria-label-14" role="none" aria-label="foo">bar</div>
+
+<div id="aria-label-15" role="strong" aria-braillelabel="foo">bar</div>
+<strong id="aria-label-16" aria-label="foo">bar</strong>
+
+<div id="aria-label-17" role="subscript" aria-braillelabel="foo">bar</div>
+<sub id="aria-label-18" aria-label="foo">bar</sub>
+
+<div id="aria-label-19" role="superscript" aria-braillelabel="foo">bar</div>
+<sup id="aria-label-20" aria-label="foo">bar</sup>
+
+<div role="table">
+  <div id="aria-label-21" role="caption" aria-braillelabel="foo">bar</div>
+  <div role="row">
+    <div role="cell">baz</div>
+  </div>
+</div>
+<table>
+  <caption id="aria-label-22" aria-braillelabel="foo">bar</caption>
+  <tr>
+    <td>baz</td>
+  </tr>
+</table>
+
+</body>
+</html>
+
