| <!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> |