<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<div id="target"></div>
<script>
var testCases = [
['-webkit-box-reflect', 'below 0px url("chrome:") 0 fill / auto / 0px stretch'],
['-webkit-mask-box-image-source', 'url("chrome:")'],
['-webkit-mask-image', 'url("chrome:")'],
['background-image', 'url("chrome:")'],
['border-image-source', 'url("chrome:")'],
['list-style-image', 'url("chrome:")'],
['shape-outside', 'url("chrome:")'],
];
test(() => {
for (const [property, value] of testCases) {
target.style[property] = value;
}
var computedStyle = getComputedStyle(target);
for (const [property, value] of testCases) {
assert_equals(computedStyle[property], value, property);
}
// Force a second style recalc so that the image gets cached and reused.
target.style.left = '0px'; // Force style recalc.
for (const [property, value] of testCases) {
assert_equals(computedStyle[property], value, property);
}
}, 'Invalid URL protocols should serialise as their original URL strings after multiple recalcs');
</script>