tor-browser

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

scrollend-event-fired-for-scroll-attr-change.html (4259B)

      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="/common/subset-tests-by-key.js"></script>
      9 <meta name="variant" content="?include=subframe-scrollTop-smooth"/>
     10 <meta name="variant" content="?include=subframe-scrollLeft-smooth"/>
     11 <meta name="variant" content="?include=root-scrollTop-smooth"/>
     12 <meta name="variant" content="?include=root-scrollLeft-smooth"/>
     13 <meta name="variant" content="?include=subframe-scrollTop-auto"/>
     14 <meta name="variant" content="?include=subframe-scrollLeft-auto"/>
     15 <meta name="variant" content="?include=root-scrollTop-auto"/>
     16 <meta name="variant" content="?include=root-scrollLeft-auto"/>
     17 <script src="scroll_support.js"></script>
     18 <style>
     19 html {
     20  height: 3000px;
     21  width: 3000px;
     22 }
     23 #targetDiv {
     24  width: 200px;
     25  height: 200px;
     26  overflow: scroll;
     27 }
     28 
     29 #innerDiv {
     30  width: 400px;
     31  height: 400px;
     32 }
     33 </style>
     34 
     35 <body style="margin:0" onload=runTest()>
     36 <div id="targetDiv">
     37  <div id="innerDiv">
     38  </div>
     39 </div>
     40 </body>
     41 <script>
     42 let invalid_scrollend_arrived = false;
     43 
     44 function onInvalidScrollEnd(event) {
     45  invalid_scrollend_arrived = true;
     46 }
     47 
     48 let scroll_attr_change_variants = [
     49  {
     50    key: "subframe-scrollTop-smooth",
     51    target: targetDiv,
     52    behavior: "smooth",
     53    attribute: "scrollTop",
     54    title: "Tests scrollend event for [scrollTop] behavior:'smooth' on subframe."
     55  },
     56  {
     57    key: "subframe-scrollLeft-smooth",
     58    target: targetDiv,
     59    behavior: "smooth",
     60    attribute: "scrollLeft",
     61    title: "Tests scrollend event for [scrollLeft] behavior:'smooth' on subframe."
     62  },
     63  {
     64    key: "root-scrollTop-smooth",
     65    target: document.scrollingElement,
     66    behavior: "smooth",
     67    attribute: "scrollTop",
     68    title: "Tests scrollend event for [scrollTop] behavior:'smooth' on root."
     69  },
     70  {
     71    key: "root-scrollLeft-smooth",
     72    target: document.scrollingElement,
     73    behavior: "smooth",
     74    attribute: "scrollLeft",
     75    title: "Tests scrollend event for [scrollLeft] behavior:'smooth' on root."
     76  },
     77  {
     78    key: "subframe-scrollTop-auto",
     79    target: targetDiv,
     80    behavior: "auto",
     81    attribute: "scrollTop",
     82    title: "Tests scrollend event for [scrollTop] behavior:'auto' on subframe."
     83  },
     84  {
     85    key: "subframe-scrollLeft-auto",
     86    target: targetDiv,
     87    behavior: "auto",
     88    attribute: "scrollLeft",
     89    title: "Tests scrollend event for [scrollLeft] behavior:'auto' on subframe."
     90  },
     91  {
     92    key: "root-scrollTop-auto",
     93    target: document.scrollingElement,
     94    behavior: "auto",
     95    attribute: "scrollTop",
     96    title: "Tests scrollend event for [scrollTop] behavior:'auto' on root."
     97  },
     98  {
     99    key: "root-scrollLeft-auto",
    100    target: document.scrollingElement,
    101    behavior: "auto",
    102    attribute: "scrollLeft",
    103    title: "Tests scrollend event for [scrollLeft] behavior:'auto' on root."
    104  },
    105 ];
    106 
    107 function runTest() {
    108 
    109  async function testScrollAttrChange(testInfo, t) {
    110    testInfo.target.style.scrollBehavior = testInfo.behavior;
    111 
    112    await waitForCompositorCommit();
    113 
    114    let scrollendPromise = null;
    115    const TIMEOUT = 2000;
    116    if (testInfo.target == document.scrollingElement) {
    117      targetDiv.addEventListener("scrollend", onInvalidScrollEnd);
    118      scrollendPromise = createScrollendPromiseForTarget(t, document, TIMEOUT, true);
    119    } else {
    120      document.addEventListener("scrollend", onInvalidScrollEnd);
    121      scrollendPromise = createScrollendPromiseForTarget(t, targetDiv, TIMEOUT, false);
    122    }
    123 
    124    testInfo.target[testInfo.attribute] = 200;
    125 
    126    await scrollendPromise;
    127    assert_false(invalid_scrollend_arrived, "Scrollend should not fire to target that has not scrolled");
    128 
    129    assert_equals(testInfo.target[testInfo.attribute], 200,
    130                  testInfo.target.tagName + "." + testInfo.attribute + " " + testInfo.behavior);
    131  }
    132 
    133  scroll_attr_change_variants.forEach((testInfo) => {
    134    subsetTestByKey(testInfo.key, promise_test,
    135                    async (t) => testScrollAttrChange(testInfo, t), testInfo.title);
    136  })
    137 }
    138 </script>