blob: 7509dd04b23cd5f869c5cc27814b9b50d0e25cc0 [file] [log] [blame]
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#color-scheme-prop">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
#dark { color-scheme: dark }
#light { color-scheme: light }
.canvas { color: CanvasText; background-color: Canvas; }
</style>
<div id="dark" class="canvas"></div>
<div id="light" class="canvas"></div>
<script>
test(() => {
assert_not_equals(getComputedStyle(light).color, getComputedStyle(dark).color);
assert_not_equals(getComputedStyle(light).backgroundColor, getComputedStyle(dark).backgroundColor);
}, "Check that the system colors are properly affected by the color-scheme.");
</script>