tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

DocumentOrShadowRoot-activeElement.html (3637B)

      1 <!DOCTYPE html>
      2 <meta charset="utf-8">
      3 <title>HTML Test: DocumentOrShadowRoot.activeElement</title>
      4 <script src="/resources/testharness.js"></script>
      5 <script src="/resources/testharnessreport.js"></script>
      6 <script src="/resources/testdriver.js"></script>
      7 <script src="/resources/testdriver-vendor.js"></script>
      8 <body>
      9 <script>
     10 function createChildAndFocus(focusParent) {
     11  const focused = document.createElement("div");
     12  focused.tabIndex = 0;
     13  focusParent.appendChild(focused);
     14  focused.focus();
     15  return focused;
     16 }
     17 
     18 test(() => {
     19  const host = document.createElement("div");
     20  const shadowRoot = host.attachShadow({ mode: "open" });
     21  document.body.appendChild(host);
     22 
     23  const focused = createChildAndFocus(shadowRoot);
     24  assert_equals(document.activeElement, host);
     25  assert_equals(shadowRoot.activeElement, focused);
     26 }, "activeElement on document & shadow root when focused element is in the shadow tree");
     27 
     28 test(() => {
     29  const host = document.createElement("div");
     30  const shadowRoot = host.attachShadow({ mode: "open" });
     31  document.body.appendChild(host);
     32 
     33  const focused = createChildAndFocus(document.body);
     34  assert_equals(document.activeElement, focused);
     35  assert_equals(shadowRoot.activeElement, null);
     36 }, "activeElement on document & shadow root when focused element is in the document");
     37 
     38 test(() => {
     39  const host = document.createElement("div");
     40  const shadowRoot = host.attachShadow({ mode: "open" });
     41  shadowRoot.appendChild(document.createElement("slot"));
     42  document.body.appendChild(host);
     43 
     44  // Child of |host|, will be slotted to the slot in |shadowRoot|.
     45  const focused = createChildAndFocus(host);
     46  assert_equals(document.activeElement, focused);
     47  assert_equals(shadowRoot.activeElement, null);
     48 }, "activeElement on document & shadow root when focused element is slotted");
     49 
     50 test(() => {
     51  const host = document.createElement("div");
     52  const shadowRoot = host.attachShadow({ mode: "open" });
     53  document.body.appendChild(host);
     54  const neighborHost = document.createElement("div");
     55  const neighborShadowRoot = neighborHost.attachShadow({ mode: "open" });
     56  document.body.appendChild(neighborHost);
     57 
     58  const focused = createChildAndFocus(shadowRoot);
     59  assert_equals(document.activeElement, host);
     60  assert_equals(shadowRoot.activeElement, focused);
     61  assert_equals(neighborShadowRoot.activeElement, null);
     62 }, "activeElement on a neighboring host when focused element is in another shadow tree");
     63 
     64 test(() => {
     65  const host = document.createElement("div");
     66  const shadowRoot = host.attachShadow({ mode: "open" });
     67  document.body.appendChild(host);
     68  const nestedHost = document.createElement("div");
     69  const nestedShadowRoot = nestedHost.attachShadow({ mode: "open" });
     70  shadowRoot.appendChild(nestedHost);
     71 
     72  const focused = createChildAndFocus(nestedShadowRoot);
     73  assert_equals(document.activeElement, host);
     74  assert_equals(shadowRoot.activeElement, nestedHost);
     75  assert_equals(nestedShadowRoot.activeElement, focused);
     76 }, "activeElement when focused element is in a nested shadow tree");
     77 
     78 test(() => {
     79  const host = document.createElement("div");
     80  const shadowRoot = host.attachShadow({ mode: "open" });
     81  document.body.appendChild(host);
     82  const nestedHost = document.createElement("div");
     83  const nestedShadowRoot = nestedHost.attachShadow({ mode: "open" });
     84  shadowRoot.appendChild(nestedHost);
     85 
     86  const focused = createChildAndFocus(shadowRoot);
     87  assert_equals(document.activeElement, host);
     88  assert_equals(shadowRoot.activeElement, focused);
     89  assert_equals(nestedShadowRoot.activeElement, null);
     90 }, "activeElement when focused element is in a parent shadow tree");
     91 </script>
     92 </body>