tor-browser

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

zero-scroll-offset-002.html (1991B)

      1 <!DOCTYPE html>
      2 <head>
      3  <title>Test that scroll anchoring is suppressed when scroll offset is zero in the block axis, even if the inline axis scroll offset isn't.</title>
      4  <link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@mozilla.com">
      5  <link rel="author" title="Mozilla" href="https://mozilla.org">
      6  <link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring/">
      7  <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1905426">
      8  <script src="/resources/testharness.js"></script>
      9  <script src="/resources/testharnessreport.js"></script>
     10 </head>
     11 <style>
     12 #header {
     13  height: 100px;
     14  border: 1px solid black;
     15  overflow-anchor: none;
     16 }
     17 #content {
     18  height: 200vh;
     19  width: 200vw;
     20 }
     21 </style>
     22 <div id="header"></div>
     23 <div id="content">abc</div>
     24 <script>
     25 window.addEventListener("scroll", function() {
     26  if (document.scrollingElement.scrollTop > 0) {
     27    // On the first scroll event, shrink the header. Scroll anchoring anchors to
     28    // content, but the header shrinks by more than the scroll offset so the
     29    // resulting scroll position is zero.
     30    step_timeout(function() {
     31      document.querySelector("#header").style.height = "50px";
     32    }, 0);
     33  } else {
     34    // On the second scroll event, grow the header. Since the scroll offset is
     35    // zero, scroll anchoring should be suppressed. Otherwise, scroll anchoring
     36    // would anchor to content and the resulting scroll position would be 50px.
     37    step_timeout(function() {
     38      document.querySelector("#header").style.height = "100px";
     39    }, 0);
     40  }
     41 });
     42 
     43 async_test(function(t) {
     44  // Scroll down a bit to trigger the scroll event listener.
     45  window.scrollTo(10, 10);
     46 
     47  window.requestAnimationFrame(function() {
     48    window.requestAnimationFrame(function() {
     49      window.requestAnimationFrame(t.step_func_done(() => {
     50          assert_equals(document.scrollingElement.scrollTop, 0);
     51      }));
     52    });
     53  });
     54 
     55 }, "Scroll anchoring suppressed when scroll offset is zero.");
     56 </script>