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
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Test for Bug 1064843</title>
<style id="style"></style>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<script src="/tests/SimpleTest/EventUtils.js"></script>
<script src="/tests/SimpleTest/WindowSnapshot.js"></script>
<script type="text/javascript" src="file_fullscreen-utils.js"></script>
<style>
html {
overflow: hidden;
}
#placeholder {
height: 1000vh;
}
</style>
</head>
<body>
<div id="fullscreen"></div>
<div id="placeholder"></div>
<script>
const gStyle = document.getElementById("style");
const gFullscreen = document.getElementById("fullscreen");
function is(a, b, msg) {
opener.is(a, b, "[backdrop] " + msg);
}
function isnot(a, b, msg) {
opener.isnot(a, b, "[backdrop] " + msg);
}
function ok(cond, msg) {
opener.ok(cond, "[backdrop] " + msg);
}
function info(msg) {
opener.info("[backdrop] " + msg);
}
function synthesizeMouseAtWindowCenter() {
synthesizeMouseAtPoint(innerWidth / 2, innerHeight / 2, {});
}
const gFullscreenElementBackground = getComputedStyle(gFullscreen).background;
function begin() {
info("The default background of window should be white");
assertWindowPureColor(window, "white");
addFullscreenChangeContinuation("enter", enterFullscreen);
gFullscreen.requestFullscreen();
}
function setBackdropStyle(style) {
gStyle.textContent = `#fullscreen::backdrop { ${style} }`;
}
function enterFullscreen() {
is(getComputedStyle(gFullscreen).background, gFullscreenElementBackground,
"Computed background of #fullscreen shouldn't be changed");
info("The default background of backdrop for fullscreen is black");
assertWindowPureColor(window, "black");
setBackdropStyle("background: green");
info("The background color of backdrop should be changed to green");
assertWindowPureColor(window, "green");
gFullscreen.style.background = "blue";
info("The blue fullscreen element should cover the backdrop");
assertWindowPureColor(window, "blue");
gFullscreen.style.background = "";
setBackdropStyle("display: none");
info("The white body should be shown when the backdrop is hidden");
assertWindowPureColor(window, "white");
setBackdropStyle("");
info("Content should return to black because we restore the backdrop");
assertWindowPureColor(window, "black");
gFullscreen.style.display = "none";
info("The backdrop should disappear with the fullscreen element");
assertWindowPureColor(window, "white");
gFullscreen.style.display = "";
setBackdropStyle("position: absolute");
info("Changing position shouldn't immediately affect the view");
assertWindowPureColor(window, "black");
window.scroll(0, screen.height);
info("Scrolled up the absolutely-positioned element");
assertWindowPureColor(window, "white");
addFullscreenChangeContinuation("exit", exitFullscreen);
document.exitFullscreen();
}
function exitFullscreen() {
opener.nextTest();
}
</script>
</body>
</html>
|
