diff options
Diffstat (limited to 'dom/base/test/test_focus_shadow_dom_root.html')
| -rw-r--r-- | dom/base/test/test_focus_shadow_dom_root.html | 41 |
1 files changed, 41 insertions, 0 deletions
diff --git a/dom/base/test/test_focus_shadow_dom_root.html b/dom/base/test/test_focus_shadow_dom_root.html new file mode 100644 index 0000000000..bf51dac3d1 --- /dev/null +++ b/dom/base/test/test_focus_shadow_dom_root.html @@ -0,0 +1,41 @@ +<!doctype html> +<title>Test for bug 1544826</title> +<script src="/tests/SimpleTest/SimpleTest.js"></script> +<script src="/tests/SimpleTest/EventUtils.js"></script> +<div id="host"><a href="#" id="slotted">This is focusable too</a></div> +<script> + const host = document.getElementById("host"); + const shadow = host.attachShadow({ mode: "open" }); + shadow.innerHTML = ` + <a id="shadow-1" href="#">This is focusable</a> + <slot></slot> + <a id="shadow-2" href="#">So is this</a> + `; + document.documentElement.remove(); + document.appendChild(host); + + SimpleTest.waitForExplicitFinish(); + SimpleTest.waitForFocus(async function() { + // Enable Full Keyboard Access emulation on Mac. + if (navigator.platform.indexOf("Mac") === 0) { + await SpecialPowers.pushPrefEnv({"set": [["accessibility.tabfocus", 7]]}); + } + + is(document.documentElement, host, "Host is the document element"); + host.offsetTop; + synthesizeKey("KEY_Tab"); + is(shadow.activeElement.id, "shadow-1", "First link in Shadow DOM is focused"); + synthesizeKey("KEY_Tab"); + is(document.activeElement.id, "slotted", "Slotted link is focused"); + synthesizeKey("KEY_Tab"); + is(shadow.activeElement.id, "shadow-2", "Second link in Shadow DOM is focused"); + + // Now backwards. + synthesizeKey("KEY_Tab", {shiftKey: true}); + is(document.activeElement.id, "slotted", "Backwards: Slotted link is focused"); + synthesizeKey("KEY_Tab", {shiftKey: true}); + is(shadow.activeElement.id, "shadow-1", "Backwards: First slotted link is focused"); + + SimpleTest.finish(); + }); +</script> |