blob: c0008d690b391a98e91385f37378108462d1b3c1 [file] [log] [blame]
<!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>