This wiki page is deprecated in favor of the WPT tests for accname, which can be reviewed here: https://wpt.fyi/results/accname
NOTES
The original ARIA 1.0 algorithm has theoretically been modified for clarity only. Thus the platform-independent results expected during 1.0 testing should remain the same for 1.1 testing. Therefore, let's start by porting those tests (from the old PFWG harness) to the WPT + ATTA means of testing.
macOS has multiple properties through which an accessible name can be exposed to platform assistive technologies (e.g. AXDescription and AXTitle). Because what is being tested here is the calculation of the name rather than the specific property through which that value is exposed, these alternatives are currently being taken into account by the ATTA when determining if a test result is a PASS or FAIL, even though they are not (currently) stated in the tests below. These issues will be resolved.
N.B. This is a work in progress. Please do not modify what is on this page without first checking with Joanie. Thanks!
Name Tests from ARIA 1.0
Name test case 539
Validation passed
if given
<input type="button" aria-label="Rich" id="test">
then the accessible name of the element with id of "test" is "Rich"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Rich"
|
UIA
|
property
|
Name
|
is
|
"Rich"
|
ATK
|
property
|
name
|
is
|
"Rich"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Rich"
|
Name test case 540
Validation passed
if given
<div id="ID1">Rich's button</div>
<input type="button" aria-labelledby="ID1" id="test">
then the accessible name of the element with id of "test" is "Rich's button"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Rich's button"
|
UIA
|
property
|
Name
|
is
|
"Rich's button"
|
ATK
|
property
|
name
|
is
|
"Rich's button"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Rich's button"
|
Name test case 541
Validation passed
if given
<div id="ID1">Rich's button</div>
<input type="button" aria-label="bar" aria-labelledby="ID1" id="test"/>
then the accessible name of the element with id of "test" is "Rich's button"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Rich's button"
|
UIA
|
property
|
Name
|
is
|
"Rich's button"
|
ATK
|
property
|
name
|
is
|
"Rich's button"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Rich's button"
|
Name test case 543
Validation pending
if given
<input type="reset" id="test"/>
then the accessible name of the element with id of "test" is "Reset"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Reset"
|
UIA
|
property
|
Name
|
is
|
"Reset"
|
ATK
|
property
|
name
|
is
|
"Reset"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Reset"
|
Name test case 544
Validation passed
if given
<input type="button" id="test" value="foo"/>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 545
Validation passed
if given
<input src="baz.html" type="image" id="test" alt="foo"/>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 546
Validation passed
if given
<label for="test">States:</label>
<input type="text" id="test"/>
then the accessible name of the element with id of "test" is "States:"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"States:"
|
UIA
|
property
|
Name
|
is
|
"States:"
|
ATK
|
property
|
name
|
is
|
"States:"
|
AXAPI
|
property
|
AXDescription
|
is
|
"States:"
|
Name test case 547
Validation passed
if given
<label for="test">
foo
<input type="text" value="David"/>
</label>
<input type="text" id="test" value="baz"/>
then the accessible name of the element with id of "test" is "foo David"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo David"
|
UIA
|
property
|
Name
|
is
|
"foo David"
|
ATK
|
property
|
name
|
is
|
"foo David"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo David"
|
Name test case 548
Validation passed
if given
<label for="test">
crazy
<select name="member" size="1" role="menu" tabindex="0">
<option role="menuitem" value="beard" selected="true">clown</option>
<option role="menuitem" value="scuba">rich</option>
</select>
</label>
<input type="text" id="test" value="baz"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 549
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuetext="Monday" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="text" id="test" value="baz"/>
then the accessible name of the element with id of "test" is "crazy Monday"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy Monday"
|
UIA
|
property
|
Name
|
is
|
"crazy Monday"
|
ATK
|
property
|
name
|
is
|
"crazy Monday"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy Monday"
|
Name test case 550
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="text" id="test" value="baz"/>
then the accessible name of the element with id of "test" is "crazy 4"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy 4"
|
UIA
|
property
|
Name
|
is
|
"crazy 4"
|
ATK
|
property
|
name
|
is
|
"crazy 4"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy 4"
|
Name test case 551
Validation passed
if given
<input type="text" id="test" title="crazy" value="baz"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 552
Validation passed
if given
<style>
label:before { content:"fancy "; }
</style>
<label for="test">fruit</label>
<input type="text" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 553
Validation passed
if given
<style type="text/css">
[data-after]:after { content: attr(data-after); }
</style>
<label for="test" data-after="test content"></label>
<input type="text" id="test">
then the accessible name of the element with id of "test" is "test content"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"test content"
|
UIA
|
property
|
Name
|
is
|
"test content"
|
ATK
|
property
|
name
|
is
|
"test content"
|
AXAPI
|
property
|
AXDescription
|
is
|
"test content"
|
Name test case 556
Validation passed
if given
<img id="test" src="foo.jpg" aria-label="1"/>
then the accessible name of the element with id of "test" is "1"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"1"
|
UIA
|
property
|
Name
|
is
|
"1"
|
ATK
|
property
|
name
|
is
|
"1"
|
AXAPI
|
property
|
AXDescription
|
is
|
"1"
|
Name test case 557
Validation passed
if given
<img id="test" src="foo.jpg" aria-label="1" alt="a" title="t"/>
then the accessible name of the element with id of "test" is "1"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"1"
|
UIA
|
property
|
Name
|
is
|
"1"
|
ATK
|
property
|
name
|
is
|
"1"
|
AXAPI
|
property
|
AXDescription
|
is
|
"1"
|
Name test case 558
Validation passed
if given
<input type="text" value="peanuts" id="test">
<img aria-labelledby="test" src="foo.jpg"/>
then the accessible name of the element with id of "test" is ""
element test
|
IAccessible2
|
property
|
accName
|
is
|
""
|
UIA
|
property
|
Name
|
is
|
""
|
ATK
|
property
|
name
|
is
|
""
|
AXAPI
|
property
|
AXDescription
|
is
|
""
|
Name test case 559
Validation passed
if given
<img id="test" aria-labelledby="test" src="foo.jpg"/>
then the accessible name of the element with id of "test" is ""
element test
|
IAccessible2
|
property
|
accName
|
is
|
""
|
UIA
|
property
|
Name
|
is
|
""
|
ATK
|
property
|
name
|
is
|
""
|
AXAPI
|
property
|
AXDescription
|
is
|
""
|
Name test case 560
Validation passed
if given
<input type="text" value="peanuts" id="test">
<img aria-labelledby="test" aria-label="1" src="foo.jpg"/>
then the accessible name of the element with id of "test" is ""
element test
|
IAccessible2
|
property
|
accName
|
is
|
""
|
UIA
|
property
|
Name
|
is
|
""
|
ATK
|
property
|
name
|
is
|
""
|
AXAPI
|
property
|
AXDescription
|
is
|
""
|
Name test case 561
Validation passed
if given
<img id="test" aria-labelledby="test" aria-label="1" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "1"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"1"
|
UIA
|
property
|
Name
|
is
|
"1"
|
ATK
|
property
|
name
|
is
|
"1"
|
AXAPI
|
property
|
AXDescription
|
is
|
"1"
|
Name test case 562
Validation passed
if given
<input type="text" value="peanuts" id="ID1">
<input type="text" value="popcorn" id="ID2">
<input type="text" value="apple jacks" id="ID3">
<img aria-labelledby="ID1 ID2 ID3" id="test" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "peanuts popcorn apple jacks"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"peanuts popcorn apple jacks"
|
UIA
|
property
|
Name
|
is
|
"peanuts popcorn apple jacks"
|
ATK
|
property
|
name
|
is
|
"peanuts popcorn apple jacks"
|
AXAPI
|
property
|
AXDescription
|
is
|
"peanuts popcorn apple jacks"
|
Name test case 563
Validation passed
if given
<input type="text" value="peanuts" id="ID1">
<img id="test" aria-label="l" aria-labelledby="test ID1" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "l peanuts"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"l peanuts"
|
UIA
|
property
|
Name
|
is
|
"l peanuts"
|
ATK
|
property
|
name
|
is
|
"l peanuts"
|
AXAPI
|
property
|
AXDescription
|
is
|
"l peanuts"
|
Name test case 564
Validation passed
if given
<input type="text" value="peanuts" id="ID1">
<input type="text" value="popcorn" id="ID2">
<img id="test" aria-label="l" aria-labelledby="test ID1 ID2" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "l peanuts popcorn"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"l peanuts popcorn"
|
UIA
|
property
|
Name
|
is
|
"l peanuts popcorn"
|
ATK
|
property
|
name
|
is
|
"l peanuts popcorn"
|
AXAPI
|
property
|
AXDescription
|
is
|
"l peanuts popcorn"
|
Name test case 565
Validation passed
if given
<input type="text" value="peanuts" id="ID1">
<input type="text" value="popcorn" id="ID2">
<input type="text" value="apple jacks" id="ID3">
<img id="test" aria-label="l" aria-labelledby="test ID1 ID2 ID3" alt= "a" title="t" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "l peanuts popcorn apple jacks"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"l peanuts popcorn apple jacks"
|
UIA
|
property
|
Name
|
is
|
"l peanuts popcorn apple jacks"
|
ATK
|
property
|
name
|
is
|
"l peanuts popcorn apple jacks"
|
AXAPI
|
property
|
AXDescription
|
is
|
"l peanuts popcorn apple jacks"
|
Name test case 566
Validation passed
if given
<input type="text" value="peanuts" id="ID1">
<input type="text" value="popcorn" id="ID2">
<input type="text" value="apple jacks" id="ID3">
<img id="test" aria-label="" aria-labelledby="test ID1 ID2 ID3" alt="" title="t" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "t peanuts popcorn apple jacks"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"t peanuts popcorn apple jacks"
|
UIA
|
property
|
Name
|
is
|
"t peanuts popcorn apple jacks"
|
ATK
|
property
|
name
|
is
|
"t peanuts popcorn apple jacks"
|
AXAPI
|
property
|
AXDescription
|
is
|
"t peanuts popcorn apple jacks"
|
Name test case 596
Validation passed
if given
<div id="test" aria-labelledby="ID1">foo</div>
<span id="ID1">bar</span>
then the accessible name of the element with id of "test" is "bar"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"bar"
|
UIA
|
property
|
Name
|
is
|
"bar"
|
ATK
|
property
|
name
|
is
|
"bar"
|
AXAPI
|
property
|
AXDescription
|
is
|
"bar"
|
Name test case 597
Validation passed
if given
<div id="test" aria-label="Tag">foo</div>
then the accessible name of the element with id of "test" is "Tag"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Tag"
|
UIA
|
property
|
Name
|
is
|
"Tag"
|
ATK
|
property
|
name
|
is
|
"Tag"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Tag"
|
Name test case 598
Validation passed
if given
<div id="test" aria-labelledby="ID1" aria-label="Tag">foo</div>
<span id="ID1">bar</span>
then the accessible name of the element with id of "test" is "bar"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"bar"
|
UIA
|
property
|
Name
|
is
|
"bar"
|
ATK
|
property
|
name
|
is
|
"bar"
|
AXAPI
|
property
|
AXDescription
|
is
|
"bar"
|
Name test case 599
Validation passed
if given
<div id="test" aria-labelledby="ID0 ID1" aria-label="Tag">foo</div>
<span id="ID0">bar</span>
<span id="ID1">baz</span>
then the accessible name of the element with id of "test" is "bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"bar baz"
|
UIA
|
property
|
Name
|
is
|
"bar baz"
|
ATK
|
property
|
name
|
is
|
"bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"bar baz"
|
Name test case 600
Validation passed
if given
<div id="test">Div with text</div>
then the accessible name of the element with id of "test" is ""
element test
|
IAccessible2
|
property
|
accName
|
is
|
""
|
UIA
|
property
|
Name
|
is
|
""
|
ATK
|
property
|
name
|
is
|
""
|
AXAPI
|
property
|
AXDescription
|
is
|
""
|
Name test case 601
Validation passed
if given
<div id="test" role="button">foo</div>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 602
Validation passed
if given
<div id="test" role="button" title="Tag" style="outline:medium solid black; width:2em; height:1em;">
</div>
then the accessible name of the element with id of "test" is "Tag"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Tag"
|
UIA
|
property
|
Name
|
is
|
"Tag"
|
ATK
|
property
|
name
|
is
|
"Tag"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Tag"
|
Name test case 603
Validation passed
if given
<div id="ID1">foo</div>
<a id="test" href="test.html" aria-labelledby="ID1">bar</a>
then the accessible name of the element with id of "test" is "foo")
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 604
Validation passed
if given
<a id="test" href="test.html" aria-label="Tag">ABC</a>
then the accessible name of the element with id of "test" is "Tag"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Tag"
|
UIA
|
property
|
Name
|
is
|
"Tag"
|
ATK
|
property
|
name
|
is
|
"Tag"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Tag"
|
Name test case 605
Validation passed
if given
<a href="test.html" id="test" aria-labelledby="ID1" aria-label="Tag">foo</a>
<p id="ID1">bar</p>
then the accessible name of the element with id of "test" is "bar"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"bar"
|
UIA
|
property
|
Name
|
is
|
"bar"
|
ATK
|
property
|
name
|
is
|
"bar"
|
AXAPI
|
property
|
AXDescription
|
is
|
"bar"
|
Name test case 606
Validation passed
if given
<a href="test.html" id="test" aria-labelledby="test ID1" aria-label="Tag"></a>
<p id="ID1">foo</p>
then the accessible name of the element with id of "test" is "Tag foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Tag foo"
|
UIA
|
property
|
Name
|
is
|
"Tag foo"
|
ATK
|
property
|
name
|
is
|
"Tag foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Tag foo"
|
Name test case 607
Validation passed
if given
<a href="test.html" id="test">ABC</a>
then the accessible name of the element with id of "test" is "ABC"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"ABC"
|
UIA
|
property
|
Name
|
is
|
"ABC"
|
ATK
|
property
|
name
|
is
|
"ABC"
|
AXAPI
|
property
|
AXDescription
|
is
|
"ABC"
|
Name test case 608
Validation passed
if given
<a href="test.html" id="test" title="Tag"></a>
then the accessible name of the element with id of "test" is "Tag"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Tag"
|
UIA
|
property
|
Name
|
is
|
"Tag"
|
ATK
|
property
|
name
|
is
|
"Tag"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Tag"
|
Name test case 609
Validation passed
if given
<input id="test" type="text" aria-labelledby="ID1 ID2 ID3">
<p id="ID1">foo</p>
<p id="ID2">bar</p>
<p id="ID3">baz</p>
then the accessible name of the element with id of "test" is "foo bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar baz"
|
UIA
|
property
|
Name
|
is
|
"foo bar baz"
|
ATK
|
property
|
name
|
is
|
"foo bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar baz"
|
Name test case 610
Validation passed
if given
<input id="test" type="text" aria-label="bar" aria-labelledby="ID1 test">
<div id="ID1">foo</label>
then the accessible name of the element with id of "test" is "foo bar"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar"
|
UIA
|
property
|
Name
|
is
|
"foo bar"
|
ATK
|
property
|
name
|
is
|
"foo bar"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar"
|
Name test case 611
Validation passed
if given
<input id="test" type="text"/>
<label for="test">foo</label>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 612
Validation passed
if given
<input type="password" id="test">
<label for="test">foo</label>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 613
Validation passed
if given
<input type="checkbox" id="test">
<label for="test">foo</label></body>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 614
Validation passed
if given
<input type="radio" id="test">
<label for="test">foo</label>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 615
Validation passed
if given
<input type="file" id="test">
<label for="test">foo</label>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 616
Validation passed
if given
<input type="image" id="test">
<label for="test">foo</label>
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name test case 617
Validation passed
if given
<input type="checkbox" id="test">
<label for="test">foo<input type="text" value="bar">baz</label>
then the accessible name of the element with id of "test" is "foo bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar baz"
|
UIA
|
property
|
Name
|
is
|
"foo bar baz"
|
ATK
|
property
|
name
|
is
|
"foo bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar baz"
|
Name test case 618
Validation passed
if given
<input type="text" id="test">
<label for="test">foo<input type="text" value="bar">baz</label>
then the accessible name of the element with id of "test" is "foo bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar baz"
|
UIA
|
property
|
Name
|
is
|
"foo bar baz"
|
ATK
|
property
|
name
|
is
|
"foo bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar baz"
|
Name test case 619
Validation passed
if given
<input type="password" id="test">
<label for="test">foo<input type="text" value="bar">baz</label>
then the accessible name of the element with id of "test" is "foo bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar baz"
|
UIA
|
property
|
Name
|
is
|
"foo bar baz"
|
ATK
|
property
|
name
|
is
|
"foo bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar baz"
|
Name test case 620
Validation passed
if given
<input type="radio" id="test">
<label for="test">foo<input type="text" value="bar">baz</label>
then the accessible name of the element with id of "test" is "foo bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar baz"
|
UIA
|
property
|
Name
|
is
|
"foo bar baz"
|
ATK
|
property
|
name
|
is
|
"foo bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar baz"
|
Name test case 621
Validation passed
if given
<input type="file" id="test">
<label for="test">foo <input type="text" value="bar"> baz</label>
then the accessible name of the element with id of "test" is "foo bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar baz"
|
UIA
|
property
|
Name
|
is
|
"foo bar baz"
|
ATK
|
property
|
name
|
is
|
"foo bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar baz"
|
Name test case 659
Validation passed
if given
<style type="text/css">
label:before { content: "foo"; }
label:after { content: "baz"; }
</style>
<form>
<label for="test" title="bar"><input id="test" type="text" name="test" title="buz"></label>
</form>
then the accessible name of the element with id of "test" is "foo bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar baz"
|
UIA
|
property
|
Name
|
is
|
"foo bar baz"
|
ATK
|
property
|
name
|
is
|
"foo bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar baz"
|
Name test case 660
Validation passed
if given
<style type="text/css">
label:before { content: "foo"; }
label:after { content: "baz"; }
</style>
<form>
<label for="test" title="bar"><input id="test" type="password" name="test" title="buz"></label>
</form>
then the accessible name of the element with id of "test" is "foo bar baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo bar baz"
|
UIA
|
property
|
Name
|
is
|
"foo bar baz"
|
ATK
|
property
|
name
|
is
|
"foo bar baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo bar baz"
|
Name test case 661
Validation passed
if given
<style type="text/css">
label:before { content: "foo"; }
label:after { content: "baz"; }
</style>
<form>
<label for="test"><input id="test" type="checkbox" name="test" title=" bar "></label>
</form>
then the accessible name of the element with id of "test" is "foo baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo baz"
|
UIA
|
property
|
Name
|
is
|
"foo baz"
|
ATK
|
property
|
name
|
is
|
"foo baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo baz"
|
Name test case 662
Validation passed
if given
<style type="text/css">
label:before { content: "foo"; }
label:after { content: "baz"; }
</style>
<form>
<label for="test"><input id="test" type="radio" name="test" title=" bar "></label>
</form>
then the accessible name of the element with id of "test" is "foo baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo baz"
|
UIA
|
property
|
Name
|
is
|
"foo baz"
|
ATK
|
property
|
name
|
is
|
"foo baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo baz"
|
Name test case 663 (DO NOT USE)
Validation passed
Note: This is something which should be governed by HTML-AAM, but it's not explicitly covered at the present time. I filed an issue for that: https://github.com/w3c/html-aam/issues/134. That said, I don't think our expectations are correct: For other buttons, HTML-AAM states that if there is a usable value (implied: rendered) that is to be used instead of the file. For the given test case, there is usable text, e.g. "Browse..." displayed.
It was agreed upon during the 10 May ARIA meeting to not include this test in the Accname tests for the reasons described above.
if given
<style type="text/css">
label:before { content: "foo"; }
label:after { content: "baz"; }
</style>
<form>
<label for="test"><input id="test" type="file" name="test" title="bar"></label>
</form>
then the accessible name of the element with id of "test" is "foo baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo baz"
|
UIA
|
property
|
Name
|
is
|
"foo baz"
|
ATK
|
property
|
name
|
is
|
"foo baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo baz"
|
Name test case 663a
Validation passed
if given
<style type="text/css">
label:before { content: "foo"; }
label:after { content: "baz"; }
</style>
<form>
<label for="test"><input id="test" type="image" src="foo.jpg" name="test" title="bar"></label>
</form>
then the accessible name of the element with id of "test" is "foo baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo baz"
|
UIA
|
property
|
Name
|
is
|
"foo baz"
|
ATK
|
property
|
name
|
is
|
"foo baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo baz"
|
Name test case 721
Validation passed
if given
<label for="test">States:</label>
<input type="password" id="test"/>
then the accessible name of the element with id of "test" is "States:"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"States:"
|
UIA
|
property
|
Name
|
is
|
"States:"
|
ATK
|
property
|
name
|
is
|
"States:"
|
AXAPI
|
property
|
AXDescription
|
is
|
"States:"
|
Name test case 723
Validation passed
if given
<label for="test">States:</label>
<input type="checkbox" id="test"/>
then the accessible name of the element with id of "test" is "States:"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"States:"
|
UIA
|
property
|
Name
|
is
|
"States:"
|
ATK
|
property
|
name
|
is
|
"States:"
|
AXAPI
|
property
|
AXDescription
|
is
|
"States:"
|
Name test case 724
Validation passed
if given
<label for="test">States:</label>
<input type="radio" id="test"/>
then the accessible name of the element with id of "test" is "States:"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"States:"
|
UIA
|
property
|
Name
|
is
|
"States:"
|
ATK
|
property
|
name
|
is
|
"States:"
|
AXAPI
|
property
|
AXDescription
|
is
|
"States:"
|
Name test case 725
Validation passed
if given
<label for="test">File:</label>
<input type="file" id="test"/>
then the accessible name of the element with id of "test" is "File:"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"File:"
|
UIA
|
property
|
Name
|
is
|
"File:"
|
ATK
|
property
|
name
|
is
|
"File:"
|
AXAPI
|
property
|
AXDescription
|
is
|
"File:"
|
Name test case 726
Validation passed
if given
<label for="test">States:</label>
<input type="image" id="test" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "States:"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"States:"
|
UIA
|
property
|
Name
|
is
|
"States:"
|
ATK
|
property
|
name
|
is
|
"States:"
|
AXAPI
|
property
|
AXDescription
|
is
|
"States:"
|
Name test case 727
Validation passed
if given
<label for="test">
foo
<input type="text" value="David"/>
</label>
<input type="password" id="test" value="baz"/>
then the accessible name of the element with id of "test" is "foo David"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo David"
|
UIA
|
property
|
Name
|
is
|
"foo David"
|
ATK
|
property
|
name
|
is
|
"foo David"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo David"
|
Name test case 728
Validation passed
if given
<label for="test">
foo
<input type="text" value="David"/>
</label>
<input type="checkbox" id="test"/>
then the accessible name of the element with id of "test" is "foo David"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo David"
|
UIA
|
property
|
Name
|
is
|
"foo David"
|
ATK
|
property
|
name
|
is
|
"foo David"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo David"
|
Name test case 729
Validation passed
if given
<label for="test">
foo
<input type="text" value="David"/>
</label>
<input type="radio" id="test"/>
then the accessible name of the element with id of "test" is "foo David"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo David"
|
UIA
|
property
|
Name
|
is
|
"foo David"
|
ATK
|
property
|
name
|
is
|
"foo David"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo David"
|
Name test case 730
Validation passed
if given
<label for="test">
foo
<input type="text" value="David"/>
</label>
<input type="file" id="test"/>
then the accessible name of the element with id of "test" is "foo David"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo David"
|
UIA
|
property
|
Name
|
is
|
"foo David"
|
ATK
|
property
|
name
|
is
|
"foo David"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo David"
|
Name test case 731
Validation passed
if given
<label for="test">
foo
<input type="text" value="David"/>
</label>
<input type="image" id="test" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "foo David"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo David"
|
UIA
|
property
|
Name
|
is
|
"foo David"
|
ATK
|
property
|
name
|
is
|
"foo David"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo David"
|
Name test case 733
Validation passed
if given
<label for="test">
crazy
<select name="member" size="1" role="menu" tabindex="0">
<option role="menuitem" value="beard" selected="true">clown</option>
<option role="menuitem" value="scuba">rich</option>
</select>
</label>
<input type="password" id="test"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 734
Validation passed
if given
<label for="test">
crazy
<select name="member" size="1" role="menu" tabindex="0">
<option role="menuitem" value="beard" selected="true">clown</option>
<option role="menuitem" value="scuba">rich</option>
</select>
</label>
<input type="checkbox" id="test"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 735
Validation passed
if given
<label for="test">
crazy
<select name="member" size="1" role="menu" tabindex="0">
<option role="menuitem" value="beard" selected="true">clown</option>
<option role="menuitem" value="scuba">rich</option>
</select>
</label>
<input type="radio" id="test"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 736
Validation passed
if given
<label for="test">
crazy
<select name="member" size="1" role="menu" tabindex="0">
<option role="menuitem" value="beard" selected="true">clown</option>
<option role="menuitem" value="scuba">rich</option>
</select>
</label>
<input type="file" id="test"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 737
Validation passed
if given
<label for="test">
crazy
<select name="member" size="1" role="menu" tabindex="0">
<option role="menuitem" value="beard" selected="true">clown</option>
<option role="menuitem" value="scuba">rich</option>
</select>
</label>
<input type="image" id="test" src="foo.jpg"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 738
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuetext="Monday" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="password" value="baz" id="test"/>
then the accessible name of the element with id of "test" is "crazy Monday"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy Monday"
|
UIA
|
property
|
Name
|
is
|
"crazy Monday"
|
ATK
|
property
|
name
|
is
|
"crazy Monday"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy Monday"
|
Name test case 739
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuetext="Monday" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="checkbox" id="test"/>
then the accessible name of the element with id of "test" is "crazy Monday"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy Monday"
|
UIA
|
property
|
Name
|
is
|
"crazy Monday"
|
ATK
|
property
|
name
|
is
|
"crazy Monday"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy Monday"
|
Name test case 740
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuetext="Monday" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="radio" id="test"/>
then the accessible name of the element with id of "test" is "crazy Monday"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy Monday"
|
UIA
|
property
|
Name
|
is
|
"crazy Monday"
|
ATK
|
property
|
name
|
is
|
"crazy Monday"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy Monday"
|
Name test case 741
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuetext="Monday" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="file" id="test"/>
then the accessible name of the element with id of "test" is "crazy Monday"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy Monday"
|
UIA
|
property
|
Name
|
is
|
"crazy Monday"
|
ATK
|
property
|
name
|
is
|
"crazy Monday"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy Monday"
|
Name test case 742
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuetext="Monday" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="image" src="foo.jpg" id="test"/>
then the accessible name of the element with id of "test" is "crazy Monday"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy Monday"
|
UIA
|
property
|
Name
|
is
|
"crazy Monday"
|
ATK
|
property
|
name
|
is
|
"crazy Monday"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy Monday"
|
Name test case 743
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="password" id="test" value="baz"/>
then the accessible name of the element with id of "test" is "crazy 4"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy 4"
|
UIA
|
property
|
Name
|
is
|
"crazy 4"
|
ATK
|
property
|
name
|
is
|
"crazy 4"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy 4"
|
Name test case 744
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="checkbox" id="test"/>
then the accessible name of the element with id of "test" is "crazy 4"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy 4"
|
UIA
|
property
|
Name
|
is
|
"crazy 4"
|
ATK
|
property
|
name
|
is
|
"crazy 4"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy 4"
|
Name test case 745
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="radio" id="test"/>
then the accessible name of the element with id of "test" is "crazy 4"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy 4"
|
UIA
|
property
|
Name
|
is
|
"crazy 4"
|
ATK
|
property
|
name
|
is
|
"crazy 4"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy 4"
|
Name test case 746
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="file" id="test"/>
then the accessible name of the element with id of "test" is "crazy 4"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy 4"
|
UIA
|
property
|
Name
|
is
|
"crazy 4"
|
ATK
|
property
|
name
|
is
|
"crazy 4"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy 4"
|
Name test case 747
Validation passed
if given
<label for="test">
crazy
<div role="spinbutton" aria-valuemin="1" aria-valuemax="7" aria-valuenow="4">
</div>
</label>
<input type="image" src="foo.jpg" id="test"/>
then the accessible name of the element with id of "test" is "crazy 4"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy 4"
|
UIA
|
property
|
Name
|
is
|
"crazy 4"
|
ATK
|
property
|
name
|
is
|
"crazy 4"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy 4"
|
Name test case 748
Validation passed
if given
<input type="password" id="test" title="crazy" value="baz"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 749
Validation passed
if given
<input type="checkbox" id="test" title="crazy"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 750
Validation passed
if given
<input type="radio" id="test" title="crazy"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 751
Validation passed
if given
<input type="file" id="test" title="crazy"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 752
Validation passed
if given
<input type="image" src="foo.jpg" id="test" title="crazy"/>
then the accessible name of the element with id of "test" is "crazy"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"crazy"
|
UIA
|
property
|
Name
|
is
|
"crazy"
|
ATK
|
property
|
name
|
is
|
"crazy"
|
AXAPI
|
property
|
AXDescription
|
is
|
"crazy"
|
Name test case 753
Validation passed
if given
<style>
label:before { content:"fancy "; }
</style>
<label for="test">fruit</label>
<input type="password" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 754
Validation passed
if given
<style>
label:before { content:"fancy "; }
</style>
<label for="test">fruit</label>
<input type="checkbox" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 755
Validation passed
if given
<style>
label:before { content:"fancy "; }
</style>
<label for="test">fruit</label>
<input type="radio" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 756
Validation passed
if given
<style>
label:before { content:"fancy "; }
</style>
<label for="test">fruit</label>
<input type="file" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 757
Validation passed
if given
<style>
label:before { content:"fancy "; }
</style>
<label for="test">fruit</label>
<input type="image" src="foo.jpg" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 758
Validation passed
if given
<style>
label:after { content:" fruit"; }
</style>
<label for="test">fancy</label>
<input type="password" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 759
Validation passed
if given
<style>
label:after { content:" fruit"; }
</style>
<label for="test">fancy</label>
<input type="checkbox" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 760
Validation passed
if given
<style>
label:after { content:" fruit"; }
</style>
<label for="test">fancy</label>
<input type="radio" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 761
Validation passed
if given
<style>
label:after { content:" fruit"; }
</style>
<label for="test">fancy</label>
<input type="file" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fruitfancy"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name test case 762
Validation passed
if given
<style>
label:after { content:" fruit"; }
</style>
<label for="test">fancy</label>
<input type="image" src="foo.jpg" id="test"/>
then the accessible name of the element with id of "test" is "fancy fruit"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"fancy fruit"
|
UIA
|
property
|
Name
|
is
|
"fancy fruit"
|
ATK
|
property
|
name
|
is
|
"fancy fruit"
|
AXAPI
|
property
|
AXDescription
|
is
|
"fancy fruit"
|
Name checkbox-label-embedded-combobox
Validation passed
if given
<input type="checkbox" id="test" />
<label for="test">Flash the screen
<div role="combobox">
<div role="textbox"></div>
<ul role="listbox" style="list-style-type: none;">
<li role="option" aria-selected="true">1</li>
<li role="option">2</li>
<li role="option">3</li>
</ul>
</div>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Validation passed
if given
<input type="checkbox" id="test" />
<label for="test">Flash the screen
<span role="menu">
<span role="menuitem" aria-selected="true">1</span>
<span role="menuitem" hidden>2</span>
<span role="menuitem" hidden>3</span>
</span>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen times."
|
Name checkbox-label-embedded-select
Validation passed
if given
<input type="checkbox" id="test" />
<label for="test">Flash the screen
<select size="1">
<option selected="selected">1</option>
<option>2</option>
<option>3</option>
</select>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Name checkbox-label-embedded-slider
Validation passed
if given
<input type="checkbox" id="test" />
<label for="test">foo <input role="slider" type="range" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name checkbox-label-embedded-spinbutton
Validation passed
if given
<input type="checkbox" id="test" />
<label for="test">foo <input role="spinbutton" type="number" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name checkbox-title
Validation passed
if given
<input type="checkbox" id="test" title="foo" />
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name file-label-embedded-combobox
Validation passed
if given
<input type="file" id="test" />
<label for="test">Flash the screen
<div role="combobox">
<div role="textbox"></div>
<ul role="listbox" style="list-style-type: none;">
<li role="option" aria-selected="true">1 </li>
<li role="option">2 </li>
<li role="option">3 </li>
</ul>
</div>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Validation passed
if given
<input type="file" id="test" />
<label for="test">Flash the screen
<span role="menu">
<span role="menuitem" aria-selected="true">1</span>
<span role="menuitem" hidden>2</span>
<span role="menuitem" hidden>3</span>
</span>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen times."
|
Name file-label-embedded-select
Validation passed
if given
<input type="file" id="test" />
<label for="test">Flash the screen
<select size="1">
<option selected="selected">1</option>
<option>2</option>
<option>3</option>
</select>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Name file-label-embedded-slider
Validation passed
if given
<input type="file" id="test" />
<label for="test">foo <input role="slider" type="range" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name file-label-embedded-spinbutton
Validation passed
if given
<input type="file" id="test" />
<label for="test">foo <input role="spinbutton" type="number" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name file-title
Validation passed
if given
<input type="file" id="test" title="foo" />
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name image-title
Validation passed
if given
<input type="image" src="test.png" id="test" title="foo" />
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name password-label-embedded-combobox
Validation passed
if given
<input type="password" id="test" />
<label for="test">Flash the screen
<div role="combobox">
<div role="textbox"></div>
<ul role="listbox" style="list-style-type: none;">
<li role="option" aria-selected="true">1</li>
<li role="option">2</li>
<li role="option">3</li>
</ul>
</div>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Validation passed
if given
<input type="password" id="test" />
<label for="test">Flash the screen
<span role="menu">
<span role="menuitem" aria-selected="true">1</span>
<span role="menuitem" hidden>2</span>
<span role="menuitem" hidden>3</span>
</span>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen times."
|
Name password-label-embedded-select
Validation passed
if given
<input type="password" id="test" />
<label for="test">Flash the screen
<select size="1">
<option selected="selected">1</option>
<option>2</option>
<option>3</option>
</select>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Name password-label-embedded-slider
Validation passed
if given
<input type="password" id="test" />
<label for="test">foo <input role="slider" type="range" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name password-label-embedded-spinbutton
Validation passed
if given
<input type="password" id="test" />
<label for="test">foo <input role="spinbutton" type="number" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name password-title
Validation passed
if given
<input type="password" id="test" title="foo" />
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name radio-label-embedded-combobox
Validation passed
if given
<input type="radio" id="test" />
<label for="test">Flash the screen
<div role="combobox">
<div role="textbox"></div>
<ul role="listbox" style="list-style-type: none;">
<li role="option" aria-selected="true">1</li>
<li role="option">2</li>
<li role="option">3</li>
</ul>
</div>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Validation passed
if given
<input type="radio" id="test" />
<label for="test">Flash the screen
<span role="menu">
<span role="menuitem" aria-selected="true">1</span>
<span role="menuitem" hidden>2</span>
<span role="menuitem" hidden>3</span>
</span>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen times."
|
Name radio-label-embedded-select
Validation passed
if given
<input type="radio" id="test" />
<label for="test">Flash the screen
<select size="1">
<option selected="selected">1</option>
<option>2</option>
<option>3</option>
</select>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Name radio-label-embedded-slider
Validation passed
if given
<input type="radio" id="test" />
<label for="test">foo <input role="slider" type="range" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name radio-label-embedded-spinbutton
Validation passed
if given
<input type="radio" id="test" />
<label for="test">foo <input role="spinbutton" type="number" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name radio-title
Validation passed
if given
<input type="radio" id="test" title="foo" />
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Name text-label-embedded-combobox
Validation passed
if given
<input type="text" id="test" />
<label for="test">Flash the screen
<div role="combobox">
<div role="textbox"></div>
<ul role="listbox" style="list-style-type: none;">
<li role="option" aria-selected="true">1</li>
<li role="option">2</li>
<li role="option">3</li>
</ul>
</div>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Validation passed
if given
<input type="text" id="test" />
<label for="test">Flash the screen
<span role="menu">
<span role="menuitem" aria-selected="true">1</span>
<span role="menuitem" hidden>2</span>
<span role="menuitem" hidden>3</span>
</span>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen times."
|
Name text-label-embedded-select
Validation passed
if given
<input type="text" id="test" />
<label for="test">Flash the screen
<select size="1">
<option selected="selected">1</option>
<option>2</option>
<option>3</option>
</select>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Name text-label-embedded-slider
Validation passed
if given
<input type="text" id="test" />
<label for="test">foo <input role="slider" type="range" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name text-label-embedded-spinbutton
Validation passed
if given
<input type="text" id="test" />
<label for="test">foo <input role="spinbutton" type="number" value="5" min="1" max="10" aria-valuenow="5" aria-valuemin="1" aria-valuemax="10"> baz
</label>
then the accessible name of the element with id of "test" is "foo 5 baz"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo 5 baz"
|
UIA
|
property
|
Name
|
is
|
"foo 5 baz"
|
ATK
|
property
|
name
|
is
|
"foo 5 baz"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo 5 baz"
|
Name text-title
Validation passed
if given
<input type="text" id="test" title="foo" />
then the accessible name of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"foo"
|
UIA
|
property
|
Name
|
is
|
"foo"
|
ATK
|
property
|
name
|
is
|
"foo"
|
AXAPI
|
property
|
AXDescription
|
is
|
"foo"
|
Description Tests from ARIA 1.0
Description test case 557
if given
<img id="test" src="foo.jpg" aria-label="1" alt="a" title="t"/>
then the accessible description of the element with id of "test" is "t"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"t"
|
UIA
|
property
|
Description
|
is
|
"t"
|
ATK
|
property
|
description
|
is
|
"t"
|
AXAPI
|
property
|
AXHelp
|
is
|
"t"
|
Description test case 664
Validation passed
if given
<div>
<img id="test" aria-describedby="ID1" src="test.png">
</div>
<div id="ID1">foo</div>
then the accessible description of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"foo"
|
UIA
|
property
|
Description
|
is
|
"foo"
|
ATK
|
property
|
description
|
is
|
"foo"
|
AXAPI
|
property
|
AXHelp
|
is
|
"foo"
|
Description test case 665
Validation passed
if given
<div>
<img id="test" aria-describedby="ID1" src="test.png">
</div>
<div id="ID1" style="display:none">foo</div>
then the accessible description of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"foo"
|
UIA
|
property
|
Description
|
is
|
"foo"
|
ATK
|
property
|
description
|
is
|
"foo"
|
AXAPI
|
property
|
AXHelp
|
is
|
"foo"
|
Description test case 666
Validation passed
if given
<div>
<img id="test" aria-describedby="ID1" src="test.png">
</div>
<div id="ID1" role="presentation">foo</div>
then the accessible description of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"foo"
|
UIA
|
property
|
Description
|
is
|
"foo"
|
ATK
|
property
|
description
|
is
|
"foo"
|
AXAPI
|
property
|
AXHelp
|
is
|
"foo"
|
Description test case 772
Validation passed
if given
<img src="foo.jpg" id="test" alt="test" aria-describedby="t1">
<div id="t1">foo</div>
then the accessible description of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"foo"
|
UIA
|
property
|
Description
|
is
|
"foo"
|
ATK
|
property
|
description
|
is
|
"foo"
|
AXAPI
|
property
|
AXHelp
|
is
|
"foo"
|
Description test case 773
Validation passed
if given
<img src="foo.jpg" id="test" alt="test" aria-describedby="t1">
<div id="t1" style="display:none">foo</div>
then the accessible description of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"foo"
|
UIA
|
property
|
Description
|
is
|
"foo"
|
ATK
|
property
|
description
|
is
|
"foo"
|
AXAPI
|
property
|
AXHelp
|
is
|
"foo"
|
Description test case 774
Validation passed
if given
<img src="foo.jpg" id="test" alt="test" aria-describedby="t1">
<span id="t1" role="presentation">foo</span>
then the accessible description of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"foo"
|
UIA
|
property
|
Description
|
is
|
"foo"
|
ATK
|
property
|
description
|
is
|
"foo"
|
AXAPI
|
property
|
AXHelp
|
is
|
"foo"
|
Description test case 838
Validation passed
if given
<img src="foo.jpg" id="test" alt="test" aria-describedby="t1">
<div id="t1" style="visibility:hidden">foo</div>
then the accessible description of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"foo"
|
UIA
|
property
|
Description
|
is
|
"foo"
|
ATK
|
property
|
description
|
is
|
"foo"
|
AXAPI
|
property
|
AXHelp
|
is
|
"foo"
|
Description test case broken reference
Validation passed
if given
<img src="foo.jpg" id="test" alt="test" aria-describedby="t1">
then the accessible description of the element with id of "test" is ""
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
""
|
UIA
|
property
|
Description
|
is
|
""
|
ATK
|
property
|
description
|
is
|
""
|
AXAPI
|
property
|
AXHelp
|
is
|
""
|
Description test case one valid reference
Validation passed
if given
<img src="foo.jpg" id="test" alt="test" aria-describedby="t1 t2 t3">
<div id="t2">foo</div>
then the accessible description of the element with id of "test" is "foo"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"foo"
|
UIA
|
property
|
Description
|
is
|
"foo"
|
ATK
|
property
|
description
|
is
|
"foo"
|
AXAPI
|
property
|
AXHelp
|
is
|
"foo"
|
Bryan Garaventa's Additional Tests
Note: These tests were taken from https://github.com/WhatSock/w3c-alternative-text-computation
Name from content
Validation passed
if given
<style>
.hidden { display: none; }
</style>
<div id="test" role="link" tabindex="0">
<span aria-hidden="true"><i> Hello, </i></span>
<span>My</span> name is
<div><img src="file.jpg" title="Bryan" alt="" role="presentation" /></div>
<span role="presentation" aria-label="Eli">
<span aria-label="Garaventa">Zambino</span>
</span>
<span>the weird.</span>
(QED)
<span class="hidden"><i><b>and don't you forget it.</b></i></span>
<table>
<tr>
<td>Where</td>
<td style="visibility:hidden;"><div>in</div></td>
<td><div style="display:none;">the world</div></td>
<td>are my marbles?</td>
</tr>
</table>
</div>
then the accessible name of the element with id of "test" is "My name is Eli the weird. (QED) Where are my marbles?"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
UIA
|
property
|
Name
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
ATK
|
property
|
name
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
AXAPI
|
property
|
AXDescription
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
Name from content of labelledby element
Validation passed
if given
<style>
.hidden { display: none; }
</style>
<input id="test" type="text" aria-labelledby="lblId" />
<div id="lblId" >
<span aria-hidden="true"><i> Hello, </i></span>
<span>My</span> name is
<div><img src="file.jpg" title="Bryan" alt="" role="presentation" /></div>
<span role="presentation" aria-label="Eli">
<span aria-label="Garaventa">Zambino</span>
</span>
<span>the weird.</span>
(QED)
<span class="hidden"><i><b>and don't you forget it.</b></i></span>
<table>
<tr>
<td>Where</td>
<td style="visibility:hidden;"><div>in</div></td>
<td><div style="display:none;">the world</div></td>
<td>are my marbles?</td>
</tr>
</table>
</div>
then the accessible name of the element with id of "test" is "My name is Eli the weird. (QED) Where are my marbles?"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
UIA
|
property
|
Name
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
ATK
|
property
|
name
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
AXAPI
|
property
|
AXDescription
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
Name from content of label
Validation passed
if given
<style>
.hidden { display: none; }
</style>
<input type="text" id="test" />
<label for="test" id="label">
<span aria-hidden="true"><i> Hello, </i></span>
<span>My</span> name is
<div><img src="file.jpg" title="Bryan" alt="" role="presentation" /></div>
<span role="presentation" aria-label="Eli">
<span aria-label="Garaventa">Zambino</span>
</span>
<span>the weird.</span>
(QED)
<span class="hidden"><i><b>and don't you forget it.</b></i></span>
<table>
<tr>
<td>Where</td>
<td style="visibility:hidden;"><div>in</div></td>
<td><div style="display:none;">the world</div></td>
<td>are my marbles?</td>
</tr>
</table>
</label>
then the accessible name of the element with id of "test" is "My name is Eli the weird. (QED) Where are my marbles?"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
UIA
|
property
|
Name
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
ATK
|
property
|
name
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
AXAPI
|
property
|
AXDescription
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
Description from content of describedby element
Validation passed
if given
<style>
.hidden { display: none; }
</style>
<input id="test" type="text" aria-label="Important stuff" aria-describedby="descId" />
<div>
<div id="descId">
<span aria-hidden="true"><i> Hello, </i></span>
<span>My</span> name is
<div><img src="file.jpg" title="Bryan" alt="" role="presentation" /></div>
<span role="presentation" aria-label="Eli">
<span aria-label="Garaventa">Zambino</span>
</span>
<span>the weird.</span>
(QED)
<span class="hidden"><i><b>and don't you forget it.</b></i></span>
<table>
<tr>
<td>Where</td>
<td style="visibility:hidden;"><div>in</div></td>
<td><div style="display:none;">the world</div></td>
<td>are my marbles?</td>
</tr>
</table>
</div>
</div>
then the accessible description of the element with id of "test" is "My name is Eli the weird. (QED) Where are my marbles?"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
UIA
|
property
|
Description
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
ATK
|
property
|
description
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
AXAPI
|
property
|
AXHelp
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
Name from content of labelledby elements one of which is hidden
Validation passed
if given
<style>
.hidden { display: none; }
</style>
<div>
<input id="test" type="text" aria-labelledby="lbl1 lbl2" aria-describedby="descId" />
<span>
<span aria-hidden="true" id="lbl1">Important</span>
<span class="hidden">
<span aria-hidden="true" id="lbl2">stuff</span>
</span>
</span>
</div>
<div class="hidden">
<div id="descId">
<span aria-hidden="true"><i> Hello, </i></span>
<span>My</span> name is
<div><img src="file.jpg" title="Bryan" alt="" role="presentation" /></div>
<span role="presentation" aria-label="Eli">
<span aria-label="Garaventa">Zambino</span>
</span>
<span>the weird.</span>
(QED)
<span class="hidden"><i><b>and don't you forget it.</b></i></span>
<table>
<tr>
<td>Where</td>
<td style="visibility:hidden;"><div>in</div></td>
<td><div style="display:none;">the world</div></td>
<td>are my marbles?</td>
</tr>
</table>
</div>
</div>
then the accessible name of the element with id of "test" is |"Important stuff"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Important stuff"
|
UIA
|
property
|
Name
|
is
|
"Important stuff"
|
ATK
|
property
|
name
|
is
|
"Important stuff"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Important stuff"
|
Name 1.0 combobox-focusable-alternative
Validation passed
if given
<input id="test" role="combobox" type="text" title="Choose your language" value="English">
then the accessible name of the element with id of "test" is "Choose your language"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Choose your language"
|
UIA
|
property
|
Name
|
is
|
"Choose your language"
|
ATK
|
property
|
name
|
is
|
"Choose your language"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Choose your language"
|
Name 1.0 combobox-focusable
Validation passed
if given
<div id="test" role="combobox" tabindex="0" title="Choose your language.">
<span> English </span>
</div>
then the accessible name of the element with id of "test" is "Choose your language."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Choose your language."
|
UIA
|
property
|
Name
|
is
|
"Choose your language."
|
ATK
|
property
|
name
|
is
|
"Choose your language."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Choose your language."
|
Description 1.0 combobox-focusable
Validation passed
if given
<div id="test" role="combobox" tabindex="0" title="Choose your language.">
<span> English </span>
</div>
then the accessible description of the element with id of "test" is ""
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
""
|
UIA
|
property
|
Description
|
is
|
""
|
ATK
|
property
|
description
|
is
|
""
|
AXAPI
|
property
|
AXHelp
|
is
|
""
|
Name checkbox-label-embedded-listbox
Validation passed (See issue for proposed spec change)
if given
<input type="checkbox" id="test" />
<label for="test">Flash the screen
<ul role="listbox" style="list-style-type: none;">
<li role="option" aria-selected="true">1</li>
<li role="option">2</li>
<li role="option">3</li>
</ul>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Name checkbox-label-embedded-textbox
Validation passed
if given
<input type="checkbox" id="test" />
<label for="test">Flash the screen
<div role="textbox" contenteditable>1</div>
times.
</label>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Name checkbox-label-multiple-label-alternative
Validation passed
if given
<label for="test">a test</label>
<label>This <input type="checkbox" id="test" /> is</label>
then the accessible name of the element with id of "test" is "a test This is"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"a test This is"
|
UIA
|
property
|
Name
|
is
|
"a test This is"
|
ATK
|
property
|
name
|
is
|
"a test This is"
|
AXAPI
|
property
|
AXDescription
|
is
|
"a test This is"
|
Name checkbox-label-multiple-label
Validation passed
if given
<label>This <input type="checkbox" id="test" /> is</label>
<label for="test">a test</label>
then the accessible name of the element with id of "test" is "This is a test"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"This is a test"
|
UIA
|
property
|
Name
|
is
|
"This is a test"
|
ATK
|
property
|
name
|
is
|
"This is a test"
|
AXAPI
|
property
|
AXDescription
|
is
|
"This is a test"
|
Name file-label-inline-block-elements
Validation passed
if given
<input type="file" id="test" />
<label for="test">W<i>h<b>a</b></i>t<br>is<div>your<div>name<b>?</b></div></div></label>
then the accessible name of the element with id of "test" is "What is your name?"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"What is your name?"
|
UIA
|
property
|
Name
|
is
|
"What is your name?"
|
ATK
|
property
|
name
|
is
|
"What is your name?"
|
AXAPI
|
property
|
AXDescription
|
is
|
"What is your name?"
|
Name file-label-inline-block-styles
Validation passed
if given
<style>
label:before { content: "This"; display: block; }
label:after { content: "."; }
</style>
<label for="test">is a test</label>
<input type="text" id="test"/>
then the accessible name of the element with id of "test" is "This is a test."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"This is a test."
|
UIA
|
property
|
Name
|
is
|
"This is a test."
|
ATK
|
property
|
name
|
is
|
"This is a test."
|
AXAPI
|
property
|
AXDescription
|
is
|
"This is a test."
|
Name file-label-inline-hidden-elements
Validation passed
if given
<style>
.hidden { display: none; }
</style>
<input type="file" id="test" />
<label for="test">
<span class="hidden">1</span><span>2</span>
<span style="visibility: hidden;">3</span><span>4</span>
<span hidden>5</span><span>6</span>
<span aria-hidden="true">7</span><span>8</span>
<span aria-hidden="false" class="hidden">9</span><span>10</span>
</label>
then the accessible name of the element with id of "test" is "2 4 6 8 10"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"2 4 6 8 10"
|
UIA
|
property
|
Name
|
is
|
"2 4 6 8 10"
|
ATK
|
property
|
name
|
is
|
"2 4 6 8 10"
|
AXAPI
|
property
|
AXDescription
|
is
|
"2 4 6 8 10"
|
Name file-label-owned-combobox-owned-listbox
Validation passed
if given
<input type="file" id="test" />
<label for="test">Flash <span aria-owns="id1">the screen</span> times.</label>
<div>
<div id="id1" role="combobox" aria-owns="id2">
<div role="textbox"></div>
</div>
</div>
<div>
<ul id="id2" role="listbox" style="list-style-type: none;">
<li role="option" >1 </li>
<li role="option" aria-selected="true">2 </li>
<li role="option">3 </li>
</ul>
</div>
then the accessible name of the element with id of "test" is "Flash the screen 2 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 2 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 2 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 2 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 2 times."
|
Name file-label-owned-combobox
Validation passed
if given
<input type="file" id="test" />
<label for="test">Flash <span aria-owns="id1">the screen</span> times.</label>
<div id="id1">
<div role="combobox">
<div role="textbox"></div>
<ul role="listbox" style="list-style-type: none;">
<li role="option" aria-selected="true">1 </li>
<li role="option">2 </li>
<li role="option">3 </li>
</ul>
</div>
</div>
then the accessible name of the element with id of "test" is "Flash the screen 1 times."
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Flash the screen 1 times."
|
UIA
|
property
|
Name
|
is
|
"Flash the screen 1 times."
|
ATK
|
property
|
name
|
is
|
"Flash the screen 1 times."
|
AXAPI
|
property
|
AXDescription
|
is
|
"Flash the screen 1 times."
|
Name link-mixed-content
Validation passed
if given
<style>
.hidden { display: none; }
</style>
<div id="test" role="link" tabindex="0">
<span aria-hidden="true"><i> Hello, </i></span>
<span>My</span> name is
<div><img src="file.jpg" title="Bryan" alt="" role="presentation" /></div>
<span role="presentation" aria-label="Eli"><span aria-label="Garaventa">Zambino</span></span>
<span>the weird.</span>
(QED)
<span class="hidden"><i><b>and don't you forget it.</b></i></span>
</div>
then the accessible name of the element with id of "test" is "My name is Eli the weird. (QED)"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"My name is Eli the weird. (QED)"
|
UIA
|
property
|
Name
|
is
|
"My name is Eli the weird. (QED)"
|
ATK
|
property
|
name
|
is
|
"My name is Eli the weird. (QED)"
|
AXAPI
|
property
|
AXDescription
|
is
|
"My name is Eli the weird. (QED)"
|
Description from content of describedby element which is hidden (DO NOT USE)
Validation passed
The results of this test seem incorrect according to what is in the spec. See https://lists.w3.org/Archives/Public/public-aria/2018May/0009.html. At the 10 May ARIA meeting, we agreed that what is in the spec is probably not what we intended and that we will fix this in 1.2. In the meantime, this test case is invalid and should not be included in the WPT test suite.
if given
<style>
.hidden { display: none; }
</style>
<div>
<input id="test" type="text" aria-labelledby="lbl1 lbl2" aria-describedby="descId" />
<span>
<span aria-hidden="true" id="lbl1">Important</span>
<span class="hidden">
<span aria-hidden="true" id="lbl2">stuff</span>
</span>
</span>
</div>
<div class="hidden">
<div id="descId">
<span aria-hidden="true"><i> Hello, </i></span>
<span>My</span> name is
<div><img src="file.jpg" title="Bryan" alt="" role="presentation" /></div>
<span role="presentation" aria-label="Eli">
<span aria-label="Garaventa">Zambino</span>
</span>
<span>the weird.</span>
(QED)
<span class="hidden"><i><b>and don't you forget it.</b></i></span>
<table>
<tr>
<td>Where</td>
<td style="visibility:hidden;"><div>in</div></td>
<td><div style="display:none;">the world</div></td>
<td>are my marbles?</td>
</tr>
</table>
</div>
</div>
then the accessible description of the element with id of "test" is "My name is Eli the weird. (QED) Where are my marbles?"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
UIA
|
property
|
Description
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
ATK
|
property
|
description
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
AXAPI
|
property
|
AXHelp
|
is
|
"My name is Eli the weird. (QED) Where are my marbles?"
|
Name link-with-label
Validation passed
if given
<a id="test" href="#" aria-label="California" title="San Francisco" >United States</a>
then the accessible name of the element with id of "test" is "California"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"California"
|
UIA
|
property
|
Name
|
is
|
"California"
|
ATK
|
property
|
name
|
is
|
"California"
|
AXAPI
|
property
|
AXDescription
|
is
|
"California"
|
Name heading-combobox-focusable-alternative
Validation passed
if given
<h2 id="test">
Country of origin:
<input role="combobox" type="text" title="Choose your country." value="United States">
</h2>
then the accessible name of the element with id of "test" is "Country of origin: United States"
element test
|
IAccessible2
|
property
|
accName
|
is
|
"Country of origin: United States"
|
UIA
|
property
|
Name
|
is
|
"Country of origin: United States"
|
ATK
|
property
|
name
|
is
|
"Country of origin: United States"
|
AXAPI
|
property
|
AXDescription
|
is
|
"Country of origin: United States"
|
Description link-with-label
Validation passed
if given
<a id="test" href="#" aria-label="California" title="San Francisco" >United States</a>
then the accessible description of the element with id of "test" is "San Francisco"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"San Francisco"
|
UIA
|
property
|
Description
|
is
|
"San Francisco"
|
ATK
|
property
|
description
|
is
|
"San Francisco"
|
AXAPI
|
property
|
AXHelp
|
is
|
"San Francisco"
|
Description title-same-element
Validation passed
if given
<div><input aria-label="Name" id="test" title="Title" aria-describedby="ID1" type="text"></div>
<div id="ID1">Description</div>
then the accessible name of the element with id of "test" is "Description"
element test
|
IAccessible2
|
property
|
accDescription
|
is
|
"Description"
|
UIA
|
property
|
Description
|
is
|
"Description"
|
ATK
|
property
|
description
|
is
|
"Description"
|
AXAPI
|
property
|
AXHelp
|
is
|
"Description"
|