summaryrefslogtreecommitdiffstats
path: root/dom/base/test/test_focus_display_none_xorigin_iframe.html
blob: b04141b0fef04960d0f28102a3cfa9ae1de7d4b7 (plain)
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
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!DOCTYPE html>
<html>
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=1716762
-->
<head>
<meta charset="utf-8">
<title>Test for Bug 1716762</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1716762">Mozilla Bug 1716762</a><br>
<input></input><br>
<div id="target" style="display: none;">
<iframe src="http://example.org/tests/dom/base/test/file_focus_display_none_xorigin_iframe_inner.html"></iframe>
</div>
<script type="text/javascript">

let waitForMessage = function(aMsg) {
  return new Promise(reslove => {
    window.addEventListener("message", function handler(e) {
      info(`main received message: ${e.data}`);
      if (e.data === aMsg) {
        window.removeEventListener("message", handler);
        reslove();
      }
    });
  });
};

let sendMessage = async function(aWindow, aMsg) {
  aWindow.postMessage(aMsg, "*");
  await waitForMessage("done");
}

let getFocus = function(aWindow) {
  return new Promise(reslove => {
    window.addEventListener("message", function handler(e) {
      info(e.data);
      reslove(e.data);
    }, { once: true });
    aWindow.postMessage("getfocus", "*");
  });
}

/** Test for Bug 1716762  **/

let input = document.querySelector("input");
let iframe = document.querySelector("iframe");

add_task(async function test_ancestor_display_none_init() {
  // focus input element
  input.focus();
  is(document.activeElement.tagName, "INPUT", "focus should move to input element");

  // focus input element in hidden iframe
  await sendMessage(iframe.contentWindow, "focus");
  is(document.activeElement.tagName, "INPUT", "focus should stay on input element");
});

add_task(async function test_remove_ancestor_display_none() {
  // remove `display: none` from the ancestor of iframe
  document.getElementById("target").style = "";
  document.body.offsetWidth;

  // focus input element
  input.focus();
  is(document.activeElement.tagName, "INPUT", "focus should move to input element");

  // focus input element in hidden iframe
  await sendMessage(iframe.contentWindow, "focus");
  is(document.activeElement.tagName, "IFRAME", "focus should move to iframe element");
});

add_task(async function test_ancestor_display_none() {
  // add `display: none` to the ancestor of iframe back
  document.getElementById("target").style = "display: none;";
  document.body.offsetWidth;

  // focus input element
  input.focus();
  is(document.activeElement.tagName, "INPUT", "focus should move to input element");

  // focus input element in hidden iframe
  await sendMessage(iframe.contentWindow, "focus");
  is(document.activeElement.tagName, "INPUT", "focus should stay on input element");
});

add_task(async function test_remove_ancestor_display_none_again() {
  // remove `display: none` from the ancestor of iframe
  document.getElementById("target").style = "";
  document.body.offsetWidth;

  // focus input element
  input.focus();
  is(document.activeElement.tagName, "INPUT", "focus should move to input element");

  // focus input element in hidden iframe
  await sendMessage(iframe.contentWindow, "focus");
  is(document.activeElement.tagName, "IFRAME", "focus should move to iframe element");
});

add_task(async function test_iframe_display_none() {
  // add `display: none` to iframe
  iframe.style = "display: none;";
  document.body.offsetWidth;

  // focus input element
  input.focus();
  is(document.activeElement.tagName, "INPUT", "focus should move to input element");

  // focus input element in hidden iframe
  await sendMessage(iframe.contentWindow, "focus");
  is(document.activeElement.tagName, "INPUT", "focus should stay on input element");
});

add_task(async function test_remove_iframe_display_none() {
  // remove `display: none` from iframe
  iframe.style = "";
  document.body.offsetWidth;

  // focus input element
  input.focus();
  is(document.activeElement.tagName, "INPUT", "focus should move to input element");

  // focus input element in hidden iframe
  await sendMessage(iframe.contentWindow, "focus");
  is(document.activeElement.tagName, "IFRAME", "focus should move to iframe element");
});

</script>
</body>
</html>