diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-scrollbars/scrollbar-color-005.html')
-rw-r--r-- | testing/web-platform/tests/css/css-scrollbars/scrollbar-color-005.html | 60 |
1 files changed, 60 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-scrollbars/scrollbar-color-005.html b/testing/web-platform/tests/css/css-scrollbars/scrollbar-color-005.html new file mode 100644 index 0000000000..d8ddc43c1c --- /dev/null +++ b/testing/web-platform/tests/css/css-scrollbars/scrollbar-color-005.html @@ -0,0 +1,60 @@ +<!doctype html> +<meta charset="utf-8"> +<title>CSS Scrollbars: scrollbar-color on body correctly interacts with ::-webkit-scrollbar on scrollable area</title> +<link rel="author" title="Luke Warlow" href="mailto:luke@warlow.dev" /> +<link rel="help" href="https://drafts.csswg.org/css-scrollbars-1/#color-compat" /> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/parsing-testcommon.js"></script> +<style> + .container { + overflow: auto; + height: 200px; + width: 200px; + margin: 1px; + padding: 0px; + border: none; + background: deepskyblue; + } + + .content { + height: 300px; + width: 100%; + background: lightsalmon; + } + + body { + scrollbar-color: yellow blue; + } + + .container::-webkit-scrollbar { + display: none; + } +</style> +<script> + function performTest() { + setup({ explicit_done: true }); + + test(function () { + let container = document.getElementById('container_themed'); + let content = document.getElementById('content_themed'); + assert_less_than(container.scrollWidth, container.offsetWidth, "themed scrollWidth"); + assert_less_than(container.clientWidth, container.offsetWidth, "themed clientWidth"); + assert_equals(container.offsetLeft, content.offsetLeft, "themed offsetLeft"); + assert_equals(container.clientWidth, content.clientWidth, "themed clientWidth"); + assert_not_equals(container.offsetWidth, content.offsetWidth, "themed offsetWidth"); + }, "scrollbar-color yellow blue on body overrides ::-webkit-scrollbar on scrollable area"); + + done(); + } +</script> + +<body onload="performTest()"> + + Test scrollbar-color: vertical scrollbar + + <div class="container themed" id="container_themed"> + <div class="content" id="content_themed">themed</div> + </div> + +</body> |