blob: b2ddb3b076d46865374140936746d03c6c2d214d [file] [log] [blame]
<!--
* Copyright 2014 The Chromium Authors. All rights reserved. Use of this
* source code is governed by a BSD-style license that can be found in the
* LICENSE file.
-->
<html>
<head>
<title>Automation Tests - Attributes</title>
</head>
<body>
<!-- activedescendant attribute, owns default attribute-->
<input type="text" aria-activedescendant="opt6" aria-readonly="true"
aria-autocomplete="list" role="combobox"
id="combobox-edit">
<ul aria-expanded="true" role="listbox" id="combobox-list">
<li role="option" id="opt1">Alabama</li>
<li role="option" id="opt2">Alaska</li>
<li role="option" id="opt3">American Samoa</li>
<li role="option" id="opt4">Arizona</li>
<li role="option" id="opt5">Arkansas</li>
<li role="option" id="opt6">California</li>
<li role="option" id="opt7">Colorado</li>
</ul>
<!-- link attributes -->
<a href="about://blank" id="real-link">Real link</a>
<div role="link" id="link-role">ARIA link</div>
<!-- editable text attributes -->
<input type="text" value="Text input" aria-label="text-input" id="text-input"></input>
<textarea aria-label="textarea">Textarea</textarea>
<div tabindex="0" contenteditable role="textbox" aria-label="textbox-role">
Textbox
</div>
<script>
document.querySelector('#text-input').setSelectionRange(2, 8);
</script>
<!-- range attributes -->
<input type="range" aria-label="range-input" max="5" value="4"></input>
<div tabindex="0" role="slider" aria-valuemin="1" aria-valuemax="10"
aria-valuenow="7" aria-valuetext="seven stars"
aria-label="slider-role"></div>
<div tabindex="0" role="spinbutton" aria-valuemin="1" aria-valuemax="31"
aria-valuenow="14" id="spinbutton-role"></div>
<div tabindex="0" role="progressbar" aria-valuemin="0" aria-valuenow="0.9"
aria-valuemax="1.0" aria-label="progressbar-role"></div>
<div tabindex="0" role="scrollbar" aria-valuemin="0" aria-valuenow="0"
aria-valuemax="1.0" aria-orientation="vertical" aria-controls="main"
id="scrollbar-role"></div>
<div id="main" aria-label="main">Content for scrollbar to control</div>
<!-- table and cell attributes -->
<!-- The first 100 rows and the first 50 columns are missing. -->
<table id="table" role="grid" aria-rowcount="103" aria-colcount="53">
<tr role="row">
<td role="cell" aria-rowindex="101" aria-colindex="51">Cell spanning one column</td>
<td role="cell" aria-rowindex="101" aria-colindex="52">Cell spanning one column</td>
<td role="cell" aria-rowindex="101" aria-colindex="53">Cell spanning one column</td>
<tr role="row">
<td colspan="2" role="cell" aria-rowindex="102" aria-colindex="51">Cell spanning two columns</td>
<td rowspan="2" role="cell" aria-rowindex="102" aria-colindex="53">Cell spanning two rows</td>
</tr>
<tr role="row">
<td role="cell" aria-rowindex="103" aria-colindex="51">Cell spanning one column</td>
<td role="cell" aria-rowindex="103" aria-colindex="52">Cell spanning one column</td>
</tr>
</table>
<p id="Spanish" lang="es-ES">Hola</p>
<!-- checked attribute -->
<div id="check-test-1" aria-label="check-test-1" role="checkbox" aria-checked="true">Checked</div>
<div id="check-test-2" aria-label="check-test-2" role="checkbox" aria-checked="false">Unchecked</div>
<div id="check-test-3" aria-label="check-test-3" role="checkbox" aria-checked="mixed">Mixed</div>
<div id="check-test-4" aria-label="check-test-4" aria-checked="true">Not a checkbox</div>
</body>
</html>