tor-browser

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

helper_smoothscroll_spam_interleaved.html (1869B)


      1 <!DOCTYPE HTML>
      2 <html>
      3 <head>
      4  <meta charset="utf-8">
      5  <meta name="viewport" content="width=device-width; initial-scale=1.0">
      6  <title>Test for scenario in bug 1228407 with two scrollframes</title>
      7  <script type="application/javascript" src="apz_test_native_event_utils.js"></script>
      8  <script type="application/javascript" src="apz_test_utils.js"></script>
      9  <script src="/tests/SimpleTest/paint_listener.js"></script>
     10  <script type="application/javascript">
     11 
     12 async function test() {
     13  let utils = SpecialPowers.getDOMWindowUtils(window);
     14  utils.advanceTimeAndRefresh(0);
     15 
     16  // Basically the same setup as in helper_smoothscroll_spam.html, but
     17  // with two scrollframes that get scrolled in an interleaved manner.
     18  // The original fix for bug 1228407 left this scenario unhandled, with
     19  // bug 1231177 tracking the problem. This test exercises the scenario.
     20  let s1 = document.getElementById('s1');
     21  let s2 = document.getElementById('s2');
     22  for (let i = 0; i < 100; i++) {
     23    s1.scrollBy({top:60, behavior: "smooth"});
     24    s2.scrollBy({top:60, behavior: "smooth"});
     25    await promiseOnlyApzControllerFlushed();
     26    utils.advanceTimeAndRefresh(16);
     27  }
     28 
     29  utils.restoreNormalRefresh();
     30  await promiseOnlyApzControllerFlushed();
     31 
     32  let s1pos = s1.scrollTop;
     33  let s2pos = s2.scrollTop;
     34  ok(s1pos > 60, `s1 scrolled ${s1pos}px, should be more than 60`);
     35  ok(s2pos > 60, `s2 scrolled ${s2pos}px, should be more than 60`);
     36 }
     37 
     38 waitUntilApzStable().then(test).then(subtestDone, subtestFailed);
     39 
     40  </script>
     41  <style>
     42    .scrollable {
     43      overflow: scroll;
     44      height: 300px;
     45    }
     46 
     47    .content {
     48      height: 1000px;
     49      background-image: linear-gradient(green, blue);
     50    }
     51  </style>
     52 </head>
     53 <body>
     54 <div id="s1" class="scrollable"><div class="content"></div></div>
     55 <div id="s2" class="scrollable"><div class="content"></div></div>
     56 </body>
     57 </html>