test_bug406596.html (3022B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=406596 5 --> 6 <head> 7 <title>Test for Bug 406596</title> 8 <script src="/tests/SimpleTest/SimpleTest.js"></script> 9 <script src="/tests/SimpleTest/EventUtils.js"></script> 10 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" /> 11 </head> 12 <body> 13 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=406596">Mozilla Bug 406596</a> 14 <div id="content"> 15 <div id="edit" contenteditable="true">This text is editable, you can change its content <a href="#" id="a" tabindex="0">ABCDEFGHIJKLMNOPQRSTUV</a> <input type="submit" value="abcd" id="b"></input> <img src="foo.png" id="c"></div> 16 <div tabindex="0">This text is not editable but is focusable</div> 17 <div tabindex="0">This text is not editable but is focusable</div> 18 <a href="#" id="d" contenteditable="true">ABCDEFGHIJKLMNOPQRSTUV</a> 19 <div tabindex="0">This text is not editable but is focusable</div> 20 <div tabindex="0">This text is not editable but is focusable</div> 21 </div> 22 <pre id="test"> 23 <script class="testbody" type="text/javascript"> 24 25 /** Test for Bug 406596 */ 26 27 function testTabbing(click, focus, selectionOffset) { 28 var elem = document.getElementById(click); 29 var rect = elem.getBoundingClientRect(); 30 var selection = window.getSelection(); 31 32 var x = (rect.left + rect.right) / 4; 33 var y = (rect.top + rect.bottom) / 2; 34 synthesizeMouseAtPoint(x, y, { type: "mousedown" }); 35 synthesizeMouseAtPoint(x + selectionOffset, y, { type: "mousemove" }); 36 synthesizeMouseAtPoint(x + selectionOffset, y, { type: "mouseup" }); 37 if (selectionOffset) { 38 is(selection.rangeCount, 1, "there should be one range in the selection"); 39 var range = selection.getRangeAt(0); 40 } 41 var focusedElement = document.activeElement; 42 is(focusedElement, document.getElementById(focus), 43 "clicking should move focus to the contentEditable node"); 44 synthesizeKey("KEY_Tab"); 45 synthesizeKey("KEY_Tab"); 46 synthesizeKey("KEY_Tab", {shiftKey: true}); 47 synthesizeKey("KEY_Tab", {shiftKey: true}); 48 is(document.activeElement, focusedElement, 49 "tab/shift-tab should move focus back to the contentEditable node"); 50 if (selectionOffset) { 51 is(selection.rangeCount, 1, 52 "there should still be one range in the selection"); 53 var newRange = selection.getRangeAt(0); 54 is(newRange.compareBoundaryPoints(Range.START_TO_START, range), 0, 55 "the selection should be the same as before the tabbing"); 56 is(newRange.compareBoundaryPoints(Range.END_TO_END, range), 0, 57 "the selection should be the same as before the tabbing"); 58 } 59 } 60 61 function test() { 62 window.getSelection().removeAllRanges(); 63 testTabbing("edit", "edit", 0); 64 testTabbing("a", "edit", 0); 65 testTabbing("d", "d", 0); 66 testTabbing("edit", "edit", 10); 67 testTabbing("a", "edit", 10); 68 testTabbing("d", "d", 10); 69 70 SimpleTest.finish(); 71 } 72 73 window.onload = function() { 74 SimpleTest.waitForExplicitFinish(); 75 setTimeout(test, 0); 76 }; 77 78 </script> 79 </pre> 80 </body> 81 </html>