viewport-dimensions-exclude-custom-scrollbars.html

<!DOCTYPE html>
<style>
  body {
    height: 2000px;
    width: 2000px;
  }
  ::-webkit-scrollbar {
    width: 20px;
    height: 20px;
  } /* this targets the default scrollbar (compulsory) */

  ::-webkit-scrollbar-track {
        background-color: #b46868;
  } /* the new scrollbar will have a flat appearance with the set background color */

  ::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0.2);
  } /* this will style the thumb, ignoring the track */
</style>

<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script>
  var browserZoomFactor = 1.25;
  var pageScaleFactor = 2;
  var scrollbarWidthCSSPixels = 20 / pageScaleFactor;
  var scrollbaHeightCSSPixels = 20 / pageScaleFactor;

  function viewport() {
    return window.visualViewport;
  }

  async_test(function(t) {
    window.onload = t.step_func(function() {
      // TODO(ymalik): Remove hook to internals to pinch-zoom here and browser
      // zoom below. This will be required to upstream to w3c repo.
      internals.setPageScaleFactor(pageScaleFactor);

      // Verify viewport dimensions exclude scrollbar.
      assert_equals(
          viewport().width,
          800 / pageScaleFactor - scrollbarWidthCSSPixels,
          "Width with pinch-zoom");
      assert_equals(
          viewport().height, 600 / pageScaleFactor - scrollbaHeightCSSPixels,
          "Height with pinch-zoom");

      // Apply browser zoom.
      if (window.testRunner)
        testRunner.setPageZoomFactor(browserZoomFactor);

      // Verify scrollbar exclusion with browser zoom. Custom scrollbars are
      // scaled with browser zoom but remain unchanged with pinch zoom.
      assert_equals(
          viewport().width,
          800 / browserZoomFactor / pageScaleFactor - scrollbarWidthCSSPixels,
          "Width with pinch-zoom and browser-zoom");
      assert_equals(
          viewport().height,
          600 / browserZoomFactor / pageScaleFactor - scrollbaHeightCSSPixels,
          "Height with pinch-zoom and browser-zoom");
      t.done();
    });
  }, 'Verify viewport dimensions exclude custom scrollbars.');
</script>
chromium/third_party/blink/web_tests/fast/dom/viewport/viewport-dimensions-exclude-custom-scrollbars.html
