| <!DOCTYPE html> |
| |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| |
| <!-- The linked stylesheet must not be in the same directory as this test file. --> |
| <!-- This is intended to test that relative URLs in stylesheets remain relative --> |
| <!-- to the stylesheet's directory rather than the page that uses it. --> |
| <link href="../resources/image-url-var.css" rel="stylesheet"> |
| |
| <div id="target"></div> |
| |
| <script> |
| for (var property of ['background', 'background-image']) { |
| for (var value of ['image-set', 'url']) { |
| test(() => { |
| target.classList.remove(...target.classList); |
| assert_equals(target.classList.length, 0); |
| var initial = getComputedStyle(target)[property]; |
| |
| target.classList.add(property); |
| target.classList.add(value); |
| target.classList.add('var'); |
| var actual = getComputedStyle(target)[property]; |
| |
| target.classList.remove('var'); |
| target.classList.add('inline'); |
| var expected = getComputedStyle(target)[property]; |
| assert_not_equals(expected, initial); |
| |
| assert_equals(actual, expected); |
| }, property + ' should resolve ' + value + ' the same whether via var() or not.'); |
| } |
| } |
| </script> |