Wed, 31 Dec 2014 06:09:35 +0100
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=496275 |
michael@0 | 5 | --> |
michael@0 | 6 | |
michael@0 | 7 | <head> |
michael@0 | 8 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
michael@0 | 9 | <title>Test for Bug 496275</title> |
michael@0 | 10 | <script type="application/javascript" src="/MochiKit/MochiKit.js"></script> |
michael@0 | 11 | <script type="application/javascript" |
michael@0 | 12 | src="/tests/SimpleTest/SimpleTest.js"></script> |
michael@0 | 13 | <script type="application/javascript" |
michael@0 | 14 | src="/tests/SimpleTest/WindowSnapshot.js"></script> |
michael@0 | 15 | <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> |
michael@0 | 16 | </head> |
michael@0 | 17 | |
michael@0 | 18 | <body onload="run()"> |
michael@0 | 19 | <a target="_blank" |
michael@0 | 20 | href="https://bugzilla.mozilla.org/show_bug.cgi?id=496275"> |
michael@0 | 21 | Mozilla Bug 496275 |
michael@0 | 22 | </a> |
michael@0 | 23 | <p id="display"></p> |
michael@0 | 24 | <div id="c" contenteditable="true"> |
michael@0 | 25 | <p id="p1">The first paragraph. Another sentence. Even more text.</p> |
michael@0 | 26 | <p id="p2">Paragraph no. 2.</p> |
michael@0 | 27 | <p id="p3">This paragraph<br> |
michael@0 | 28 | is broken up<br> |
michael@0 | 29 | into four<br> |
michael@0 | 30 | lines</p> |
michael@0 | 31 | </div> |
michael@0 | 32 | |
michael@0 | 33 | <div id="ltr" contenteditable="true"> |
michael@0 | 34 | <p id="l1">םלש Hello</p> |
michael@0 | 35 | <p id="l2">Goodbye</p> |
michael@0 | 36 | </div> |
michael@0 | 37 | |
michael@0 | 38 | <div id="rtl" contenteditable="true" dir="rtl"> |
michael@0 | 39 | <p id="r1">התרגום האחרון שפיתחנו הוא עבור Firefox 3.5.6.</p> |
michael@0 | 40 | <p id="r2">קראו את הערות ההפצה (אנגלית) להוראות ורשימת בעיות ידועות.</p> |
michael@0 | 41 | </div> |
michael@0 | 42 | |
michael@0 | 43 | <!-- Special characters: لا is actually two characters, while تَ should be |
michael@0 | 44 | treated as one character. --> |
michael@0 | 45 | <div id="special" contenteditable="true"> |
michael@0 | 46 | <p id="s1">a لا b تَ c</p> |
michael@0 | 47 | </div> |
michael@0 | 48 | |
michael@0 | 49 | <div> |
michael@0 | 50 | <p>Anchor offset: <span id="anchor-offset"></span></p> |
michael@0 | 51 | <p>Focus offset: <span id="focus-offset"></span></p> |
michael@0 | 52 | </div> |
michael@0 | 53 | |
michael@0 | 54 | <script type="application/javascript"> |
michael@0 | 55 | SimpleTest.waitForExplicitFinish(); |
michael@0 | 56 | |
michael@0 | 57 | function isOrIsParent(actual, expected, msg) { |
michael@0 | 58 | // actual should be expected or actual's parent node should be expected. |
michael@0 | 59 | msg += " Expected " + actual + " or " + actual.parentNode + |
michael@0 | 60 | " to be " + expected + "."; |
michael@0 | 61 | |
michael@0 | 62 | ok(actual == expected || actual.parentNode == expected, msg); |
michael@0 | 63 | } |
michael@0 | 64 | |
michael@0 | 65 | function isAt(anchorNode, anchorOffset, focusNode, focusOffset, msg) { |
michael@0 | 66 | var sel = window.getSelection(); |
michael@0 | 67 | |
michael@0 | 68 | isOrIsParent(sel.anchorNode, $(anchorNode), msg + ": Wrong anchor node."); |
michael@0 | 69 | is(sel.anchorOffset, anchorOffset, msg + ": Wrong anchor offset."); |
michael@0 | 70 | isOrIsParent(sel.focusNode, $(focusNode), msg + ": Wrong focus node."); |
michael@0 | 71 | is(sel.focusOffset, $(focusOffset), msg + ": Wrong focus offset."); |
michael@0 | 72 | } |
michael@0 | 73 | |
michael@0 | 74 | function run() { |
michael@0 | 75 | var sel = window.getSelection(); |
michael@0 | 76 | |
michael@0 | 77 | // If nothing is focused, selection.modify() should silently fail. |
michael@0 | 78 | sel.removeAllRanges(); |
michael@0 | 79 | sel.modify("move", "forward", "character"); |
michael@0 | 80 | |
michael@0 | 81 | // Now focus our first div and put the cursor at the beginning of p1. |
michael@0 | 82 | $("c").focus(); |
michael@0 | 83 | sel.collapse($("p1"), 0); |
michael@0 | 84 | |
michael@0 | 85 | // We're intentionally inconsistent with the capitalization of "move", |
michael@0 | 86 | // "extend", etc. below to test the case-insensitivity of modify(). |
michael@0 | 87 | |
michael@0 | 88 | // If we move backward, selection.modify() shouldn't do anything, since we're |
michael@0 | 89 | // already at the beginning of the frame. |
michael@0 | 90 | isAt("p1", 0, "p1", 0, "test 0a"); |
michael@0 | 91 | sel.modify("Move", "Backward", "Character"); |
michael@0 | 92 | isAt("p1", 0, "p1", 0, "test 0b"); |
michael@0 | 93 | |
michael@0 | 94 | // After this move, the cursor should be at the second character of p1 |
michael@0 | 95 | sel.modify("Move", "Forward", "Character"); |
michael@0 | 96 | isAt("p1", 1, "p1", 1, "test 1"); |
michael@0 | 97 | |
michael@0 | 98 | // Select the first character in p1 |
michael@0 | 99 | sel.collapse($("p1"), 0); |
michael@0 | 100 | sel.modify("Extend", "Forward", "Character"); |
michael@0 | 101 | isAt("p1", 0, "p1", 1, "test 2"); |
michael@0 | 102 | sel.modify("Move", "Forward", "Character"); |
michael@0 | 103 | isAt("p1", 2, "p1", 2, "test 2a"); |
michael@0 | 104 | |
michael@0 | 105 | // Select all of p1, then move the selection forward one character a few |
michael@0 | 106 | // times. |
michael@0 | 107 | sel.collapse($("p1"), 0); |
michael@0 | 108 | sel.extend($("p1"), 1); |
michael@0 | 109 | sel.modify("move", "forward", "character"); |
michael@0 | 110 | isAt("p2", 0, "p2", 0, "test 3a"); |
michael@0 | 111 | sel.modify("move", "forward", "character"); |
michael@0 | 112 | isAt("p2", 1, "p2", 1, "test 3b"); |
michael@0 | 113 | |
michael@0 | 114 | // Put the cursor at the beginning of p3, then extend forward one line. |
michael@0 | 115 | // Now go back twice and forward once. Focus should now be at the end of p3. |
michael@0 | 116 | sel.collapse($("p3"), 0); |
michael@0 | 117 | sel.modify("Extend", "Forward", "Line"); |
michael@0 | 118 | sel.modify("extend", "backward", "character"); |
michael@0 | 119 | sel.modify("extend", "backward", "character"); |
michael@0 | 120 | sel.modify("extend", "forward", "character"); |
michael@0 | 121 | isAt("p3", 0, "p3", 14, "test 4"); |
michael@0 | 122 | |
michael@0 | 123 | // Put the cursor at the beginning of p3, then go forward a few words |
michael@0 | 124 | sel.collapse($("p3"), 0); |
michael@0 | 125 | sel.modify("Move", "Forward", "Word"); |
michael@0 | 126 | isAt("p3", 4, "p3", 4, "test 4a"); |
michael@0 | 127 | sel.modify("move", "forward", "word"); |
michael@0 | 128 | // Go back and forward so the indexes are correct. |
michael@0 | 129 | sel.modify("move", "backward", "character"); |
michael@0 | 130 | sel.modify("move", "forward", "character"); |
michael@0 | 131 | isAt("p3", 14, "p3", 14, "test 4b"); |
michael@0 | 132 | |
michael@0 | 133 | // Test the lineboundary granularity |
michael@0 | 134 | sel.collapse($("p3"), 0); |
michael@0 | 135 | sel.modify("Move", "Forward", "Lineboundary"); |
michael@0 | 136 | // Go back and forward so the indexes are correct. |
michael@0 | 137 | sel.modify("move", "Backward", "character"); |
michael@0 | 138 | sel.modify("move", "forward", "character"); |
michael@0 | 139 | isAt("p3", 14, "p3", 14, "test 5"); |
michael@0 | 140 | |
michael@0 | 141 | // |
michael@0 | 142 | // Test RTL text within a dir=LTR div. |
michael@0 | 143 | // |
michael@0 | 144 | $("ltr").focus(); |
michael@0 | 145 | sel.collapse($("l1"), 0); |
michael@0 | 146 | isAt("l1", 0, "l1", 0, "test 6a"); |
michael@0 | 147 | sel.modify("Move", "Left", "Character"); |
michael@0 | 148 | isAt("l1", 1, "l1", 1, "test 6b"); |
michael@0 | 149 | sel.modify("Extend", "Backward", "Character"); |
michael@0 | 150 | isAt("l1", 1, "l1", 0, "test 6c"); |
michael@0 | 151 | sel.modify("extend", "forward", "character"); |
michael@0 | 152 | isAt("l1", 1, "l1", 1, "test 6d"); |
michael@0 | 153 | sel.modify("Extend", "Right", "Character"); |
michael@0 | 154 | isAt("l1", 1, "l1", 0, "test 6e"); |
michael@0 | 155 | |
michael@0 | 156 | sel.collapse($("l1"), 0); |
michael@0 | 157 | sel.modify("move", "left", "character"); |
michael@0 | 158 | sel.modify("extend", "right", "Word"); |
michael@0 | 159 | isAt("l1", 1, "l1", 3, "test 7a"); |
michael@0 | 160 | sel.modify("move", "left", "word"); |
michael@0 | 161 | isAt("l1", 3, "l1", 3, "test 7b"); |
michael@0 | 162 | sel.modify("move", "forward", "word"); |
michael@0 | 163 | isAt("l1", 9, "l1", 9, "test 7c"); |
michael@0 | 164 | sel.modify("extend", "backward", "word"); |
michael@0 | 165 | isAt("l1", 9, "l1", 4, "test 7d"); |
michael@0 | 166 | sel.modify("move", "left", "word"); |
michael@0 | 167 | isAt("l1", 3, "l1", 3, "test 7e"); |
michael@0 | 168 | |
michael@0 | 169 | sel.collapse($("l1"), 0); |
michael@0 | 170 | sel.modify("extend", "left", "lineboundary"); |
michael@0 | 171 | isAt("l1", 0, "l1", 3, "test 8a"); |
michael@0 | 172 | sel.modify("move", "forward", "lineboundary"); |
michael@0 | 173 | isAt("l1", 9, "l1", 9, "test 8b"); |
michael@0 | 174 | sel.modify("extend", "backward", "lineboundary"); |
michael@0 | 175 | isAt("l1", 9, "l1", 0, "test 8c"); |
michael@0 | 176 | sel.modify("move", "left", "lineboundary"); |
michael@0 | 177 | isAt("l1", 3, "l1", 3, "test 8d"); |
michael@0 | 178 | sel.modify("extend", "forward", "lineboundary"); |
michael@0 | 179 | isAt("l1", 3, "l1", 9, "test 8e"); |
michael@0 | 180 | |
michael@0 | 181 | // Put the cursor at the left edge of the first line so that when we go up |
michael@0 | 182 | // and down, where we end up doesn't depend on how the characters line up. |
michael@0 | 183 | sel.collapse($("l1"), 0); |
michael@0 | 184 | sel.modify("move", "left", "lineboundary"); |
michael@0 | 185 | isAt("l1", 3, "l1", 3, "test 9a"); |
michael@0 | 186 | sel.modify("move", "forward", "Line"); |
michael@0 | 187 | isAt("l2", 0, "l2", 0, "test 9b"); |
michael@0 | 188 | sel.modify("extend", "backward", "Line"); |
michael@0 | 189 | // Apparently going up from the beginning of the line takes us to offset 3 in |
michael@0 | 190 | // the line above. This is a little weird, but it's consistent with how the |
michael@0 | 191 | // keyboard works. |
michael@0 | 192 | isAt("l2", 0, "l1", 3, "test 9c"); |
michael@0 | 193 | |
michael@0 | 194 | // Same test as above, now with absolute directions. |
michael@0 | 195 | sel.collapse($("l1"), 0); |
michael@0 | 196 | sel.modify("move", "left", "lineboundary"); |
michael@0 | 197 | isAt("l1", 3, "l1", 3, "test 10a"); |
michael@0 | 198 | sel.modify("move", "right", "line"); |
michael@0 | 199 | isAt("l2", 0, "l2", 0, "test 10b"); |
michael@0 | 200 | sel.modify("extend", "left", "line"); |
michael@0 | 201 | isAt("l2", 0, "l1", 3, "test 10c"); |
michael@0 | 202 | |
michael@0 | 203 | // |
michael@0 | 204 | // Test RTL text within a dir=RTL div. |
michael@0 | 205 | // |
michael@0 | 206 | $("rtl").focus(); |
michael@0 | 207 | sel.collapse($("r1"), 0); |
michael@0 | 208 | sel.modify("move", "forward", "character"); |
michael@0 | 209 | isAt("r1", 1, "r1", 1, "test 11a"); |
michael@0 | 210 | sel.modify("extend", "backward", "character"); |
michael@0 | 211 | isAt("r1", 1, "r1", 0, "test 11b"); |
michael@0 | 212 | sel.modify("move", "forward", "word"); |
michael@0 | 213 | isAt("r1", 6, "r1", 6, "test 11c"); |
michael@0 | 214 | sel.modify("extend", "backward", "word"); |
michael@0 | 215 | isAt("r1", 6, "r1", 0, "test 11d"); |
michael@0 | 216 | sel.modify("extend", "forward", "lineboundary"); |
michael@0 | 217 | isAt("r1", 6, "r1", 45, "test 11e"); |
michael@0 | 218 | |
michael@0 | 219 | // Same as above, but with absolute directions. |
michael@0 | 220 | sel.collapse($("r1"), 0); |
michael@0 | 221 | sel.modify("move", "left", "character"); |
michael@0 | 222 | isAt("r1", 1, "r1", 1, "test 12a"); |
michael@0 | 223 | sel.modify("extend", "right", "character"); |
michael@0 | 224 | isAt("r1", 1, "r1", 0, "test 12b"); |
michael@0 | 225 | sel.modify("move", "left", "word"); |
michael@0 | 226 | isAt("r1", 6, "r1", 6, "test 12c"); |
michael@0 | 227 | sel.modify("extend", "right", "word"); |
michael@0 | 228 | isAt("r1", 6, "r1", 0, "test 12d"); |
michael@0 | 229 | |
michael@0 | 230 | // Test that move left/right is correct within the RTL div. |
michael@0 | 231 | sel.collapse($("r1"), 0); |
michael@0 | 232 | sel.modify("extend", "left", "lineboundary"); |
michael@0 | 233 | isAt("r1", 0, "r1", 45, "test 13a"); |
michael@0 | 234 | sel.modify("move", "right", "lineboundary"); |
michael@0 | 235 | isAt("r1", 0, "r1", 0, "test 13b"); |
michael@0 | 236 | |
michael@0 | 237 | // Test that up/down at the first/last line correctly wraps to the |
michael@0 | 238 | // beginning/end of the line. |
michael@0 | 239 | sel.collapse($("r1"), 0); |
michael@0 | 240 | sel.modify("move", "forward", "word"); |
michael@0 | 241 | isAt("r1", 6, "r1", 6, "test 14a"); |
michael@0 | 242 | // Even in RTL text, "left" still means up. |
michael@0 | 243 | sel.modify("extend", "left", "Line"); |
michael@0 | 244 | isAt("r1", 6, "r1", 0, "test 14b"); |
michael@0 | 245 | sel.modify("move", "right", "line"); |
michael@0 | 246 | isAt("r2", 0, "r2", 0, "test 14c"); |
michael@0 | 247 | sel.modify("extend", "forward", "line"); |
michael@0 | 248 | isAt("r2", 0, "r2", 57, "test 14d"); |
michael@0 | 249 | sel.modify("move", "backward", "line"); |
michael@0 | 250 | isAt("r1", 45, "r1", 45, "test 14e"); |
michael@0 | 251 | |
michael@0 | 252 | // Test some special characters. |
michael@0 | 253 | $("special").focus(); |
michael@0 | 254 | sel.collapse($("s1"), 0); |
michael@0 | 255 | sel.modify("move", "forward", "character"); |
michael@0 | 256 | sel.modify("move", "forward", "character"); |
michael@0 | 257 | sel.modify("move", "forward", "character"); |
michael@0 | 258 | isAt("s1", 3, "s1", 3, "test 15a"); |
michael@0 | 259 | sel.modify("move", "forward", "character"); |
michael@0 | 260 | isAt("s1", 4, "s1", 4, "test 15b"); |
michael@0 | 261 | sel.modify("move", "backward", "word"); |
michael@0 | 262 | isAt("s1", 2, "s1", 2, "test 15c"); |
michael@0 | 263 | sel.modify("move", "forward", "word"); |
michael@0 | 264 | sel.modify("move", "forward", "word"); |
michael@0 | 265 | sel.modify("move", "forward", "word"); |
michael@0 | 266 | isAt("s1", 9, "s1", 9, "test 15d"); |
michael@0 | 267 | |
michael@0 | 268 | SimpleTest.finish(); |
michael@0 | 269 | } |
michael@0 | 270 | |
michael@0 | 271 | function update_debug_info() { |
michael@0 | 272 | var sel = window.getSelection(); |
michael@0 | 273 | document.getElementById("anchor-offset").innerHTML = sel.anchorOffset; |
michael@0 | 274 | document.getElementById("focus-offset").innerHTML = sel.focusOffset; |
michael@0 | 275 | setTimeout(update_debug_info, 100); |
michael@0 | 276 | } |
michael@0 | 277 | |
michael@0 | 278 | setTimeout(update_debug_info, 100); |
michael@0 | 279 | |
michael@0 | 280 | </script> |
michael@0 | 281 | </body> |
michael@0 | 282 | </html> |