wpt / css / css-overflow / incremental-scroll-002.html

Status: PASS | Duration: 5ms | Subtests: 1/1 | Open test on wpt.live | Open ref on wpt.live | wpt.fyi

/css/css-overflow/incremental-scroll-002.html

<!DOCTYPE html>
<html class="reftest-wait">
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scroll-container">
<link rel="match" href="incremental-scroll-002-ref.html">
<script src="/common/reftest-wait.js"></script>
<script src="/common/rendering-utils.js"></script>
<style>
div div { height: 15px; font-size: 10px; }
</style>
<div id="target" style="background: white; overflow: scroll; width: 500px; height: 500px">
</div>
<script>
for (var i = 0; i < 400; i++) {
  var div = document.createElement("div");
  div.textContent = i;
  target.appendChild(div);
}

function scroll() {
  var lastScrollTop = target.scrollTop;
  target.scrollTop += 300;
  if (target.scrollTop > lastScrollTop) {
    waitForAtLeastOneFrame().then(scroll);
  } else {
    takeScreenshot();
  }
}

waitForAtLeastOneFrame().then(scroll);
</script>

/css/css-overflow/incremental-scroll-002-ref.html

<!DOCTYPE html>
<style>
div div { height: 15px; font-size: 10px; }
</style>
<div id="target" style="background: white; overflow: scroll; width: 500px; height: 500px">
</div>
<script>
for (var i = 0; i < 400; i++) {
  var div = document.createElement("div");
  div.textContent = i;
  target.appendChild(div);
}
target.scrollTop = 6000;
</script>