movementX_Y_no-jumps-manual.html (5859B)
1 <!DOCTYPE html> 2 <html> 3 <body> 4 <meta name="timeout" content="long"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <meta name='flags' content='interact'> 8 <style type="text/css"> 9 #status-log { 10 margin: 10px 0; 11 color: green; 12 color: green; 13 } 14 </style> 15 </head> 16 <body> 17 <h2>Description</h2> 18 <p>This test that movementX/Y do not jump by a large value when exiting and re-entering the window.</p> 19 <hr/> 20 21 <h2>Manual Test Steps:</h2> 22 <p> 23 <ol> 24 <li>Make sure the window is not maximized.</li> 25 <li>Click to start Test.</li> 26 <li>Move the mouse slowly out of the window. 27 <li>Move as fast as needed to a different location outside the window at least 100 pixels away</li> 28 <li>Slowly re-enter the window.</li> 29 <li>Click again to end tests.</li> 30 </ol> 31 </p> 32 <hr/> 33 34 <div id="status-log">Waiting... Click to start loging.</div> 35 <div class="data-log"> 36 <table> 37 <tr><td></td><td>X</td><td>Y</td></tr> 38 <tr><td>client_init:</td><td id="clientX_init-log">X</td><td id="clientY_init-log">Y</td></tr> 39 <tr><td>client_last:</td><td id="clientX_last-log">X</td><td id="clientY_last-log">Y</td></tr> 40 <tr><td>client_delta:</td><td id="clientX_delta-log">X</td><td id="clientY_delta-log">Y</td></tr> 41 <tr><td>movement_sum:</td><td id="movementX_sum-log">X</td><td id="movementY_sum-log">Y</td></tr> 42 <tr><td>movement:</td><td id="movementX-log">X</td><td id="movementY-log">Y</td></tr> 43 </table> 44 </div> 45 <hr/> 46 47 <div id="log"></div> 48 49 <script type="text/javascript" > 50 var status_log = document.querySelector('#status-log'), 51 movementX_log = document.querySelector('#movementX-log'), 52 movementY_log = document.querySelector('#movementY-log'), 53 movementX_sum_log = document.querySelector('#movementX_sum-log'), 54 movementY_sum_log = document.querySelector('#movementY_sum-log'), 55 clientX_init_log = document.querySelector('#clientX_init-log'), 56 clientY_init_log = document.querySelector('#clientY_init-log'), 57 clientX_last_log = document.querySelector('#clientX_last-log'), 58 clientY_last_log = document.querySelector('#clientY_last-log'); 59 clientX_delta_log = document.querySelector('#clientX_delta-log'), 60 clientY_delta_log = document.querySelector('#clientY_delta-log'); 61 62 var click_counter = 0; 63 64 var clientX_init, clientY_init, movementX, movementY, movementX_sum, movementY_sum, clientX_last, clientY_last; 65 66 var movementX_Y_outside_window_Test = async_test("Test that movementX/Y do not have large values when re-entering from outside the window."); 67 68 document.addEventListener("click", function (e) { 69 click_counter++; 70 71 switch(click_counter) { 72 case 1: 73 status_log.innerHTML = "logging..."; 74 break; 75 case 2: 76 status_log.innerHTML = "done"; 77 78 // approximately(+/- 10) 79 // a little drift should be tollerated 80 movementX_Y_outside_window_Test.step(function() { 81 assert_equals(movementX_sum, clientX_last - clientX_init, "sum of movementX = clientX_init - clientX_last"); 82 assert_equals(movementY_sum, clientY_last - clientY_init, "sum of movementY = clientY_init - clientY_last"); 83 }); 84 movementX_Y_outside_window_Test.done(); 85 break; 86 } 87 }); 88 89 document.addEventListener("mousemove", function (e) { 90 movementX = e.movementX; 91 movementY = e.movementY; 92 93 if(click_counter === 1) { 94 if(!clientX_init) { 95 clientX_init = e.clientX; 96 clientY_init = e.clientY; 97 movementX_sum = movementX; 98 movementY_sum = movementY; 99 } 100 101 movementX_Y_outside_window_Test.step(function() { 102 assert_less_than(Math.abs(movementX), 50, "movementX should not have large jumps in value."); 103 assert_less_than(Math.abs(movementY), 50, "movementY should not have large jumps in value."); 104 }); 105 106 movementX_sum += movementX; 107 movementY_sum += movementY; 108 109 clientX_last = e.clientX; 110 clientY_last = e.clientY; 111 clientX_delta = clientX_last - clientX_init; 112 clientY_delta = clientY_last - clientY_init; 113 114 updateData(); 115 } 116 }); 117 118 document.addEventListener("mouseenter", function (e) { 119 if(click_counter === 1) { 120 movementX_Y_outside_window_Test.step(function() { 121 assert_greater_than(Math.abs(e.clientX-clientX_last) + Math.abs(e.clientY-clientY_last), 100, "Test requires mouse to be moved at least 100 pixels outside of window."); 122 }); 123 } 124 }); 125 126 function updateData() { 127 clientX_init_log.innerHTML = clientX_init; 128 clientY_init_log.innerHTML = clientY_init; 129 clientX_last_log.innerHTML = clientX_last; 130 clientY_last_log.innerHTML = clientY_last; 131 clientX_delta_log.innerHTML = clientX_delta; 132 clientY_delta_log.innerHTML = clientY_delta; 133 movementX_log.innerHTML = movementX; 134 movementY_log.innerHTML = movementY; 135 movementX_sum_log.innerHTML = movementX_sum; 136 movementY_sum_log.innerHTML = movementY_sum; 137 } 138 </script> 139 </body> 140 </html>