test_abs_positioner_hidden_during_dragging.html (4564B)
1 <!DOCTYPE html> 2 <meta charset="utf-8" /> 3 <title>Drag absolutely positioned element to crash</title> 4 <script src="/tests/SimpleTest/SimpleTest.js"></script> 5 <script src="/tests/SimpleTest/EventUtils.js"></script> 6 <link rel="stylesheet" href="/tests/SimpleTest/test.css"/> 7 <div 8 contenteditable 9 style=" 10 border: blue 1px solid; 11 margin: 20px; 12 " 13 > 14 <div 15 style=" 16 border: red 1px dashed; 17 background-color: rgba(255, 0, 0, 0.3); 18 position: absolute; 19 width: 100px; 20 height: 100px; 21 overflow: auto; 22 " 23 > 24 This is absolutely positioned element. 25 </div> 26 <p>This is static positioned paragraph #1</p> 27 <p>This is static positioned paragraph #2</p> 28 <p>This is static positioned paragraph #3</p> 29 <p>This is static positioned paragraph #4</p> 30 <p>This is static positioned paragraph #5</p> 31 <p>This is static positioned paragraph #6</p> 32 <p>This is static positioned paragraph #7</p> 33 </div> 34 <script> 35 "use strict"; 36 37 document.execCommand("enableAbsolutePositionEditing", false, true); 38 39 SimpleTest.waitForExplicitFinish(); 40 SimpleTest.waitForFocus(async () => { 41 disableNonTestMouseEvents(true); 42 try { 43 document.querySelector("div[contenteditable").focus(); 44 45 function promiseSelectionChange() { 46 return new Promise(resolve => { 47 document.addEventListener("selectionchange", () => { 48 resolve(); 49 }, {once: true}); 50 }); 51 } 52 53 let absContainer = document.querySelector("div > div"); 54 let rect = absContainer.getBoundingClientRect(); 55 // We still don't have a way to retrieve the grabber. Therefore, we need 56 // to compute a point in the grabber from the absolutely positioned 57 // element's top-left coordinates. 58 const kOffsetX = 18; 59 const kOffsetY = -7; 60 let waitForSelectionChange = promiseSelectionChange(); 61 synthesizeMouseAtCenter(absContainer, {}); 62 await waitForSelectionChange; 63 synthesizeMouse(absContainer, kOffsetX, kOffsetY, {type: "mousedown"}); 64 ok(absContainer.hasAttribute("_moz_abspos"), "Mousedown on the grabber should make it in drag mode"); 65 synthesizeMouseAtPoint(100, 100, {type: "mousemove"}); 66 synthesizeMouseAtPoint(100, 100, {type: "mouseup"}); 67 isnot(absContainer.getBoundingClientRect().x, rect.x, 68 "The absolutely positioned container should be moved along x-axis"); 69 isnot(absContainer.getBoundingClientRect().y, rect.y, 70 "The absolutely positioned container should be moved along y-axis"); 71 72 rect = absContainer.getBoundingClientRect(); 73 synthesizeMouse(absContainer, kOffsetX, kOffsetY, {type: "mousedown"}); 74 ok(absContainer.hasAttribute("_moz_abspos"), "Mousedown on the grabber should make it in drag mode again"); 75 document.execCommand("enableAbsolutePositionEditing", false, false); 76 ok(!absContainer.hasAttribute("_moz_abspos"), "Disabling the grabber makes it not in drag mode (before mouse move)"); 77 synthesizeMouseAtPoint(50, 50, {type: "mousemove"}); 78 synthesizeMouseAtPoint(50, 50, {type: "mouseup"}); 79 is(absContainer.getBoundingClientRect().x, rect.x, 80 "The absolutely positioned container shouldn't be moved along x-axis due to the UI is killed by the web app (before mouse move)"); 81 is(absContainer.getBoundingClientRect().y, rect.y, 82 "The absolutely positioned container shouldn't be moved along y-axis due to the UI is killed by the web app (before mouse move)"); 83 document.execCommand("enableAbsolutePositionEditing", false, true); 84 85 rect = absContainer.getBoundingClientRect(); 86 synthesizeMouse(absContainer, kOffsetX, kOffsetY, {type: "mousedown"}); 87 ok(absContainer.hasAttribute("_moz_abspos"), "Mousedown on the grabber should make it in drag mode again"); 88 document.execCommand("enableAbsolutePositionEditing", false, false); 89 synthesizeMouseAtPoint(50, 50, {type: "mousemove"}); 90 ok(!absContainer.hasAttribute("_moz_abspos"), "Disabling the grabber makes it not in drag mode (during mouse move)"); 91 synthesizeMouseAtPoint(50, 50, {type: "mousemove"}); 92 synthesizeMouseAtPoint(50, 50, {type: "mouseup"}); 93 is(absContainer.getBoundingClientRect().x, rect.x, 94 "The absolutely positioned container shouldn't be moved along x-axis due to the UI is killed by the web app (during mouse move)"); 95 is(absContainer.getBoundingClientRect().y, rect.y, 96 "The absolutely positioned container shouldn't be moved along y-axis due to the UI is killed by the web app (during mouse move)"); 97 } finally { 98 disableNonTestMouseEvents(false); 99 SimpleTest.finish(); 100 } 101 }); 102 </script>