tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

scrollend-event-fired-after-sequence-of-scrolls.tentative.html (3152B)


      1 <!DOCTYPE HTML>
      2 <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1">
      3 <script src="/resources/testharness.js"></script>
      4 <script src="/resources/testharnessreport.js"></script>
      5 <script src="/resources/testdriver.js"></script>
      6 <script src="/resources/testdriver-actions.js"></script>
      7 <script src="/resources/testdriver-vendor.js"></script>
      8 <script src="scroll_support.js"></script>
      9 <style>
     10 #targetDiv {
     11  width: 200px;
     12  height: 200px;
     13  overflow: scroll;
     14 }
     15 
     16 #innerDiv {
     17  width: 4000px;
     18  height: 4000px;
     19 }
     20 </style>
     21 
     22 <body style="margin:0" onload=runTest()>
     23 <div id="targetDiv">
     24  <div id="innerDiv">
     25  </div>
     26 </div>
     27 </body>
     28 
     29 <script>
     30 const target_div = document.getElementById('targetDiv');
     31 
     32 async function testWithMovePath(t, move_path) {
     33  // Skip the test on a Mac as they do not support touch screens.
     34  const isMac = navigator.platform.toUpperCase().indexOf('MAC')>=0;
     35  if (isMac)
     36    return;
     37 
     38  await resetTargetScrollState(t, target_div);
     39  await waitForCompositorReady();
     40 
     41  verifyNoScrollendOnDocument(t);
     42 
     43  let scrollend_count = 0;
     44  const scrollend_listener = () => { scrollend_count += 1; };
     45  target_div.addEventListener("scrollend", scrollend_listener);
     46  t.add_cleanup(() => { target_div.removeEventListener('scrollend', scrollend_listener); });
     47 
     48  const pointercancel_listener = () => {
     49    assert_equals(scrollend_count, 0, 'scrollend should happen after pointercancel.');
     50  };
     51  target_div.addEventListener("pointercancel", pointercancel_listener);
     52  t.add_cleanup(() => { target_div.removeEventListener('pointercancel', pointercancel_listener); });
     53 
     54  // Because we have several pointer moves, we choose bigger timeout.
     55  const timeoutMs = 3000;
     56  const targetPointercancelPromise = waitForPointercancelEvent(t, target_div, timeoutMs);
     57  const targetScrollendPromise = createScrollendPromiseForTarget(t, target_div, timeoutMs);
     58 
     59  await touchScrollInTargetSequentiallyWithPause(target_div, move_path);
     60 
     61  // Because we start scrolling after pointerdown, there is no pointerup, instead the target
     62  // will receive a pointercancel, so we wait for pointercancel, and then continue.
     63  await targetPointercancelPromise;
     64  await targetScrollendPromise;
     65  await verifyScrollStopped(t, target_div);
     66  assert_equals(scrollend_count, 1, 'Only one scrollend event should be fired');
     67 }
     68 
     69 function runTest() {
     70  promise_test (async (t) => {
     71    // Scroll down & up & down on target div and wait for the target_div to get scrollend event.
     72    const move_path = [
     73      { x: 0, y: -80 }, // Scroll down
     74      { x: 0, y: -40 }, // Scroll up
     75      { x: 0, y: -80 }, // Scroll down
     76    ];
     77    await testWithMovePath(t, move_path);
     78  }, "Move down, up and down again, receive scrollend event only once");
     79 
     80  promise_test (async (t) => {
     81    // Scroll right & left & right on target div and wait for the target_div to get scrollend event.
     82    const move_path = [
     83      { x: -80, y: 0 }, // Scroll right
     84      { x: -40, y: 0 }, // Scroll left
     85      { x: -80, y: 0 }, // Scroll right
     86    ];
     87    await testWithMovePath(t, move_path);
     88  }, "Move right, left and right again, receive scrollend event only once");
     89 
     90 }
     91 </script>