| <html> |
| <body> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <div id="container"> |
| |
| <div> |
| <a id="link1" href="#">Link</a> |
| <button id="button1">Button</button> |
| <input id="text1" type="text"> |
| <input id="checkbox1" type="checkbox"> |
| <input id="radio1" type="radio"> |
| <input id="slider1" type="range"> |
| <input id="submit1" type="submit"> |
| <select id="combobox1"><option>1<option>2</select> |
| <select id="listbox1" multiple><option>1<option>2</select> |
| <textarea id="textarea1"></textarea> |
| <div id="focusable1" tabindex="0">Focusable</div> |
| </div> |
| |
| <canvas id="myCanvas" width="300" height="300"> |
| <a id="link2" href="#">Link</a> |
| <button id="button2">Button</button> |
| <input id="text2" type="text"> |
| <input id="checkbox2" type="checkbox"> |
| <input id="radio2" type="radio"> |
| <input id="slider2" type="range"> |
| <input id="submit2" type="submit"> |
| <select id="combobox2"><option>1<option>2</select> |
| <select id="listbox2" multiple><option>1<option>2</select> |
| <textarea id="textarea2"></textarea> |
| <div id="focusable2" tabindex="0">Focusable</div> |
| </canvas> |
| |
| <canvas hidden id="hiddenCanvas" width="300" height="300"> |
| <a id="linkInHiddenCanvas" href="#">Link</a> |
| </canvas> |
| |
| </div> |
| <script> |
| var element; |
| var previousFocusedElement; |
| |
| function checkFocusable(id) { |
| element = document.getElementById(id); |
| element.focus(); |
| assert_true(document.activeElement == element); |
| } |
| |
| function checkNotFocusable(id) { |
| previousFocusedElement = document.activeElement; |
| element = document.getElementById(id); |
| element.focus(); |
| assert_true(document.activeElement == previousFocusedElement); |
| } |
| |
| var focusableTestScenarios = [ |
| ['FocusableTestCase1', "link1"], |
| ['FocusableTestCase2', "button1"], |
| ['FocusableTestCase3', "text1"], |
| ['FocusableTestCase4', "checkbox1"], |
| ['FocusableTestCase5', "radio1"], |
| ['FocusableTestCase6', "slider1"], |
| ['FocusableTestCase7', "submit1"], |
| ['FocusableTestCase8', "combobox1"], |
| ['FocusableTestCase9', "listbox1"], |
| ['FocusableTestCase10', "textarea1"], |
| ['FocusableTestCase11', "focusable1"], |
| |
| ['FocusableTestCase12', "link2"], |
| ['FocusableTestCase13', "button2"], |
| ['FocusableTestCase14', "text2"], |
| ['FocusableTestCase15', "checkbox2"], |
| ['FocusableTestCase16', "radio2"], |
| ['FocusableTestCase17', "slider2"], |
| ['FocusableTestCase18', "submit2"], |
| ['FocusableTestCase19', "combobox2"], |
| ['FocusableTestCase20', "listbox2"], |
| ['FocusableTestCase21', "textarea2"], |
| ['FocusableTestCase22', "focusable2"] |
| ]; |
| |
| var notFocusableTestScenarios = [ |
| ['NotFocusableTestCase', "linkInHiddenCanvas"], |
| ]; |
| |
| generate_tests(checkFocusable, focusableTestScenarios); |
| generate_tests(checkNotFocusable, notFocusableTestScenarios); |
| document.querySelector("#container").remove(); |
| |
| </script> |
| </body> |
| </html> |