1<html>
2<head>
3 <title>Document::nodesFromRect test - bug 40197</title>
4 <style type="text/css"> @import "resources/nodesFromRect.css"; </style>
5 <script src="../js/resources/js-test-pre.js"></script>
6 <script src="resources/nodesFromRect.js"></script>
7 <script type="application/javascript">
8 function runTest()
9 {
10 if (window.layoutTestController) {
11 layoutTestController.dumpAsText();
12 layoutTestController.waitUntilDone();
13 }
14
15 var e = {};
16
17 // Set up shortcut access to elements
18 e['html'] = document.getElementsByTagName("html")[0];
19 ['h1', 'd1', 'd2', 'p1', 'p2', 'p3', 'p4', 'p5', 'span', 'body'].forEach(function(a) {
20 e[a] = document.getElementById(a);
21 });
22
23 window.scrollTo(0, 0);
24
25 check(53, 71, 0, 0, [e.body]);
26 check(53, 71, 10, 0, [e.p3, e.body]);
27 check(53, 71, 0, 10, [e.d1, e.h1, e.body]);
28 check(53, 71, 10, 10, [e.p3, e.d1, e.h1, e.body]);
29
30 check(152, 105, 0, 10, [e.p3, e.body]);
31 check(152, 105, 10, 0, [e.p4, e.d1, e.body]);
32 check(152, 105, 10, 10, [e.p4, e.p3, e.d1, e.body]);
33
34 // e.p1 is invisible and shouldn't appear:
35 check(153,193,0,0,[e.p5]);
36 // NOTE: [e.p5, e.d2]) should be returned if we did not stop
37 // at e.p5, which fully encloses the target rect.
38 check(153,193,20,0, [e.p5]);
39 check(153,193,0,20, [e.p5, e.body]);
40
41 // Precise pixel checks:
42 check(144, 183, 0, 0, [e.body]);
43 check(144, 183, 0, 1, [e.p5, e.body]);
44 check(144, 183, 1, 0, [e.d2, e.body]);
45 check(144, 183, 1, 1, [e.p5, e.d2, e.body]);
46 check(77, 240, 0, 0, [e.p2]);
47 check(77, 240, 10, 0, [e.p2]);
48 check(77, 240, 0, 10, [e.p5, e.span, e.p2]);
49 check(77, 240, 10, 10, [e.p5, e.span, e.p2]);
50
51 // Expanding area checks:
52 check(39, 212, 0, 0, [e.body]);
53 check(39, 212, 0, 10, [e.d2, e.p2, e.body]);
54 check(39, 212, 10, 0, [e.p5, e.body]);
55 check(39, 212, 10, 10, [e.p5, e.d2, e.p2, e.body]);
56
57 if (window.layoutTestController)
58 layoutTestController.notifyDone();
59 }
60
61 window.onload = runTest;
62 </script>
63</head>
64<body id="body">
65 <h1 id="h1"></h1>
66 <div id="d1"></div>
67
68 <!-- floated element -->
69 <div id="d2" style="float: left"></div>
70
71 <!-- hidden element -->
72 <p id="p1" style="float: left; visibility: hidden"></p>
73
74 <p id="p2" style="clear: left"><span id="span"></span></p>
75
76 <!-- absolute position -->
77 <p id="p3" style="position:absolute; top: 10px; left:50px; height:50px;"></p>
78
79 <!-- fixed position -->
80 <p id="p4" style="position: fixed; top: 30px; left: 150px; height: 50px; background-color: blue;"></p>
81
82 <!-- relative position -->
83 <p id="p5" style="position:relative; top: -100px; left: 30px; margin-bottom: -70px; background-color: green"></p>
84
85 <span id="console"></span>
86 <script src="../js/resources/js-test-post.js"></script>
87</body>
88</html>
89