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
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
|
<!DOCTYPE html>
<html>
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=369370
-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test for Bug 369370</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<script type="text/javascript">
/*
* Test strategy:
*/
function makeClickFor(x, y) {
var event = kidDoc.createEvent("mouseevent");
event.initMouseEvent("click",
true, true, kidWin, 1, // bubbles, cancelable, view, single-click
x, y, x, y, // screen X/Y, client X/Y
false, false, false, false, // no key modifiers
0, null); // left click, not relatedTarget
return event;
}
function childLoaded() {
kidDoc = kidWin.document;
ok(true, "Child window loaded");
var elements = kidDoc.getElementsByTagName("img");
is(elements.length, 1, "looking for imagedoc img");
var img = elements[0];
// Need to use innerWidth/innerHeight of the window
// since the containing image is absolutely positioned,
// causing clientHeight to be zero.
is(kidWin.innerWidth, 400, "Checking doc width");
is(kidWin.innerHeight, 300, "Checking doc height");
// Image just loaded and is scaled to window size.
is(img.width, 400, "image width");
is(img.height, 300, "image height");
is(kidDoc.body.scrollLeft, 0, "Checking scrollLeft");
is(kidDoc.body.scrollTop, 0, "Checking scrollTop");
// ========== test 1 ==========
// Click in the upper left to zoom in
var event = makeClickFor(25,25);
img.dispatchEvent(event);
ok(true, "----- click 1 -----");
is(img.width, 800, "image width");
is(img.height, 600, "image height");
is(kidDoc.body.scrollLeft, 0, "Checking scrollLeft");
is(kidDoc.body.scrollTop, 0, "Checking scrollTop");
// ========== test 2 ==========
// Click there again to zoom out
event = makeClickFor(25,25);
img.dispatchEvent(event);
ok(true, "----- click 2 -----");
is(img.width, 400, "image width");
is(img.height, 300, "image height");
is(kidDoc.body.scrollLeft, 0, "Checking scrollLeft");
is(kidDoc.body.scrollTop, 0, "Checking scrollTop");
// ========== test 3 ==========
// Click in the lower right to zoom in
event = makeClickFor(350, 250);
img.dispatchEvent(event);
ok(true, "----- click 3 -----");
is(img.width, 800, "image width");
is(img.height, 600, "image height");
is(kidDoc.body.scrollLeft,
kidDoc.body.scrollLeftMax, "Checking scrollLeft");
is(kidDoc.body.scrollTop,
kidDoc.body.scrollTopMax, "Checking scrollTop");
// ========== test 4 ==========
// Click there again to zoom out
event = makeClickFor(350, 250);
img.dispatchEvent(event);
ok(true, "----- click 4 -----");
is(img.width, 400, "image width");
is(img.height, 300, "image height");
is(kidDoc.body.scrollLeft, 0, "Checking scrollLeft");
is(kidDoc.body.scrollTop, 0, "Checking scrollTop");
// ========== test 5 ==========
// Click in the upper left to zoom in again
event = makeClickFor(25, 25);
img.dispatchEvent(event);
ok(true, "----- click 5 -----");
is(img.width, 800, "image width");
is(img.height, 600, "image height");
is(kidDoc.body.scrollLeft, 0, "Checking scrollLeft");
is(kidDoc.body.scrollTop, 0, "Checking scrollTop");
is(img.getBoundingClientRect().top, 0, "Image is in view vertically");
// ========== test 6 ==========
// Now try resizing the window so the image fits vertically.
function test6() {
kidWin.addEventListener("resize", function() {
// Give the image document time to respond
SimpleTest.executeSoon(function() {
is(img.height, 600, "image height");
var bodyHeight = kidDoc.documentElement.scrollHeight;
var imgRect = img.getBoundingClientRect();
is(imgRect.top, bodyHeight - imgRect.bottom, "Image is vertically centered");
test7();
});
}, {once: true});
var decorationSize = kidWin.outerHeight - kidWin.innerHeight;
kidWin.resizeTo(400, 600 + 50 + decorationSize);
}
// ========== test 7 ==========
// Now try resizing the window so the image no longer fits vertically.
function test7() {
kidWin.addEventListener("resize", function() {
// Give the image document time to respond
SimpleTest.executeSoon(function() {
is(img.height, 600, "image height");
is(img.getBoundingClientRect().top, 0, "Image is at top again");
kidWin.close();
SimpleTest.finish();
});
}, {once: true});
var decorationSize = kidWin.outerHeight - kidWin.innerHeight;
kidWin.resizeTo(400, 300 + decorationSize);
}
test6();
}
var kidWin;
var kidDoc;
SimpleTest.waitForExplicitFinish();
SpecialPowers.pushPrefEnv({"set":[["browser.enable_automatic_image_resizing", true]]}, function() {
kidWin = window.open("bug369370-popup.png", "bug369370", "width=400,height=300");
// will init onload
ok(kidWin, "opened child window");
kidWin.onload = childLoaded;
});
</script>
</body>
</html>
|
