Skip to content

Commit 4a2188f

Browse files
rahimabdirahimabdi
authored
Update accname/name/comp_labelledby.html with aria-labeledby [sic] tests (#43698)
Authored-by: Rahim Abdi <[email protected]>
1 parent 010b43b commit 4a2188f

File tree

1 file changed

+88
-0
lines changed

1 file changed

+88
-0
lines changed

‎accname/name/comp_labelledby.html

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
- /accname/name/shadowdom/*
2222
2323
-->
24+
<h2>Tests for <code>aria-labelledby</code></h2>
2425

2526
<div role="group" aria-labelledby="h" class="ex" data-expectedlabel="first heading" data-testname="div group explicitly labelledby heading">
2627
<h2 id="h">first heading</h2>
@@ -36,6 +37,93 @@ <h2 id="h2">+ first heading</h2>
3637
<span id="s1">verify</span><span id="s2">spaces</span><span>FAIL IF INCLUDED</span><span id="s3">between</span><span id="s4">foreach</span>
3738
</nav>
3839

40+
<h2>Tests for <code>aria-labeledby</code> (non-standard spelling)</h2>
41+
42+
<span id="n1">first label</span>
43+
<span id="n2">second label</span>
44+
45+
<a href="#" aria-labeledby="n1" class="ex" data-expectedlabel="first label" data-testname="link is labelled by aria-labeledby (non-standard spelling)">x</a>
46+
<button aria-labeledby="n1" class="ex" data-expectedlabel="first label" data-testname="button is labelled by aria-labeledby (non-standard spelling)">x</button>
47+
<div role="group" aria-labeledby="n1" class="ex" data-expectedlabel="first label" data-testname="div with role group is labelled by aria-labeledby (non-standard spelling)">x</div>
48+
49+
<h2>Tests for precedence: <code>aria-labelledby</code> vs. <code>aria-labeledby</code> (non-standard spelling)</h2>
50+
<!-- The "aria-labelledby" spelling should take precedence over "aria-labeledby" for accname -->
51+
52+
<a href="#" aria-labelledby="n1" aria-labeledby="n2" class="ex" data-expectedlabel="first label" data-testname="link labelled by aria-labelledby supercedes aria-labeledby (non-standard spelling)">x</a>
53+
<button aria-labelledby="n1" aria-labeledby="n2" class="ex" data-expectedlabel="first label" data-testname="button labelled by aria-labelledby supercedes aria-labeledby (non-standard spelling)">x</button>
54+
<div role="group" aria-labelledby="n1" aria-labeledby="n2" class="ex" data-expectedlabel="first label" data-testname="div labelled by aria-labelledby supercedes aria-labeledby (non-standard spelling)">x</div>
55+
56+
<a href="#" aria-labeledby="n1" aria-labelledby="n2" class="ex" data-expectedlabel="second label" data-testname="link labelled by [aria-labeledby][aria-labelledby]">x</a>
57+
<button aria-labeledby="n1" aria-labelledby="n2" class="ex" data-expectedlabel="second label" data-testname="button labelled by [aria-labeledby][aria-labelledby]">x</button>
58+
<div role="group" aria-labeledby="n1" aria-labelledby="n2" class="ex" data-expectedlabel="second label" data-testname="div labelled by [aria-labeledby][aria-labelledby]">x</div>
59+
60+
<h2>Tests for name precedence with <code>aria-labeledby</code> (non-standard spelling)</h2>
61+
<!-- Name computation: https://w3c.github.io/accname/#computation-steps -->
62+
63+
<!-- Step 2A: Hidden Not Referenced supercedes 2B: AriaLabeledby -->
64+
<button aria-labeledby="span1" aria-label="foo" data-expectedlabel="label" data-testname="button's hidden referenced name (display:none) with aria-labeledby (non-standard spelling) supercedes aria-label" class="ex">
65+
<span id="span1" style="display:none;">
66+
<span id="span2" style="display:none;">label</span>
67+
</span>
68+
x
69+
</button>
70+
71+
<button aria-labeledby="span3" aria-label="foo" data-expectedlabel="label" data-testname="button's hidden referenced name (visibility:hidden) with aria-labeledby (non-standard spelling) supercedes aria-label" class="ex">
72+
<span id="span3" style="visibility:hidden;">
73+
<span id="span4" style="visibility:hidden;">label</span>
74+
</span>
75+
x
76+
</button>
77+
78+
<button aria-labeledby="span4" aria-label="foo" data-expectedlabel="foo" data-testname="button's hidden referenced name (visibility:hidden) with hidden aria-labeledby traversal falls back to aria-label" class="ex">
79+
<span id="span4">
80+
<span id="span5" style="visibility:hidden;">label</span>
81+
</span>
82+
x
83+
</button>
84+
85+
<!-- Step 2B: AriaLabeledby supercedes 2D: AriaLabel -->
86+
<a href="#" aria-labeledby="span6" aria-label="foo" data-expectedlabel="label" data-testname="link's aria-labeledby (non-standard spelling) name supercedes aria-label" class="ex">x</a>
87+
<span id="span6">label</span>
88+
89+
<!-- Step 2C: Embedded Control labelling via aria-labeledby not defined in accname spec -->
90+
91+
<!-- Step 2E: Host Language Label is superceded by 2B: AriaLabeledby -->
92+
<img alt="alt" aria-labeledby="n2" data-expectedlabel="second label" data-testname="img's aria-labeledby (non-standard spelling) supercedes alt attribute" class="ex" />
93+
94+
<svg aria-labeledby="n2" data-expectedlabel="second label" data-testname="svg's aria-labeledby (non-standard spelling) supercedes title tag" class="ex">
95+
<circle cx="5" cy="5" r="4">
96+
<title>circle</title>
97+
</circle>
98+
</svg>
99+
100+
<label for="input1">label</label>
101+
<input type="text" id="input1" aria-labeledby="n2" data-expectedlabel="second label" data-testname="input with label for association is superceded by aria-labeledby (non-standard spelling)" class="ex" />
102+
103+
<!-- Step 2F: Name From Content is superceded by 2B: AriaLabeledby -->
104+
<button aria-labeledby="n2" data-expectedlabel="second label" data-testname="button name from contents is superceded by aria-labeledby (non-standard spelling)" class="ex">x</button>
105+
106+
<!-- Step 2G: Text Node is superceded by 2B: AriaLabeledby, also see wpt/accname/name/comp_text_node.html -->
107+
<h1 aria-labeledby="n2" data-expectedlabel="second label" data-testname="h1 text is superceded by aria-labeledby (non-standard spelling)" class="ex">x</h1>
108+
109+
<!-- Step 2H: Recursive Name from Content, see wpt/accname/name/comp_name_from_content.html -->
110+
<h3 data-expectedlabel="image link2 link3" data-testname="heading name from content for each child including two nested links using aria-labeledby (non-standard spelling) with nested image" class="ex">
111+
<a href="#" aria-labeledby="nested_image_label2">
112+
link1<!-- this text is skipped because of aria-labeledby -->
113+
</a>
114+
<a href="#" data-expectedlabel="link2 image link3" data-testname="link name from content for each child including nested image (referenced elsewhere via labeledby)" class="ex">
115+
link2
116+
<img id="nested_image_label2" alt="image" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==">
117+
<!-- image skipped in this link (when computing heading text) because it was already referenced by the first link within this heading label recursion cycle. -->
118+
<!-- but image not skipped when computing the text of the link itself since it has not been referenced in that context -->
119+
link3
120+
</a>
121+
</h3>
122+
123+
<!-- Step 2I: Tooltip is superceded by 2B: AriaLabeledby, also see wpt/accname/name/comp_tooltip.html -->
124+
<button aria-labeledby="n2" title="foo" data-expectedlabel="second label" data-testname="button with title is superceded by aria-labeledby (non-standard spelling)" class="ex">x</button>
125+
126+
39127
<!--
40128
41129
BLOCKED on https://github.com/w3c/accname/issues/209

0 commit comments

Comments
 (0)