Thu, 22 Jan 2015 13:21:57 +0100
Incorporate requested changes from Mozilla in review:
https://bugzilla.mozilla.org/show_bug.cgi?id=1123480#c6
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <title>nsIDOMWindowUtils::nodesFromRect test - bug 489127</title>
5 <script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
6 <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
7 <script type="application/javascript;version=1.8">
9 let SimpleTest = window.opener.SimpleTest;
10 function ok() { window.opener.ok.apply(window.opener, arguments); }
11 function done() { window.opener.done.apply(window.opener, arguments); }
12 let e = {};
14 let dwu = window.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
15 .getInterface(Components.interfaces.nsIDOMWindowUtils);
17 /*
18 nsIDOMNodeList nodesFromRect(in float aX,
19 in float aY,
20 in float aTopSize,
21 in float aRightSize,
22 in float aBottomSize,
23 in float aLeftSize,
24 in boolean aIgnoreRootScrollFrame,
25 in boolean aFlushLayout);
27 */
29 function check(x, y, top, right, bottom, left, list) {
30 let nodes = dwu.nodesFromRect(x, y, top, right, bottom, left, true, false);
32 list.push(e.body);
33 list.push(e.html);
35 if (nodes.length != list.length) {
36 ok(false, "Different number of nodes for rect" +
37 "[" + x + "," + y + "], " +
38 "[" + top + "," + right + "," + bottom + "," + left + "]");
39 return;
40 }
42 for (var i = 0; i < nodes.length; i++) {
43 if (nodes[i] != list[i]) {
44 ok(false, "Unexpected node #" + i + " for rect " +
45 "[" + x + "," + y + "], " +
46 "[" + top + "," + right + "," + bottom + "," + left + "]");
47 return;
48 }
49 }
50 ok(true, "All correct nodes found for rect " +
51 "[" + x + "," + y + "], " +
52 "[" + top + "," + right + "," + bottom + "," + left + "]");
53 }
55 function doTest() {
57 // Set up shortcut access to elements
58 e['html'] = document.getElementsByTagName("html")[0];
59 ['h1', 'd1', 'd2', 'p1', 'p2', 'p3', 'p4', 'p5', 'p6', 'span',
60 'a1', 'a2', 'a3', 'transf', 'iframe1', 'body'].forEach(function(a) {
61 e[a] = document.getElementById(a);
62 });
64 window.scrollTo(0, 0);
66 // Top, Right, Bottom, Left directions:
67 check(53, 71, 0, 0, 0, 0, []);
68 check(53, 71, 10, 0, 0, 0, [e.h1]);
69 check(53, 71, 0, 10, 0, 0, [e.p3]);
70 check(53, 71, 0, 0, 10, 0, [e.d1]);
71 check(152, 105, 0, 0, 0, 10, [e.d1]);
72 check(152, 105, 10, 10, 10, 10, [e.p4, e.p3, e.d1]);
74 // e.p1 is invisible and shouldn't appear:
75 check(153,193,0,0,0,0,[e.p5]);
76 check(153,193,0,20,0,20, [e.p5, e.d2]);
78 // Precise pixel checks:
79 check(144, 183, 0, 0, 0, 0, []);
80 check(144, 183, 0, 0, 1, 0, [e.p5]);
81 check(144, 183, 0, 0, 0, 1, [e.d2]);
82 check(144, 183, 0, 0, 1, 1, [e.p5, e.d2]);
83 check(77, 240, 0, 0, 0, 0, [e.p2]);
84 check(77, 240, 1, 0, 0, 0, [e.p5, e.p2]);
85 check(77, 240, 0, 0, 1, 0, [e.span, e.p2]);
86 check(77, 240, 1, 0, 1, 0, [e.p5, e.span, e.p2]);
88 // Expanding area checks:
89 check(39, 212, 0, 0, 0, 0, []);
90 check(39, 212, 10, 0, 0, 0, [e.d2]);
91 check(39, 212, 0, 0, 10, 0, [e.p2]);
92 check(39, 212, 10, 1, 30, 0, [e.d2, e.p2]);
93 check(39, 212, 10, 5, 30, 0, [e.span, e.d2, e.p2]);
94 check(39, 212, 10, 15, 30, 0, [e.p5, e.span, e.d2, e.p2]);
96 // Elements inside iframe shouldn't be returned:
97 check(15, 410, 0, 30, 50, 0, [e.iframe1]);
99 // Area with links and text nodes:
100 let [x1, y1] = getCenterFor(e.a1);
101 let [x2, y2] = getCenterFor(e.a2);
102 let [x3, y3] = getCenterFor(e.a3);
103 let [xt, yt] = [(x2 + x1) / 2, y1]; //text node between a1 and a2
105 check(x1, y1, 0, 0, 0, 0, [e.a1.firstChild, e.a1, e.p6]);
106 check(x1, y1, 0, 0, y3 - y1, 0, [e.a3.firstChild, e.a3, e.a1.firstChild, e.a1, e.p6]);
107 check(x1, y1, 0, xt - x1, 0, 0, [e.p6.childNodes[1], e.a1.firstChild, e.a1, e.p6]);
108 check(x1, y1, 0, x2 - x1, 0, 0, [e.a2.firstChild, e.a2, e.p6.childNodes[1], e.a1.firstChild, e.a1, e.p6]);
109 check(x1, y1, 0, x2 - x1, y3 - y1, 0, [e.a3.firstChild, e.a3, e.a2.firstChild, e.a2, e.p6.childNodes[1], e.a1.firstChild, e.a1, e.p6]);
111 // 2d transform:
112 check(61, 671, 0, 0, 0, 0, []);
113 check(61, 671, 0, 30, 0, 10, [e.transf]);
114 check(61, 671, 0, 30, 90, 10, [e.transf.firstChild, e.transf]);
116 done();
118 }
120 function getCenterFor(element) {
121 let rect = element.getBoundingClientRect();
122 return [(rect.left + rect.right) / 2, (rect.top + rect.bottom) / 2];
123 }
125 addLoadEvent(doTest);
126 </script>
127 <style type="text/css">
129 body {
130 margin: 8px;
131 padding: 0;
132 }
134 h1, div, p, span, iframe {
135 display: block;
136 width: 100px;
137 height: 30px;
138 border: 3px solid black;
139 padding: 10px;
140 margin: 10px;
141 }
144 span {
145 display: inline-block;
146 }
148 #iframe1 {
149 height: 100px;
150 margin-top: 60px;
151 }
153 #p6 {
154 height: 50px;
155 margin-top: 30px;
156 }
158 #transf {
159 margin-top: 60px;
160 -moz-transform: rotate(-45deg);
161 }
163 #decimal {
164 position: relative;
165 left: 0.5px;
166 top: 50.5px;
167 }
168 </style>
169 </head>
170 <body id="body">
171 <h1 id="h1"></h1>
172 <div id="d1"></div>
174 <!-- floated element -->
175 <div id="d2" style="float: left"></div>
177 <!-- hidden element -->
178 <p id="p1" style="float: left; visibility: hidden"></p>
180 <p id="p2" style="clear: left"><span id="span"></span></p>
182 <!-- absolute position -->
183 <p id="p3" style="position:absolute; top: 10px; left:50px; height:50px;"></p>
185 <!-- fixed position -->
186 <p id="p4" style="position: fixed; top: 30px; left: 150px; height: 50px; background-color: blue;"></p>
188 <!-- relative position -->
189 <p id="p5" style="position:relative; top: -100px; left: 30px; margin-bottom: -70px; background-color: green"></p>
191 <!-- decimal CSS pixels -->
192 <div id="decimal"></div>
194 <iframe id="iframe1" src="data:text/html,<div>div</div><p>p</p>"></iframe>
196 <p id="p6"><a href="#" id="a1">A</a> / <a href="#" id="a2">A</a><br/><a href="#" id="a3">A</a></p>
198 <div id="transf">text</div>
199 </body>
200 </html>