content/html/document/test/bug199692-popup.html

Wed, 31 Dec 2014 06:09:35 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 06:09:35 +0100
changeset 0
6474c204b198
permissions
-rw-r--r--

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

michael@0 1 <!DOCTYPE html>
michael@0 2 <html>
michael@0 3 <!--
michael@0 4 https://bugzilla.mozilla.org/show_bug.cgi?id=199692
michael@0 5 -->
michael@0 6 <head>
michael@0 7 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
michael@0 8 <title>Popup in test for Bug 199692</title>
michael@0 9 <style type="text/css">
michael@0 10 #content * {
michael@0 11 border: 2px solid black;
michael@0 12 margin: 2px;
michael@0 13 clear: both;
michael@0 14 height: 20px;
michael@0 15 overflow: hidden;
michael@0 16 }
michael@0 17
michael@0 18 #txt, #static, #fixed, #absolute, #relative, #hidden, #float, #empty, #static, #relative {
michael@0 19 width: 200px !important;
michael@0 20 }
michael@0 21 </style>
michael@0 22
michael@0 23 </head>
michael@0 24 <!--
michael@0 25 Elements are styled in such a way that they don't overlap visually
michael@0 26 unless they also overlap structurally.
michael@0 27
michael@0 28 This file is designed to be opened from test_bug199692.html in a popup
michael@0 29 window, to guarantee that the window in which document.elementFromPoint runs
michael@0 30 is large enough to display all the elements being tested.
michael@0 31 -->
michael@0 32 <body>
michael@0 33 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=199692">Mozilla Bug 199692</a>
michael@0 34
michael@0 35 <div id="content" style="width: 500px; background-color: #ccc;">
michael@0 36
michael@0 37 <!-- element containing text -->
michael@0 38 <div id="txt" style="height: 30px;">txt</div>
michael@0 39
michael@0 40 <!-- element not containing text -->
michael@0 41 <div id="empty" style="border: 2px solid blue;"></div>
michael@0 42
michael@0 43 <!-- element with only whitespace -->
michael@0 44 <p id="whitespace" style="border: 2px solid magenta;"> </p>
michael@0 45
michael@0 46 <!-- position: static -->
michael@0 47 <span id="static" style="position: static; border-color: green;">static</span>
michael@0 48
michael@0 49 <!-- floated element -->
michael@0 50 <div id="float" style="border-color: red; float: right;">float</div>
michael@0 51
michael@0 52 <!-- position: fixed -->
michael@0 53 <span id="fixed" style="position: fixed; top: 500px; left: 100px; border: 3px solid yellow;">fixed</span>
michael@0 54
michael@0 55 <!-- position: absolute -->
michael@0 56 <span id="absolute" style="position: absolute; top: 550px; left: 150px; border-color: orange;">abs</span>
michael@0 57
michael@0 58 <!-- position: relative -->
michael@0 59 <div id="relative" style="position: relative; top: 200px; border-color: teal;">rel</div>
michael@0 60
michael@0 61 <!-- visibility: hidden -->
michael@0 62 <div id="hidden-wrapper" style="border: 1px dashed teal;">
michael@0 63 <div id="hidden" style="opacity: 0.5; background-color: blue; visibility:hidden;">hidden</div>
michael@0 64 </div>
michael@0 65
michael@0 66 <!-- iframe (within iframe) -->
michael@0 67 <iframe id="our-iframe" src="bug199692-nested.html" style="height: 100px; overflow: scroll;"></iframe>
michael@0 68
michael@0 69 <input type="textbox" id="textbox" value="textbox"></input>
michael@0 70 </div>
michael@0 71
michael@0 72 <!-- interaction with scrolling -->
michael@0 73 <iframe id="scrolled-iframe"
michael@0 74 src="bug199692-scrolled.html#down"
michael@0 75 style="position: absolute; top: 345px; left: 325px; height: 200px; width: 200px"></iframe>
michael@0 76
michael@0 77 <script type="application/javascript">
michael@0 78
michael@0 79 var SimpleTest = window.opener.SimpleTest;
michael@0 80 function ok() { window.opener.ok.apply(window.opener, arguments); }
michael@0 81 function is() { window.opener.is.apply(window.opener, arguments); }
michael@0 82 function todo() { window.opener.todo.apply(window.opener, arguments); }
michael@0 83 function todo_is() { window.opener.todo_is.apply(window.opener, arguments); }
michael@0 84 function $(id) { return document.getElementById(id); }
michael@0 85
michael@0 86 /**
michael@0 87 * Like is, but for tests which don't always succeed or always fail on all
michael@0 88 * platforms.
michael@0 89 */
michael@0 90 function random_fail(a, b, m)
michael@0 91 {
michael@0 92 if (a != b)
michael@0 93 todo_is(a, b, m);
michael@0 94 else
michael@0 95 is(a, b, m);
michael@0 96 }
michael@0 97
michael@0 98 /* Test for Bug 199692 */
michael@0 99
michael@0 100 function getCoords(elt)
michael@0 101 {
michael@0 102 var x = 0, y = 0;
michael@0 103
michael@0 104 do
michael@0 105 {
michael@0 106 x += elt.offsetLeft;
michael@0 107 y += elt.offsetTop;
michael@0 108 } while ((elt = elt.offsetParent));
michael@0 109
michael@0 110 return { x: x, y: y };
michael@0 111 }
michael@0 112
michael@0 113 var elts = ["txt", "empty", "whitespace", "static", "fixed", "absolute",
michael@0 114 "relative", "float", "textbox"];
michael@0 115
michael@0 116 function testPoints()
michael@0 117 {
michael@0 118 ok('elementFromPoint' in document, "document.elementFromPoint must exist");
michael@0 119 ok(typeof document.elementFromPoint === "function", "must be a function");
michael@0 120
michael@0 121 var doc = document;
michael@0 122 doc.pt = doc.elementFromPoint; // for shorter lines
michael@0 123 is(doc.pt(-1, 0), null, "Negative coordinates (-1, 0) should return null");
michael@0 124 is(doc.pt(0, -1), null, "Negative coordinates (0, -1) should return null");
michael@0 125 is(doc.pt(-1, -1), null, "Negative coordinates (-1, -1) should return null");
michael@0 126
michael@0 127 var pos;
michael@0 128 for (var i = 0; i < elts.length; i++)
michael@0 129 {
michael@0 130 var id = elts[i];
michael@0 131 var elt = $(id);
michael@0 132
michael@0 133 // The upper left corner of an element (with a moderate offset) will
michael@0 134 // usually contain text, and the lower right corner usually won't.
michael@0 135 var pos = getCoords(elt);
michael@0 136 var x = pos.x, y = pos.y;
michael@0 137 var w = elt.offsetWidth, h = elt.offsetHeight;
michael@0 138
michael@0 139 var d = 5;
michael@0 140 is(doc.pt(x + d, y + d), elt,
michael@0 141 "(" + (x + d) + "," + (y + d) + ") IDs should match (upper left " +
michael@0 142 "corner of " + id + ")");
michael@0 143 is(doc.pt(x + w - d, y + h - d), elt,
michael@0 144 "(" + (x + w - d) + "," + (y + h - d) + ") IDs should match (lower " +
michael@0 145 "right corner of " + id + ")");
michael@0 146 }
michael@0 147
michael@0 148 // content
michael@0 149 var c = $("content");
michael@0 150 pos = getCoords(c);
michael@0 151 x = pos.x + c.offsetWidth / 2;
michael@0 152 y = pos.y;
michael@0 153
michael@0 154 // This fails on some platforms but not others for unknown reasons
michael@0 155 random_fail(doc.pt(x, y), c, "Point to right of #txt should be #content");
michael@0 156 is(doc.pt(x, y + 1), c, "Point to right of #txt should be #content");
michael@0 157 random_fail(doc.pt(x + 1, y), c, "Point to right of #txt should be #content");
michael@0 158 is(doc.pt(x + 1, y + 1), c, "Point to right of #txt should be #content");
michael@0 159
michael@0 160 // hidden
michael@0 161 c = $("hidden");
michael@0 162 pos = getCoords(c);
michael@0 163 x = pos.x, y = pos.y;
michael@0 164 is(doc.pt(x, y), $("hidden-wrapper"),
michael@0 165 "Hit testing should bypass hidden elements.");
michael@0 166
michael@0 167 // iframe nested
michael@0 168 var iframe = $("our-iframe");
michael@0 169 pos = getCoords(iframe);
michael@0 170 x = pos.x, y = pos.y;
michael@0 171 is(doc.pt(x + 20, y + 20), $("our-iframe"),
michael@0 172 "Element from nested iframe returned is from calling document");
michael@0 173 // iframe, doubly nested
michael@0 174 is(doc.pt(x + 60, y + 60), $("our-iframe"),
michael@0 175 "Element from doubly nested iframe returned is from calling document");
michael@0 176
michael@0 177 // scrolled iframe tests
michael@0 178 $("scrolled-iframe").contentWindow.runTests();
michael@0 179
michael@0 180 SimpleTest.finish();
michael@0 181 window.close();
michael@0 182 }
michael@0 183
michael@0 184 window.onload = testPoints;
michael@0 185 </script>
michael@0 186 </body>
michael@0 187 </html>
michael@0 188

mercurial