tor-browser

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

helper_scroll_linked_effect_detector.html (3724B)

      1 <!DOCTYPE html>
      2 <html>
      3 <meta charset="utf-8">
      4 <script src="/tests/SimpleTest/paint_listener.js"></script>
      5 <script src="apz_test_utils.js"></script>
      6 <script src="apz_test_native_event_utils.js"></script>
      7 <title>ScrollLinkedEffectDetector tests</title>
      8 <style>
      9 html, body { margin: 0; }
     10 body {
     11  height: 1000vh;
     12 }
     13 #target {
     14  position: absolute;
     15  height: 800px;
     16  background-color: #cc00cc;
     17  top: 0;
     18  left: 0;
     19  right: 0;
     20 }
     21 </style>
     22 <div id="target"></div>
     23 <script>
     24 async function test() {
     25  let eventTimeStamp;
     26  // Utility function to synthesize a scroll and call the given function
     27  // in the event listener.
     28  async function promiseScrollAndEvent(fn) {
     29    let scrollEventPromise = new Promise(resolve => {
     30      window.addEventListener("scroll", () => {
     31        fn();
     32        resolve();
     33      }, { once: true });
     34    });
     35    await scrollEventPromise;
     36    // Wait a rAF to make sure we are outside of the micro tasks for the scroll
     37    // event callback so that we can ensure our stack based
     38    // ScrollLinkedEffectDetector has been scoped out from the function firing
     39    // scroll events.
     40    await promiseFrame();
     41  }
     42 
     43  let intervalId = setInterval(async () => {
     44    await synthesizeNativeWheel(window, 50, 50, 0, -10);
     45  }, 0);
     46  await promiseScrollAndEvent(() => {
     47    eventTimeStamp = document.timeline.currentTime;
     48  });
     49  is(eventTimeStamp, document.timeline.currentTime,
     50     `We are in same time frame where we got a scroll event at ${eventTimeStamp}`);
     51  ok(!SpecialPowers.DOMWindowUtils.hasScrollLinkedEffect,
     52     "No scroll-linked effect found yet");
     53 
     54  // Setup a scroll-linked effect callback.
     55  await promiseScrollAndEvent(() => {
     56    isnot(window.scrollY, 0, "we've already scrolled some amount");
     57    target.style.top = window.scrollY + "px";
     58    eventTimeStamp = document.timeline.currentTime;
     59  });
     60  is(eventTimeStamp, document.timeline.currentTime,
     61     `We are in same time frame where we got a scroll event at ${eventTimeStamp}`);
     62  ok(SpecialPowers.DOMWindowUtils.hasScrollLinkedEffect,
     63     "Scroll-linked effect found");
     64 
     65  // A no-op again.
     66  await promiseScrollAndEvent(() => {
     67    eventTimeStamp = document.timeline.currentTime;
     68  });
     69  is(eventTimeStamp, document.timeline.currentTime,
     70     `We are in same time frame where we got a scroll event at ${eventTimeStamp}`);
     71  ok(!SpecialPowers.DOMWindowUtils.hasScrollLinkedEffect,
     72     "No scroll-linked effect found");
     73 
     74  // Setup a non-effective scroll-linked effect callback.
     75  await promiseScrollAndEvent(() => {
     76    target.style.top = getComputedStyle(target).top;
     77    eventTimeStamp = document.timeline.currentTime;
     78  });
     79  is(eventTimeStamp, document.timeline.currentTime,
     80     `We are in same time frame where we got a scroll event at ${eventTimeStamp}`);
     81  ok(!SpecialPowers.DOMWindowUtils.hasScrollLinkedEffect,
     82     "No scroll-linked effect found");
     83 
     84  // Setup a callback to remove the style.
     85  await promiseScrollAndEvent(() => {
     86    target.style.top = "";
     87    eventTimeStamp = document.timeline.currentTime;
     88  });
     89  is(eventTimeStamp, document.timeline.currentTime,
     90     `We are in same time frame where we got a scroll event at ${eventTimeStamp}`);
     91  ok(SpecialPowers.DOMWindowUtils.hasScrollLinkedEffect,
     92     "Scroll-linked effect found");
     93 
     94  // Setup a no-op callback.
     95  await promiseScrollAndEvent(() => {
     96    eventTimeStamp = document.timeline.currentTime;
     97  });
     98  is(eventTimeStamp, document.timeline.currentTime,
     99     `We are in same time frame where we got a scroll event at ${eventTimeStamp}`);
    100  ok(!SpecialPowers.DOMWindowUtils.hasScrollLinkedEffect,
    101     "No scroll-linked effect found this time");
    102  clearInterval(intervalId);
    103 }
    104 
    105 waitUntilApzStable()
    106 .then(test)
    107 .then(subtestDone, subtestFailed);
    108 </script>