diff options
Diffstat (limited to 'accessible/tests/mochitest/jsat/doc_traversal.html')
| -rw-r--r-- | accessible/tests/mochitest/jsat/doc_traversal.html | 164 |
1 files changed, 164 insertions, 0 deletions
diff --git a/accessible/tests/mochitest/jsat/doc_traversal.html b/accessible/tests/mochitest/jsat/doc_traversal.html new file mode 100644 index 000000000..4c104b6b7 --- /dev/null +++ b/accessible/tests/mochitest/jsat/doc_traversal.html @@ -0,0 +1,164 @@ +<!DOCTYPE html> +<html> +<head> + <title>Traversal Rule test document</title> + <meta charset="utf-8" /> + <style> + .content:before { + content: "Content"; + } + </style> +</head> +<body> + <header id="header-1"> + <h3 id="heading-1">A small first heading</h3> + <form> + <label for="input-1-1">Name:</label> + <input id="input-1-1"> + <label id="label-1-2">Favourite Ice Cream Flavour:<input id="input-1-2"></label> + <button id="button-1-1">Magic Button</button> + <label for="radio-1-1">Radios are old: </label> + <input id="radio-1-1" type="radio"> + <label for="radio-1-2">Radios are new: </label> + <input id="radio-1-2" type="radio"> + <label for="input-1-3">Password:</label> + <input id="input-1-3" type="password"> + <label for="input-1-4">Unlucky number:</label> + <input id="input-1-4" type="tel"> + <input id="button-1-2" type="button" value="Fun"> + <label for="checkbox-1-1">Check me: </label> + <input id="checkbox-1-1" type="checkbox"> + <select id="select-1-1"> + <option>Value 1</option> + <option>Value 2</option> + <option>Value 3</option> + </select> + <select id="select-1-2" multiple="true"> + <option>Value 1</option> + <option>Value 2</option> + <option>Value 3</option> + </select> + <label for="checkbox-1-2">Check me too: </label> + <input id="checkbox-1-2" type="checkbox"> + <label for="checkbox-1-3">But not me: </label> + <input id="checkbox-1-3" type="checkbox" aria-hidden="true"> + <label for="checkbox-1-4">Or me! </label> + <input id="checkbox-1-4" type="checkbox" style="visibility:hidden"> + <select id="select-1-3" size="3"> + <option>Value 1</option> + <option>Value 2</option> + <option>Value 3</option> + </select> + <label for="input-1-5">Electronic mailing address:</label> + <input id="input-1-5" type="email"> + <input id="button-1-3" type="submit" value="Submit"> + </form> + </header> + <main id="main-1"> + <h2 id="heading-2">A larger second</h2> + <div id="heading-3" role="heading">ARIA is fun</div> + <input id="button-2-1" type="button" value="More Fun"> + <div id="button-2-2" tabindex="0" role="button">ARIA fun</div> + <div id="button-2-3" tabindex="0" role="button" aria-pressed="false">My little togglebutton</div> + <div id="button-2-4" tabindex="0" role="spinbutton">ARIA fun</div> + </main> + <h1 id="heading-4" style="display:none">Invisible header</h1> + <dl id="list-1"> + <dt id="listitem-1-1">Programming Language</dt> + <dd>A esoteric weapon wielded by only the most formidable warriors, + for its unrelenting strict power is unfathomable.</dd> + </dl> + <ul id="list-2" onclick="alert('hi');"> + <li id="listitem-2-1">Lists of Programming Languages</li> + <li id="listitem-2-2">Lisp + <ol id="list-3"> + <li id="listitem-3-1">Scheme</li> + <li id="listitem-3-2">Racket</li> + <li id="listitem-3-3">Clojure</li> + <li id="listitem-3-4"><strong>Standard</strong> Lisp</li> + <li id="listitem-3-5"><a id="link-0" href="#">Common</a> Lisp</li> + <li id="listitem-3-6"><input id="checkbox-1-5" type="checkbox"> LeLisp</li> + </ol> + </li> + <li id="listitem-2-3">JavaScript</li> + </ul> + <section> + <h6 id="heading-5">The last (visible) one!</h6> + <img id="image-1" src="http://example.com" alt=""> + <img id="image-2" src="../moz.png" alt="stuff"> + <div id="image-3" tabindex="0" role="img">Not actually an image</div> + </section> + <section> + <h4 id="heading-6" aria-hidden="true">Hidden header</h4> + <a id="link-1" href="http://www.mozilla.org">Link</a> + <a id="anchor-1">Words</a> + <a id="link-2" href="http://www.mozilla.org">Link the second</a> + <a id="anchor-2">Sentences</a> + <a id="link-3" href="http://www.example.com">Link the third</a> + </section> + <hr id="separator-1"> + <h6 id="heading-6"></h6> + <table id="table-1"> + <tr> + <td>3</td> + <td>1</td> + </tr> + <tr> + <td>4</td> + <td>1</td> + </tr> + </table> + <section id="grid" role="grid"> + <ol role="row"> + <li role="presentation"></li> + <li role="columnheader" aria-label="Sunday">S</li> + <li role="columnheader">M</li> + </ol> + <ol role="row"> + <li role="rowheader" aria-label="Week 1">1</li> + <li role="gridcell"><span>3</span><div></div></li> + <li role="gridcell"><span>4</span><div>7</div></li> + </ol> + <ol role="row"> + <li role="rowheader">2</li> + <li role="gridcell"><span>5</span><div role="presentation">8</div></li> + <li id="gridcell4" role="gridcell"> + <span>6</span><div aria-hidden="true"><div class="content"></div></div> + </li> + </ol> + </section> + <div id="separator-2" role="separator">Just an innocuous separator</div> + <table id="table-2"> + <thead> + <tr> + <th>Dirty Words</th> + <th>Meaning</th> + </tr> + </thead> + <tfoot> + <tr> + <td>Mud</td> + <td>Wet Dirt</td> + </tr> + </tfoot> + <tbody> + <tr> + <td>Dirt</td> + <td>Messy Stuff</td> + </tr> + </tbody> + </table> + <footer id="footer-1"> + <div id="statusbar-1" role="status">Last sync:<span>2 days ago</span></div> + <div aria-label="Last sync: 30min ago" id="statusbar-2" role="status"></div> + </footer> + + <span id="switch-1" role="switch" aria-checked="false" aria-label="Light switch"></span> + <p>This is a MathML formula <math id="math-1" display="block"> + <mfrac> + <mrow><mi>x</mi><mo>+</mo><mn>1</mn></mrow> + <msqrt><mn>3</mn><mo>/</mo><mn>4</mn></msqrt> + </mfrac> + </math> with some text after.</p> +</body> +</html> |