File: activeelement-after-nested-loses-focus.html

package info (click to toggle)
thunderbird 1%3A140.5.0esr-1
  • links: PTS, VCS
  • area: main
  • in suites: forky, sid
  • size: 4,609,032 kB
  • sloc: cpp: 7,672,739; javascript: 5,901,898; ansic: 3,898,899; python: 1,413,347; xml: 653,997; asm: 462,284; java: 180,927; sh: 113,491; makefile: 20,460; perl: 14,288; objc: 13,059; yacc: 4,583; pascal: 3,352; lex: 1,720; ruby: 1,222; exp: 762; sql: 715; awk: 580; php: 436; lisp: 430; sed: 70; csh: 10
file content (83 lines) | stat: -rw-r--r-- 2,862 bytes parent folder | download | duplicates (12)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!doctype html>
<head>
<meta charset=utf-8>
<title>Use focusout and click events to test ancestors' activeElements are cleared and updated correctly when nested child loses focus</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
</head>
<body>
<h1 id="my-h1">text</h1>

<iframe
  id="first-iframe"
  src="about:blank"
  srcdoc="
    <!DOCTYPE html>
    <html>
      <body id='iframe-body' contentEditable='true'>
        lorem ipsum
        <iframe
          id='nested-iframe'
          srcdoc='
            <html>
              <body id=&quot;iframe-body-2&quot; contentEditable=&quot;true&quot;>
                nested lorem ipsum
              </body>
            </html>'>
        </iframe>
      </body>
    </html>
  ">
</iframe>

<script>
  async_test(t => {
    window.onload = function() {
      const iframe = document.querySelector("iframe");
      const nestedIframe = iframe.contentDocument.getElementById("nested-iframe");

      nestedIframe.contentDocument.getElementById("iframe-body-2").addEventListener('focusout', () => {
        t.step(function() {
          assert_equals(
            nestedIframe.contentDocument.activeElement,
            nestedIframe.contentDocument.body,
            "nestedIframe should still have focus on its body");
          assert_equals(
            iframe.contentDocument.activeElement, nestedIframe,
            "iframe should still think the nestedIframe is focused");
          assert_equals(
            document.activeElement, iframe,
            "top level document should still think the iframe is focused");
        });
      });

      const h1 = document.getElementById("my-h1");
      h1.addEventListener("click", t.step_func_done(function() {
          assert_equals(
            nestedIframe.contentDocument.activeElement,
            nestedIframe.contentDocument.body,
            "nestedIframe originally has the focus on its body, and should still have the focus on its body after it loses the focus");
          assert_equals(
            iframe.contentDocument.activeElement,
            iframe.contentDocument.body,
            "Since nestedIframe loses the focus, iframe's activeElement should move from the nestedIframe to be its body"
          );
          assert_equals(
            document.activeElement, document.body,
            "top level document gains the focus");
      }));

      // Step 1: Focus the body of the nestedIframe
      nestedIframe.contentDocument.body.focus();

      // Step 2: Click focus the <h1> in the top level document
      test_driver.click(h1);

      // Now the focusout event for nestedIframe, and the
      // click event for h1 should be triggered.
    }
  })
</script>
</body>