getComputedStyle-overscrollBehavior-serialization.html

<!DOCTYPE html>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<!-- https://wicg.github.io/overscroll-behavior/#overscroll-behavior-properties -->

<style>
  #container {
    overscroll-behavior-x: none;
    overscroll-behavior-y: contain;
  }
  #child {
    overscroll-behavior: inherit;
  }
</style>
<div id="container">
  <div id="child"></div>
</div>
<div id="target"></div>

<script>
'use strict';

test(function() {
  assert_equals(getComputedStyle(document.body).overscrollBehavior, 'auto');
  assert_equals(getComputedStyle(container).overscrollBehavior, 'none contain');
  assert_equals(getComputedStyle(child).overscrollBehavior, 'none contain');
}, "Test that getComputedStyle serializes overscroll-behavior-x and overscroll-behavior-y");

var values = [
  // single keyword
  {input: 'contain', expected: 'contain'},
  {input: 'none', expected: 'none'},
  {input: 'auto', expected: 'auto'},

  // two keywords
  {input: 'contain none', expected: 'contain none'},
  {input: 'none auto', expected: 'none auto'},
  {input: 'auto contain', expected: 'auto contain'},
];

test(function() {
  for (var value of values) {
    target.style.overscrollBehavior = value.input;
    assert_equals(getComputedStyle(target).overscrollBehavior, value.expected);
  }
}, "Test that getComputedStyle serializes overscrollBehavior as per the spec");
</script>

chromium/third_party/blink/web_tests/fast/css/getComputedStyle/getComputedStyle-overscrollBehavior-serialization.html