| <!DOCTYPE html> |
| <body> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| |
| <fieldset id='declared-focusable-elements'> |
| <!-- begin setup for <rp> element --> |
| <rp style="display: block">(</rp> |
| <!-- end of setup for <rp> element --> |
| |
| <!-- begin setup for <area> element --> |
| <img usemap="#testMap"> |
| <map name="testMap"> |
| <area>test</area> |
| </map> |
| <!-- end of setup for <area> element --> |
| |
| <!-- begin setup for <audio> element --> |
| <audio controls> |
| <!-- end of setup for <audio> element --> |
| <fieldset> |
| |
| <script> |
| const modifiers = /\bMac OS X\b/.test(navigator.userAgent) ? ["ctrlKey", "altKey"] : ["altKey"]; |
| |
| function pressKey(key) { |
| eventSender.keyDown(key, modifiers); |
| } |
| |
| const focusableTagNames = [ |
| "a", "abbr", "acronym", "address", "area", "article", "aside", "audio", |
| "b", "base", "basefont", "bdo", "bgsound", "big", "blockquote", "br", |
| "canvas", "caption", "center", "cite", "code", "col", "colgroup", |
| "dd", "del", "details", "dfn", "dir", "div", "dl", "dt", |
| "em", "fieldset", "figcaption", "figure", "font", "footer", "form", |
| "frame", "frameset", |
| "h1", "h2", "h3", "h4", "h5", "h6", "header", "hgroup","hr","html", |
| "i", "iframe", "img", "ins", "kbd", "label", "layer", "li", "listing", |
| "main", "map", "mark", "marquee", "menu", "meter", |
| "nav", "nobr", "nolayer", "object", |
| "ol", "output", "p", "plaintext", "pre", "progress", "q", |
| "rp", "rt", "ruby", "s", "samp", "section", "small", "source", |
| "span", "strike", "strong", "sub", "summary", "sup", |
| "table", "tbody", "td", "tfoot", "th", "thead", "tr", "track", "tt", |
| "u", "ul", "var", "video", "wbr", "xmp"]; |
| |
| const nonFocusableTagNames = ["embed", "head", "link", "meta", "noembed", "noscript", "param", "script", "style", "title"]; |
| |
| function testPressAccessKeyOnElement(element) { |
| var clicked = false; |
| element.onclick = () => { clicked = true; } |
| var focused = false; |
| element.onfocus = () => { focused = true; } |
| |
| pressKey(element.accessKey); |
| const isFocusable = focusableTagNames.includes(element.tagName.toLowerCase()); |
| assert_true(clicked, `Pressing access key on a ${!isFocusable ? "non-" : ""}focusable element should ${!isFocusable ? "not" : ""} trigger click handler.`); |
| assert_equals(focused, isFocusable, `Pressing access key on a ${!isFocusable ? "non-" : ""}focusable element should ${!isFocusable ? "not" : ""} focus on the element.`); |
| } |
| |
| focusableTagNames.concat(nonFocusableTagNames).forEach((name) => { |
| test(() => { |
| const declaredElementsContainer = document.getElementById('declared-focusable-elements'); |
| let element = declaredElementsContainer.getElementsByTagName(name)[0]; |
| if (!element) { |
| element = document.createElement(name); |
| document.body.appendChild(element); |
| } |
| element.tabIndex = 0; |
| assert_not_equals(element.accessKey, undefined); |
| element.accessKey = "k"; |
| assert_equals(element.accessKey, "k"); |
| testPressAccessKeyOnElement(element); |
| element.remove(); |
| }, "Check for " + name + " tag"); |
| }); |
| </script> |
| </body> |
| </html> |
