1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/dom/tests/mochitest/chrome/queryCaretRectWin.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,223 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<head>
1.7 +<title>nsIDOMWindowUtils::sendQueryContentEvent w/QUERY_CARET_RECT test</title>
1.8 +<script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
1.9 +<link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
1.10 +
1.11 +<!--
1.12 + #########################################################
1.13 + # WARNING: this file has Windows line endings. If you
1.14 + # update this file please maintain them. Line endings are
1.15 + # taken into account when calculating query caret rect
1.16 + # values.
1.17 + #########################################################
1.18 +-->
1.19 +
1.20 +<style>
1.21 + #text {
1.22 + position: absolute;
1.23 + left: 0em;
1.24 + top: 0em;
1.25 + font-size: 10pt;
1.26 + font-family: monospace;
1.27 + line-height: 20px;
1.28 + letter-spacing: 0px;
1.29 + margin-top:-1px; /* nix the text area border */
1.30 + overflow: hidden;
1.31 + width:800px;
1.32 + height:400px;
1.33 + }
1.34 + #div-hor {
1.35 + position: absolute;
1.36 + left: 0em;
1.37 + border-top:1px solid lightgray;
1.38 + width: 1000px;
1.39 + pointer-events:none;
1.40 + }
1.41 + #div-ver {
1.42 + position: absolute;
1.43 + top: 0em;
1.44 + border-left:1px solid lightgray;
1.45 + height: 500px;
1.46 + pointer-events:none;
1.47 + }
1.48 +</style>
1.49 +
1.50 +<script type="application/javascript;version=1.8">
1.51 + let SimpleTest = window.opener.SimpleTest;
1.52 + let Ci = Components.interfaces;
1.53 +
1.54 + function ok() { window.opener.ok.apply(window.opener, arguments); }
1.55 + function done() { window.opener.done.apply(window.opener, arguments); }
1.56 +
1.57 + function dumpLn() {
1.58 + for (let idx = 0; idx < arguments.length; idx++)
1.59 + dump(arguments[idx] + " ");
1.60 + dump("\n");
1.61 + }
1.62 +
1.63 + // drawn grid is 20x20
1.64 + function drawGrid() {
1.65 + for (var idx = 0; idx < 20; idx++) {
1.66 + var e = document.createElement("div");
1.67 + e.setAttribute("id", "div-hor");
1.68 + e.style.top = (idx*20) + "px";
1.69 + document.getElementById("container").appendChild(e);
1.70 + }
1.71 + for (var idx = 0; idx < 40; idx++) {
1.72 + var e = document.createElement("div");
1.73 + e.setAttribute("id", "div-ver");
1.74 + e.style.left = (idx*20) + "px";
1.75 + document.getElementById("container").appendChild(e);
1.76 + }
1.77 + }
1.78 +
1.79 + function getSelection(aElement) {
1.80 + if (aElement instanceof Ci.nsIDOMNSEditableElement) {
1.81 + return aElement.QueryInterface(Ci.nsIDOMNSEditableElement)
1.82 + .editor.selection;
1.83 + }
1.84 + return null;
1.85 + }
1.86 +
1.87 + function testCaretPosition(aDomWinUtils, aOffset, aRectDims) {
1.88 + let rect = aDomWinUtils.sendQueryContentEvent(
1.89 + aDomWinUtils.QUERY_CARET_RECT,
1.90 + aOffset, 0, 0, 0,
1.91 + aDomWinUtils.QUERY_CONTENT_FLAG_USE_XP_LINE_BREAK);
1.92 + ok(rect, "rect returned");
1.93 + ok(rect.succeeded, "call succeeded");
1.94 +
1.95 + info("left:" + rect.left + " top:" + rect.top);
1.96 +
1.97 + ok(rect.left > aRectDims.min.left, "rect.left > " + aRectDims.min.left);
1.98 + ok(rect.left < aRectDims.max.left, "rect.left < " + aRectDims.max.left);
1.99 + ok(rect.top > aRectDims.min.top, "rect.top > " + aRectDims.min.top);
1.100 + ok(rect.top < aRectDims.max.top, "rect.top < " + aRectDims.max.top);
1.101 + }
1.102 +
1.103 + function doTest() {
1.104 + let domWinUtils = window.QueryInterface(Ci.nsIInterfaceRequestor)
1.105 + .getInterface(Ci.nsIDOMWindowUtils);
1.106 +
1.107 + let text = document.getElementById("text");
1.108 +
1.109 + text.focus();
1.110 +
1.111 + let textrect = text.getBoundingClientRect();
1.112 +
1.113 + let cp = document.caretPositionFromPoint(10, 395);
1.114 + let input = cp.offsetNode;
1.115 + let offset = cp.offset;
1.116 + input.selectionStart = input.selectionEnd = offset;
1.117 +
1.118 + let selection = getSelection(text);
1.119 +
1.120 + testCaretPosition(domWinUtils, input.selectionStart, {
1.121 + min: { left: 10, top: 380 },
1.122 + max: { left: 25, top: 390 },
1.123 + });
1.124 +
1.125 + testCaretPosition(domWinUtils, input.selectionEnd, {
1.126 + min: { left: 10, top: 380 },
1.127 + max: { left: 25, top: 390 },
1.128 + });
1.129 +
1.130 + testCaretPosition(domWinUtils, text.selectionStart, {
1.131 + min: { left: 10, top: 380 },
1.132 + max: { left: 25, top: 390 },
1.133 + });
1.134 +
1.135 + testCaretPosition(domWinUtils, text.selectionEnd, {
1.136 + min: { left: 10, top: 380 },
1.137 + max: { left: 25, top: 390 },
1.138 + });
1.139 +
1.140 + testCaretPosition(domWinUtils, selection.anchorOffset, {
1.141 + min: { left: 10, top: 380 },
1.142 + max: { left: 25, top: 390 },
1.143 + });
1.144 +
1.145 + testCaretPosition(domWinUtils, selection.focusOffset, {
1.146 + min: { left: 10, top: 380 },
1.147 + max: { left: 25, top: 390 },
1.148 + });
1.149 +
1.150 + cp = document.caretPositionFromPoint(395, 395);
1.151 + input = cp.offsetNode;
1.152 + offset = cp.offset;
1.153 + input.selectionStart = input.selectionEnd = offset;
1.154 +
1.155 + let selection = getSelection(text);
1.156 +
1.157 + testCaretPosition(domWinUtils, input.selectionStart, {
1.158 + min: { left: 390, top: 380 },
1.159 + max: { left: 400, top: 390 },
1.160 + });
1.161 +
1.162 + testCaretPosition(domWinUtils, input.selectionEnd, {
1.163 + min: { left: 390, top: 380 },
1.164 + max: { left: 400, top: 390 },
1.165 + });
1.166 +
1.167 + testCaretPosition(domWinUtils, text.selectionStart, {
1.168 + min: { left: 390, top: 380 },
1.169 + max: { left: 400, top: 390 },
1.170 + });
1.171 +
1.172 + testCaretPosition(domWinUtils, text.selectionEnd, {
1.173 + min: { left: 390, top: 380 },
1.174 + max: { left: 400, top: 390 },
1.175 + });
1.176 +
1.177 + testCaretPosition(domWinUtils, selection.anchorOffset, {
1.178 + min: { left: 390, top: 380 },
1.179 + max: { left: 400, top: 390 },
1.180 + });
1.181 +
1.182 + testCaretPosition(domWinUtils, selection.focusOffset, {
1.183 + min: { left: 390, top: 380 },
1.184 + max: { left: 400, top: 390 },
1.185 + });
1.186 +
1.187 + done();
1.188 + }
1.189 +
1.190 +</script>
1.191 +
1.192 +<body onload="doTest()">
1.193 +<textarea id="text" wrap="on">
1.194 +Alice was beginning to get very tired of sitting by her sister on the bank,
1.195 +and of having nothing to do: once or twice she had peeped into the book
1.196 +her sister was reading, but it had no pictures or conversations in it,
1.197 +`and what is the use of a book,' thought Alice `without pictures or
1.198 +conversation?'
1.199 +
1.200 +So she was considering in her own mind (as well as she could, for the
1.201 +hot day made her feel very sleepy and stupid), whether the pleasure of
1.202 +making a daisy-chain would be worth the trouble of getting up and
1.203 +picking the daisies, when suddenly a White Rabbit with pink In another
1.204 +moment down went Alice after it, never once considering how in the world
1.205 +she was to get out again.
1.206 +
1.207 +The rabbit-hole went straight on like a tunnel for some way, and then
1.208 +dipped suddenly down, so suddenly that Alice had not a moment to think
1.209 +about stopping herself before she found herself falling down a very deep
1.210 +well.
1.211 +
1.212 +Either the well was very deep, or she fell very slowly, for she had
1.213 +plenty of time as she went down to look about her and to wonder what was
1.214 + going to happen next. First, she tried to look down and make out what
1.215 +she was coming to, but it was too dark to see anything; then she looked
1.216 +at the sides of the well, and noticed that they were filled with
1.217 +cupboards and book-shelves; here and there she saw maps and pictures
1.218 +hung upon pegs. She took down a jar from one of the shelves as she
1.219 +passed; it was labelled `ORANGE MARMALADE', but to her great
1.220 +disappointment it was empty: she did not like to drop the jar for fear
1.221 +of killing somebody, so managed to put it into one of the cupboards as
1.222 +she fell past it.
1.223 +</textarea>
1.224 +<div id="container"></div>
1.225 +</body>
1.226 +</html>
