diff options
Diffstat (limited to 'tests/wpt/tests/css/css-values')
39 files changed, 1053 insertions, 261 deletions
diff --git a/tests/wpt/tests/css/css-values/acos-asin-atan-atan2-computed.html b/tests/wpt/tests/css/css-values/acos-asin-atan-atan2-computed.html index 76033289a2c..cacee588f3c 100644 --- a/tests/wpt/tests/css/css-values/acos-asin-atan-atan2-computed.html +++ b/tests/wpt/tests/css/css-values/acos-asin-atan-atan2-computed.html @@ -39,6 +39,11 @@ test_math_used('calc(atan2(0,-1) / 4)', '45deg', {type:'angle', approx:0.1}); // test_math_used('calc(atan2(1,-1))', '135deg', {type:'angle', approx:0.1}); test_math_used('calc(atan2(-1,1))', '-45deg', {type:'angle', approx:0.1}); +// Test unresolved at parse time +test_math_used('calc(asin(sin(180deg * sibling-index())))', '0deg', {type:'angle', approx:0.1}); +test_math_used('calc(acos(cos(180deg * sibling-index())))', '180deg', {type:'angle', approx:0.1}); +test_math_used('calc(atan(tan(180deg * sibling-index())))', '0deg', {type:'angle', approx:0.1}); + // Test nesting test_math_used('calc(cos(sin(acos(cos(pi)))))', '1', {type:'number', approx:0.1}); diff --git a/tests/wpt/tests/css/css-values/calc-size/animation/calc-size-interpolation-expansion.html b/tests/wpt/tests/css/css-values/calc-size/animation/calc-size-interpolation-expansion.html index 354d108f1da..c3de4d7ab9e 100644 --- a/tests/wpt/tests/css/css-values/calc-size/animation/calc-size-interpolation-expansion.html +++ b/tests/wpt/tests/css/css-values/calc-size/animation/calc-size-interpolation-expansion.html @@ -32,8 +32,6 @@ * not fully specified. Once we have multiple implementations that * implement all of the necessary features for this test, we should * probably look at improving that interoperability. - * - * TODO: The sorting of the nodes in a multiplication seems wrong. */ var TESTS = [ @@ -42,23 +40,23 @@ var TESTS = [ start: "auto", end: "calc-size(any, 0px)", expected: { - 0.75: "calc-size(auto, 0px + size * 0.25)", + 0.75: "calc-size(auto, 0px + 0.25 * size)", }, }, { property: "height", start: "0px", - end: "calc-size(calc-size(min-content, size + 20px), size * 2)", + end: "calc-size(calc-size(min-content, size + 20px), 2 * size)", expected: { - 0.75: "calc-size(calc-size(min-content, 20px + size), 0px + size * 2 * 0.75)", + 0.75: "calc-size(calc-size(min-content, 20px + size), 0px + 0.75 * 2 * size)", }, }, { property: "height", start: "calc-size(min-content, size * 4)", - end: "calc-size(calc-size(min-content, size + 20px), size * 2)", + end: "calc-size(calc-size(min-content, size + 20px), 2 * size)", expected: { - 0.75: "calc-size(min-content, size * 4 * 0.25 + (20px + size) * 2 * 0.75)", + 0.75: "calc-size(min-content, 0.25 * 4 * size + 0.75 * 2 * (20px + size))", }, }, { @@ -89,32 +87,32 @@ var TESTS = [ { property: "width", start: "calc-size(fit-content, 20px)", - end: "calc-size(calc-size(fit-content, 3 * size + 10px), min(size + 20px, size * 2 - 30px) + size * 2 + 80px)", + end: "calc-size(calc-size(fit-content, 3 * size + 10px), min(size + 20px, 2 * size - 30px) + 2 * size + 80px)", expected: { - 0.75: "calc-size(fit-content, 5px + min(30px + 3 * size, 30px + 2 * 0.75 * (3 * size + 10px)) + (10px + 3 * size) * 2 * 0.75)", - 0.75: "calc-size(fit-content, 5px + (80px + min(10px + 20px + size * 3, -30px + (10px + size * 3) * 2) + (10px + size * 3) * 2) * 0.75)", + 0.75: "calc-size(fit-content, 5px + min(30px + 3 * size, 30px + 2 * 0.75 * (3 * size + 10px)) + 0.75 * 2 * (10px + 3 * size))", + 0.75: "calc-size(fit-content, 5px + 0.75 * (80px + min(10px + 20px + 3 * size, -30px + 2 * (10px + 3 * size)) + 2 * (10px + 3 * size)))", }, }, { property: "width", start: "calc-size(50%, size)", - end: "calc-size(calc-size(45%, (size * 2)), size + 20px)", + end: "calc-size(calc-size(45%, (2 * size)), size + 20px)", expected: { - 0.75: "calc-size(100%, size * 0.5 * 0.25 + (20px + size * 0.45 * 2) * 0.75)", + 0.75: "calc-size(100%, 0.25 * 0.5 * size + 0.75 * (20px + 0.45 * 2 * size))", }, }, { property: "width", start: "calc-size(40%, size)", - end: "calc-size(calc-size(10px, (size * 2)), size + 20px)", + end: "calc-size(calc-size(10px, (2 * size)), size + 20px)", expected: { - 0.75: "calc-size(100%, 30px + size * 0.4 * 0.25)", + 0.75: "calc-size(100%, 30px + 0.25 * 0.4 * size)", }, }, { property: "width", start: "calc-size(80px, size)", - end: "calc-size(calc-size(10px, (size * 2)), size + 20px)", + end: "calc-size(calc-size(10px, (2 * size)), size + 20px)", expected: { 0.75: "calc-size(any, 50px)", }, diff --git a/tests/wpt/tests/css/css-values/calc-size/calc-size-parsing.html b/tests/wpt/tests/css/css-values/calc-size/calc-size-parsing.html index 6db2635e5ef..3d63f0dbe00 100644 --- a/tests/wpt/tests/css/css-values/calc-size/calc-size-parsing.html +++ b/tests/wpt/tests/css/css-values/calc-size/calc-size-parsing.html @@ -35,10 +35,10 @@ test_valid_value("min-block-size", "calc-size(max-content, size)"); test_valid_value("min-inline-size", "calc-size(max-content, size)"); test_valid_value("width", "calc-size(fit-content, size)"); -test_valid_value("height", "calc-size(min-content, size * 2)"); -test_valid_value("max-width", "calc-size(max-content, size / 2)"); -test_valid_value("max-height", "calc-size(fit-content, 30px + size / 2)"); -test_valid_value("width", "calc-size(fit-content, 50% + size / 2)"); +test_valid_value("height", "calc-size(min-content, size * 2)", "calc-size(min-content, 2 * size)"); +test_valid_value("max-width", "calc-size(max-content, size / 2)", "calc-size(max-content, 0.5 * size)"); +test_valid_value("max-height", "calc-size(fit-content, 30px + size / 2)", "calc-size(fit-content, 30px + 0.5 * size)"); +test_valid_value("width", "calc-size(fit-content, 50% + size / 2)", "calc-size(fit-content, 50% + 0.5 * size)"); test_valid_value("width", "calc-size(any, 25em)"); test_valid_value("width", "calc-size(any, 40%)"); diff --git a/tests/wpt/tests/css/css-values/calc-size/calc-size-typed-om.html b/tests/wpt/tests/css/css-values/calc-size/calc-size-typed-om.html index 8f9600e26a9..37400823f9d 100644 --- a/tests/wpt/tests/css/css-values/calc-size/calc-size-typed-om.html +++ b/tests/wpt/tests/css/css-values/calc-size/calc-size-typed-om.html @@ -25,10 +25,10 @@ function test_typed_om_string(property, value, expected) { test_typed_om_string("width", "calc-size(auto, size)"); test_typed_om_string("width", "calc-size(fit-content, size)"); -test_typed_om_string("height", "calc-size(min-content, size * 2)"); -test_typed_om_string("max-width", "calc-size(max-content, size / 2)", "calc-size(max-content, size * 0.5)"); -test_typed_om_string("max-height", "calc-size(fit-content, 30px + size / 2)", "calc-size(fit-content, 30px + size * 0.5)"); -test_typed_om_string("width", "calc-size(fit-content, 50% + size / 2)", "calc-size(fit-content, 50% + size * 0.5)"); +test_typed_om_string("height", "calc-size(min-content, size * 2)", "calc-size(min-content, 2 * size)"); +test_typed_om_string("max-width", "calc-size(max-content, size / 2)", "calc-size(max-content, 0.5 * size)"); +test_typed_om_string("max-height", "calc-size(fit-content, 30px + size / 2)", "calc-size(fit-content, 30px + 0.5 * size)"); +test_typed_om_string("width", "calc-size(fit-content, 50% + size / 2)", "calc-size(fit-content, 50% + 0.5 * size)"); test_typed_om_string("width", "calc-size(any, 30px)"); test_typed_om_string("width", "calc-size(any, 25em)", "calc-size(any, 400px)"); test_typed_om_string("width", "calc-size(any, 40%)"); @@ -41,6 +41,6 @@ test_typed_om_string("width", "calc-size(calc-size(any, 30px), 25em)", "calc-siz test_typed_om_string("width", "calc-size(calc-size(2in, 30px), 25em)", "calc-size(calc-size(192px, 30px), 400px)"); test_typed_om_string("width", "calc-size(calc-size(min-content, 30px), 25em)", "calc-size(calc-size(min-content, 30px), 400px)"); test_typed_om_string("width", "calc-size(calc-size(min-content, size), size)"); -test_typed_om_string("width", "calc-size(calc-size(fit-content, size * 2), size)"); +test_typed_om_string("width", "calc-size(calc-size(fit-content, size * 2), size)", "calc-size(calc-size(fit-content, 2 * size), size)"); </script> diff --git a/tests/wpt/tests/css/css-values/exp-log-compute.html b/tests/wpt/tests/css/css-values/exp-log-compute.html index 9efc1a7721c..4bdd507fa33 100644 --- a/tests/wpt/tests/css/css-values/exp-log-compute.html +++ b/tests/wpt/tests/css/css-values/exp-log-compute.html @@ -29,6 +29,9 @@ test_math_used('calc(log((3 + 1) /2, 2) / log(e) + exp(0*1)*2 * log(e))', '3', test_math_used('calc(log((3 + 1) /2, 2) / log(e, e) + exp(0*1)*2 * log(e, e))', '3', {type:'number', approx:0.1}); test_math_used('calc(exp(0) + 1)', '2', {type:'number', approx:0.1}); +// Test unresolved at parse time +test_math_used('calc(e - exp(sibling-index()))', '0', {type:'number', approx:0.1}); + // Test nesting test_math_used('calc(log(exp(1)))', '1', {type:'number', approx:0.1}); test_math_used('calc(log(exp(log(e))))', '1', {type:'number', approx:0.1}); diff --git a/tests/wpt/tests/css/css-values/hypot-pow-sqrt-computed.html b/tests/wpt/tests/css/css-values/hypot-pow-sqrt-computed.html index 6ac416c0f5b..19ce1c2d49d 100644 --- a/tests/wpt/tests/css/css-values/hypot-pow-sqrt-computed.html +++ b/tests/wpt/tests/css/css-values/hypot-pow-sqrt-computed.html @@ -6,7 +6,12 @@ <script src="/resources/testharness.js"></script> <script src="/resources/testharnessreport.js"></script> <script src="../support/numeric-testcommon.js"></script> -<div id="target"></div> +<div> + <div></div> + <div></div> + <div></div> + <div id="target"></div> +</div> <script> // Identity tests @@ -38,6 +43,11 @@ test_math_used('hypot(0% + 772.333px)', 'calc(0% + 772.333px)'); test_math_used('hypot(0% + 772.35px)', 'calc(0% + 772.35px)'); test_math_used('hypot(0% + 600px, 0% + 800px)', '1000px'); +//Test unresolved at parse time +test_math_used('sqrt(sibling-index())', '2', {type: 'integer'}); +test_math_used('calc(1px * sqrt(sibling-index()))', '2px'); +test_math_used('sqrt(pow(sibling-index(), 2))', '4', {type: 'integer'}); + //Type checking hypot test_math_used('hypot(1px)', '1px'); test_math_used('hypot(1cm)', '1cm'); diff --git a/tests/wpt/tests/css/css-values/random-computed.tentative.html b/tests/wpt/tests/css/css-values/random-computed.tentative.html index c6a408040ce..b0539acf593 100644 --- a/tests/wpt/tests/css/css-values/random-computed.tentative.html +++ b/tests/wpt/tests/css/css-values/random-computed.tentative.html @@ -1,88 +1,114 @@ <!DOCTYPE html> <link rel="help" href="https://drafts.csswg.org/css-values-5/#random"> <link rel="author" title="sam@webkit.org"> +<meta name="timeout" content="long"> <script src="/resources/testharness.js"></script> <script src="/resources/testharnessreport.js"></script> <script src="../support/computed-testcommon.js"></script> -<div id="container" style="font-size: 20"> +<div id="container"> <div id="target"></div> </div> -<div id="noIdentifier1" class="randomNoIdentifier"></div> -<div id="noIdentifier2" class="randomNoIdentifier"></div> -<div id="identifier1" class="randomIdentifier"></div> -<div id="identifier2" class="randomIdentifier"></div> -<div id="identicalArguments1"></div> -<div id="identicalArguments2"></div> -<div id="identicalArgumentsAfterMath1"></div> -<div id="identicalArgumentsAfterMath2"></div> -<div id="identicalArgumentsAfterUnitResolution1"></div> -<div id="identicalArgumentsAfterUnitResolution2"></div> -<div id="identicalTwoProperties"></div> -<div id="identicalTwoPropertiesWithIdentifier"></div> -<div id="identicalTwoPropertiesWithPerElement"></div> -<div id="identicalTwoPropertiesWithPerElementAndIdentifier"></div> <style> - .randomPerElement { width: random(per-element, 0px, 100000px); } - .randomNoIdentifier { width: random(10px, 110px); } - .randomIdentifier { width: random(--identifier, 20px, 120px); } - - #identicalArguments1 { width: random(30px, 130px); } - #identicalArguments2 { width: random(30px, 130px); } - - #identicalArgumentsAfterMath1 { width: random(5 * 10px, 2 * 75px); } - #identicalArgumentsAfterMath2 { width: random(100px / 2, 300px / 2); } - - #identicalArgumentsAfterUnitResolution1 { width: random(160px, 320px); } - #identicalArgumentsAfterUnitResolution2 { font-size: 16px; width: random(10em, 20em); } - - #identicalTwoProperties { - width: random(60px, 160px); - height: random(60px, 160px); + .randomNoIdentifier { + width: random(0px, 100px); + height: random(0px, 100px); + left: random(0px, 100000px); + right: random(0px, 100000px); + margin: random(0px, 100000px) random(0px, 100000px); } - - #identicalTwoPropertiesWithIdentifier { - width: random(--another-identifier, 70px, 170px); - height: random(--another-identifier, 70px, 170px); + .randomMatchElement { + width: random(element-shared, 0px, 100px); + height: random(element-shared, 0px, 100px); + left: random(element-shared, 0px, 100000px); + right: random(element-shared, 0px, 100000px); + margin: random(element-shared 0px, 100000px) random(element-shared 0px, 100000px); } - - #identicalTwoPropertiesWithPerElement { - width: random(per-element, 80px, 180px); - height: random(per-element, 80px, 180px); + .randomIdentifier { + width: random(--identifier, 0px, 100px); + height: random(--identifier, 0px, 100px); + left: random(--identifier, 0px, 100000px); + right: random(--identifier, 0px, 100000px); + margin: random(--identifier 0px, 100000px) random(--identifier 0px, 100000px); } - - #identicalTwoPropertiesWithPerElementAndIdentifier { - width: random(per-element --yet-another-identifier, 90px, 190px); - height: random(--yet-another-identifier per-element, 90px, 190px); + .randomMatchElementAndIdentifier { + width: random(element-shared --other-identifier, 0px, 100px); + height: random(element-shared --other-identifier, 0px, 100px); + left: random(element-shared --other-identifier, 0px, 100000px); + right: random(element-shared --other-identifier, 0px, 100000px); + margin: random(element-shared --other-identifier 0px, 100000px) random(element-shared --other-identifier 0px, 100000px); + } + .randomFixed { + width: random(fixed 0.5, 10px, 100px); + height: random(fixed 0.5, 10px, 100px); + left: random(fixed 0.5, 0px, 100000px); + right: random(fixed 0.5, 0px, 100000px); + margin: random(fixed 0.5 0px, 100000px) random(fixed 0.5 0px, 100000px); } </style> <script> -function test_computed_value_in_range(property, specified, computedMin, computedMax, titleExtra) { - test(() => { - const target = document.getElementById('target'); - assert_true(property in getComputedStyle(target), property + " doesn't seem to be supported in the computed style"); - assert_true(CSS.supports(property, specified), "'" + specified + "' is a supported value for " + property + "."); - target.style[property] = ''; - target.style[property] = specified; - let readValue = getComputedStyle(target)[property]; +// Run each test a number of times to increase the likelyhood that failure is not the cause of random chance. +const iterations = 5; - let readValueNumber = parseFloat(readValue); - let computedMinNumber = parseFloat(computedMin); - let computedMaxNumber = parseFloat(computedMax); +function test_random_computed_value(property, specified, computed, titleExtra, options = {}) { + if (!computed) + computed = specified; - assert_greater_than_equal(readValueNumber, computedMinNumber, specified); - assert_less_than_equal(readValueNumber, computedMaxNumber, specified); + test(() => { + for (i = 0; i < iterations; ++i) { + const target = document.getElementById('target'); + assert_true(property in getComputedStyle(target), property + " doesn't seem to be supported in the computed style"); + assert_true(CSS.supports(property, specified), "'" + specified + "' is a supported value for " + property + "."); + target.style[property] = ''; + target.style[property] = specified; + + let readValue = getComputedStyle(target)[property]; + if (options.comparisonFunction) { + options.comparisonFunction(readValue, computed); + } else if (Array.isArray(computed)) { + assert_in_array(readValue, computed); + } else { + assert_equals(readValue, computed); + } + if (readValue !== specified) { + target.style[property] = ''; + target.style[property] = readValue; + assert_equals(getComputedStyle(target)[property], readValue, + 'computed value should round-trip'); + } + } + }, `Property ${property} value '${specified}'${titleExtra ? ' ' + titleExtra : ''}`); +} + +function test_random_computed_value_greater_or_lower_than(property, specified, expected, titleExtra) { + test(() => { + for (i = 0; i < iterations; ++i) { + const target = document.getElementById('target'); + assert_true(property in getComputedStyle(target), property + " doesn't seem to be supported in the computed style"); + assert_true(CSS.supports(property, specified), "'" + specified + "' is a supported value for " + property + "."); + target.style[property] = ''; + target.style[property] = specified; + let readValue = parseFloat(getComputedStyle(target)[property]); + assert_true(isFinite(readValue), specified + " expected finite value but got " + readValue) + assert_false(isNaN(readValue), specified + " expected finite value but got " + readValue) + if (expected > 0) + assert_greater_than_equal(readValue, expected, specified); + else + assert_less_than_equal(readValue, expected, specified); + } }, `Property ${property} value '${specified}'${titleExtra ? ' ' + titleExtra : ''}`); } -function test_pseudo_element_computed_value_in_range(property, pseudo_element, specified, computedMin, computedMax, titleExtra) { +function test_random_computed_value_in_range(property, specified, computedMin, computedMax, titleExtra) { test(() => { - const styleEl = document.head.appendChild(document.createElement("style")); - styleEl.innerHTML = `#target${pseudo_element} \{ ${property}: ${specified}; \}`; + for (i = 0; i < iterations; ++i) { + const target = document.getElementById('target'); + assert_true(property in getComputedStyle(target), property + " doesn't seem to be supported in the computed style"); + assert_true(CSS.supports(property, specified), "'" + specified + "' is a supported value for " + property + "."); + target.style[property] = ''; + target.style[property] = specified; - try { - const target = document.getElementById("target"); - let readValue = getComputedStyle(target, pseudo_element)[property]; + let readValue = getComputedStyle(target)[property]; let readValueNumber = parseFloat(readValue); let computedMinNumber = parseFloat(computedMin); @@ -90,214 +116,359 @@ function test_pseudo_element_computed_value_in_range(property, pseudo_element, s assert_greater_than_equal(readValueNumber, computedMinNumber, specified); assert_less_than_equal(readValueNumber, computedMaxNumber, specified); - } finally { - document.head.removeChild(styleEl); + } + }, `Property ${property} value '${specified}'${titleExtra ? ' ' + titleExtra : ''}`); +} + +function test_pseudo_element_random_computed_value_in_range(property, pseudo_element, specified, computedMin, computedMax, titleExtra) { + test(() => { + for (i = 0; i < iterations; ++i) { + const styleEl = document.head.appendChild(document.createElement("style")); + styleEl.innerHTML = `#target${pseudo_element} \{ ${property}: ${specified}; \}`; + + try { + const target = document.getElementById("target"); + let readValue = getComputedStyle(target, pseudo_element)[property]; + + let readValueNumber = parseFloat(readValue); + let computedMinNumber = parseFloat(computedMin); + let computedMaxNumber = parseFloat(computedMax); + + assert_greater_than_equal(readValueNumber, computedMinNumber, specified); + assert_less_than_equal(readValueNumber, computedMaxNumber, specified); + } finally { + document.head.removeChild(styleEl); + } } }, `Property ${property} value on pseudo element '${pseudo_element}' '${specified}'${titleExtra ? ' ' + titleExtra : ''}`); } -const property = 'scale'; +function test_random_computed_value_has_fixed(property, specified, minPercentage, maxPercentage, titleExtra) { + test(() => { + for (i = 0; i < iterations; ++i) { + const target = document.getElementById('target'); + assert_true(property in getComputedStyle(target), property + " doesn't seem to be supported in the computed style"); + assert_true(CSS.supports(property, specified), "'" + specified + "' is a supported value for " + property + "."); + target.style[property] = ''; + target.style[property] = specified; -test_computed_value_in_range(property, 'random(1, 11)', '1', '11'); -test_computed_value_in_range(property, 'random(--foo, 2, 12)', '2', '12'); -test_computed_value_in_range(property, 'random(--foo per-element, 3, 13)', '3', '13'); -test_computed_value_in_range(property, 'random(per-element --foo, 4, 14)', '4', '14'); + let readValue = getComputedStyle(target)[property]; -test_computed_value(property, 'random(0, 10, by 5)', ['0', '5', '10']); -test_computed_value(property, 'random(--foo, 10, 20, by 5)', ['10', '15', '20']); -test_computed_value(property, 'random(--foo per-element, 20, 30, by 5)', ['20', '25', '30']); -test_computed_value(property, 'random(per-element --foo, 30, 40, by 5)', ['30', '35', '40']); + // strip 'random(' and ')'. + let stippedReadValue = readValue.replace('random(', '').replace(')', ''); -// Test out of order. -test_computed_value(property, 'random(100, 10)', '100'); -test_computed_value(property, 'random(-10, -100)', '-10'); + // split into the three main components + let [fixedComponent, minComponent, maxComponent] = stippedReadValue.split(', '); -// Test negative values -test_computed_value_in_range(property, 'random(-100, -10)', '-100', '-10'); -test_computed_value(property, 'random(40, 50, by -5)', '40'); + // split fixed component into its two components + let [fixedString, fixedValue] = fixedComponent.split(' '); -// Test nested expressions -test_computed_value_in_range(property, 'random(5 * 1, 30 / 2)', '5', '15'); + assert_equals(fixedString, 'fixed', specified); + assert_greater_than_equal(parseFloat(fixedValue), '0', specified); + assert_less_than_equal(parseFloat(fixedValue), '1', specified); + assert_equals(minComponent, minPercentage, specified); + assert_equals(maxComponent, maxPercentage, specified); + } + }, `Property ${property} value '${specified}'${titleExtra ? ' ' + titleExtra : ''}`); +} -// Test nested in expressions -test_computed_value_in_range(property, 'calc(2 * random(6, 16))', '12', '32'); +const property = 'scale'; -// Test NaN -test_computed_value(property, 'random(NaN, 100)', '0'); -test_computed_value(property, 'random(10, NaN)', '0'); -test_computed_value(property, 'random(NaN, NaN)', '0'); -test_computed_value(property, 'random(NaN, 100, by 10)', '0'); -test_computed_value(property, 'random(10, NaN, by 10)', '0'); -test_computed_value(property, 'random(NaN, NaN, by 10)', '0'); -test_computed_value(property, 'random(NaN, 100, by NaN)', '0'); -test_computed_value(property, 'random(10, NaN, by NaN)', '0'); -test_computed_value(property, 'random(NaN, NaN, by NaN)', '0'); -test_computed_value(property, 'random(10, 100, by NaN)', '0'); -test_computed_value(property, 'calc(10 + random(NaN, 100))', '0'); -test_computed_value(property, 'calc(10 + random(10, NaN))', '0'); -test_computed_value(property, 'calc(10 + random(NaN, NaN))', '0'); -test_computed_value(property, 'calc(10 + random(NaN, 100, by 10))', '0'); -test_computed_value(property, 'calc(10 + random(10, NaN, by 10))', '0'); -test_computed_value(property, 'calc(10 + random(NaN, NaN, by 10))', '0'); -test_computed_value(property, 'calc(10 + random(NaN, 100, by NaN))', '0'); -test_computed_value(property, 'calc(10 + random(10, NaN, by NaN))', '0'); -test_computed_value(property, 'calc(10 + random(NaN, NaN, by NaN))', '0'); -test_computed_value(property, 'calc(10 + random(10, 100, by NaN))', '0'); +test_random_computed_value_in_range(property, 'random(1, 11)', '1', '11'); +test_random_computed_value_in_range(property, 'random(--foo, 2, 12)', '2', '12'); +test_random_computed_value_in_range(property, 'random(--foo element-shared, 3, 13)', '3', '13'); +test_random_computed_value_in_range(property, 'random(element-shared --foo, 4, 14)', '4', '14'); -// Test infinity -test_computed_value(property, 'random(infinity, 100)', '0'); -test_computed_value(property, 'random(10, infinity)', '0'); -test_computed_value(property, 'random(infinity, infinity)', '0'); -test_computed_value(property, 'random(infinity, 100, by 10)', '0'); -test_computed_value(property, 'random(10, infinity, by 10)', '0'); -test_computed_value(property, 'random(infinity, infinity, by 10)', '0'); -test_computed_value(property, 'random(infinity, 100, by infinity)', '0'); -test_computed_value(property, 'random(10, infinity, by infinity)', '0'); -test_computed_value(property, 'random(infinity, infinity, by infinity)', '0'); -test_computed_value(property, 'calc(10 + random(infinity, 100))', '0'); -test_computed_value(property, 'calc(10 + random(10, infinity))', '0'); -test_computed_value(property, 'calc(10 + random(infinity, infinity))', '0'); -test_computed_value(property, 'calc(10 + random(infinity, 100, by 10))', '0'); -test_computed_value(property, 'calc(10 + random(10, infinity, by 10))', '0'); -test_computed_value(property, 'calc(10 + random(infinity, infinity, by 10))', '0'); -test_computed_value(property, 'calc(10 + random(infinity, 100, by infinity))', '0'); -test_computed_value(property, 'calc(10 + random(10, infinity, by infinity))', '0'); -test_computed_value(property, 'calc(10 + random(infinity, infinity, by infinity))', '0'); -// If only step is infinite, min is used. -test_computed_value(property, 'random(10, 100, by infinity)', '10'); -test_computed_value(property, 'random(10, 100, by -infinity)', '10'); -test_computed_value(property, 'calc(10 + random(10, 100, by infinity))', '20'); -test_computed_value(property, 'calc(10 + random(10, 100, by -infinity))', '20'); +test_random_computed_value(property, 'random(0, 10, 5)', ['0', '5', '10']); +test_random_computed_value(property, 'random(--foo, 10, 20, 5)', ['10', '15', '20']); +test_random_computed_value(property, 'random(--foo element-shared, 20, 30, 5)', ['20', '25', '30']); +test_random_computed_value(property, 'random(element-shared --foo, 30, 40, 5)', ['30', '35', '40']); -// Test pseudo on psuedo elements -test_pseudo_element_computed_value_in_range('scale', '::before', 'random(7, 17)', '7', '17'); -test_pseudo_element_computed_value_in_range('scale', '::before', 'random(--bar, 8, 18)', '8', '18'); -test_pseudo_element_computed_value_in_range('scale', '::before', 'random(per-element, 9, 19)', '9', '19'); -test_pseudo_element_computed_value_in_range('scale', '::before', 'random(per-element --foo, 10, 20)', '10', '20'); +// Test out of order. +test_random_computed_value(property, 'random(100, 10)', '100'); +test_random_computed_value(property, 'random(-10, -100)', '-10'); -// Test identifier caching -test(() => { - const t1 = document.getElementById('noIdentifier1'); - const t2 = document.getElementById('noIdentifier2'); +// Test negative range values +test_random_computed_value_in_range(property, 'random(-100, -10)', '-100', '-10'); - let t1Computed = getComputedStyle(t1)['width']; - let t2Computed = getComputedStyle(t2)['width']; +// Test negative step values (treated as if step is not there) +test_random_computed_value_in_range(property, 'random(40, 50, -5)', '40', '50'); - assert_equals(t1Computed, t2Computed); -}, `Uses of a style rule on two elements with 'random(...)'`); +// Test nested expressions +test_random_computed_value_in_range(property, 'random(5 * 1, 30 / 2)', '5', '15'); -test(() => { - const t1 = document.getElementById('identifier1'); - const t2 = document.getElementById('identifier2'); +// Test nested in expressions +test_random_computed_value_in_range(property, 'calc(2 * random(6, 16))', '12', '32'); - let t1Computed = getComputedStyle(t1)['width']; - let t2Computed = getComputedStyle(t2)['width']; +// Test NaN +test_random_computed_value(property, 'random(NaN, 100)', '0'); +test_random_computed_value(property, 'random(10, NaN)', '0'); +test_random_computed_value(property, 'random(NaN, NaN)', '0'); +test_random_computed_value(property, 'random(NaN, 100, 10)', '0'); +test_random_computed_value(property, 'random(10, NaN, 10)', '0'); +test_random_computed_value(property, 'random(NaN, NaN, 10)', '0'); +test_random_computed_value(property, 'random(NaN, 100, NaN)', '0'); +test_random_computed_value(property, 'random(10, NaN, NaN)', '0'); +test_random_computed_value(property, 'random(NaN, NaN, NaN)', '0'); +test_random_computed_value(property, 'random(10, 100, NaN)', '0'); +test_random_computed_value(property, 'calc(10 + random(NaN, 100))', '0'); +test_random_computed_value(property, 'calc(10 + random(10, NaN))', '0'); +test_random_computed_value(property, 'calc(10 + random(NaN, NaN))', '0'); +test_random_computed_value(property, 'calc(10 + random(NaN, 100, 10))', '0'); +test_random_computed_value(property, 'calc(10 + random(10, NaN, 10))', '0'); +test_random_computed_value(property, 'calc(10 + random(NaN, NaN, 10))', '0'); +test_random_computed_value(property, 'calc(10 + random(NaN, 100, NaN))', '0'); +test_random_computed_value(property, 'calc(10 + random(10, NaN, NaN))', '0'); +test_random_computed_value(property, 'calc(10 + random(NaN, NaN, NaN))', '0'); +test_random_computed_value(property, 'calc(10 + random(10, 100, NaN))', '0'); - assert_equals(t1Computed, t2Computed); -}, `Uses of a style rule on two elements with 'random(--identifier, ...)'`); +// Test infinity -test(() => { - const t1 = document.getElementById('identicalArguments1'); - const t2 = document.getElementById('identicalArguments2'); +const REALLY_LARGE = 1e6; +const REALLY_LARGE_NEGATIVE = -REALLY_LARGE; + +test_random_computed_value_greater_or_lower_than(property, 'random(infinity, 100)', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'random(infinity, infinity)', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'random(infinity, 100, 10)', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'random(infinity, infinity, 10)', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'random(infinity, 100, infinity)', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'random(infinity, infinity, infinity)', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'calc(10 + random(infinity, 100))', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'calc(10 + random(infinity, infinity))', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'calc(10 + random(infinity, infinity, 10))', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'calc(10 + random(infinity, 100, infinity))', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'calc(10 + random(infinity, infinity, infinity))', REALLY_LARGE); +test_random_computed_value_greater_or_lower_than(property, 'calc(10 + random(infinity, 100, 10))', REALLY_LARGE); +test_random_computed_value(property, 'random(10, infinity)', '0'); +test_random_computed_value(property, 'random(10, infinity, 10)', '0'); +test_random_computed_value(property, 'random(10, infinity, infinity)', '0'); +test_random_computed_value(property, 'calc(10 + random(10, infinity))', '0'); +test_random_computed_value(property, 'calc(10 + random(10, infinity, 10))', '0'); +test_random_computed_value(property, 'calc(10 + random(10, infinity, infinity))', '0'); +test_random_computed_value(property, 'random(10, 100, infinity)', '0'); +test_random_computed_value(property, 'calc(10 + random(10, 100, infinity))', '0'); +// Negative steps, even infinitely negative steps, are ignored. +test_random_computed_value_in_range(property, 'random(10, 100, -infinity)', '10', '100'); +test_random_computed_value_in_range(property, 'calc(10 + random(10, 100, -infinity))', '20', '110'); - let t1Computed = getComputedStyle(t1)['width']; - let t2Computed = getComputedStyle(t2)['width']; +// Test pseudo on psuedo elements +test_pseudo_element_random_computed_value_in_range(property, '::before', 'random(7, 17)', '7', '17'); +test_pseudo_element_random_computed_value_in_range(property, '::before', 'random(--bar, 8, 18)', '8', '18'); +test_pseudo_element_random_computed_value_in_range(property, '::before', 'random(element-shared, 9, 19)', '9', '19'); +test_pseudo_element_random_computed_value_in_range(property, '::before', 'random(element-shared --foo, 10, 20)', '10', '20'); - assert_equals(t1Computed, t2Computed); -}, `Uses of two style rules on two elements with identical arguments`); +// Test unresolvable percentage values +test_random_computed_value_has_fixed('translate', 'random(10%, 100%)', '10%', '100%'); +// Test random value sharing test(() => { - const t1 = document.getElementById('identicalArgumentsAfterMath1'); - const t2 = document.getElementById('identicalArgumentsAfterMath2'); - - let t1Computed = getComputedStyle(t1)['width']; - let t2Computed = getComputedStyle(t2)['width']; + const holder = document.createElement('div'); + document.body.appendChild(holder); + + try { + const el = document.createElement('div'); + el.className = 'randomNoIdentifier'; + holder.appendChild(el); + const elComputedLeft = getComputedStyle(el)['left']; + + var allSame = true; + var allHaveSameLeftAndRight = true; + for (i = 0; i < iterations; ++i) { + const other = document.createElement('div'); + other.className = 'randomNoIdentifier'; + holder.appendChild(other); + const otherComputedLeft = getComputedStyle(other)['left']; + if (elComputedLeft != otherComputedLeft) { + allSame = false; + } + const otherComputedRight = getComputedStyle(other)['right']; + if (elComputedLeft != otherComputedRight) { + allHaveSameLeftAndRight = false; + } + } - assert_equals(t1Computed, t2Computed); -}, `Uses of two style rules on two elements with identical arguments after math has been resolved`); + assert_false(allSame); + assert_false(allHaveSameLeftAndRight); + } finally { + document.body.removeChild(holder); + } +}, `Maximum random: 'random(a, b)'`); test(() => { - const t1 = document.getElementById('identicalArgumentsAfterUnitResolution1'); - const t2 = document.getElementById('identicalArgumentsAfterUnitResolution2'); - - let t1Computed = getComputedStyle(t1)['width']; - let t2Computed = getComputedStyle(t2)['width']; + const holder = document.createElement('div'); + document.body.appendChild(holder); + + try { + var allHaveSameMarginTopAndMarginLeft = true; + for (i = 0; i < iterations; ++i) { + const other = document.createElement('div'); + other.className = 'randomNoIdentifier'; + holder.appendChild(other); + const otherComputedMarginLeft = getComputedStyle(other)['margin-left']; + const otherComputedMarginTop = getComputedStyle(other)['margin-top']; + if (otherComputedMarginLeft != otherComputedMarginTop) { + allHaveSameMarginTopAndMarginLeft = false; + } + } - assert_equals(t1Computed, t2Computed); -}, `Uses of two style rules on two elements with identical arguments after unit resolution`); + assert_false(allHaveSameMarginTopAndMarginLeft); + } finally { + document.body.removeChild(holder); + } +}, `Maximum random - shorthand: random(a, b))`); test(() => { - const style = 'width: calc(410px, 500px)'; + const holder = document.createElement('div'); + document.body.appendChild(holder); - const el1 = document.createElement('div'); - el1.style = style; - document.body.appendChild(el1); - const el1Computed = getComputedStyle(el1)['width']; + try { + for (i = 0; i < iterations; ++i) { + const el = document.createElement('div'); + el.className = 'randomIdentifier'; + holder.appendChild(el); - const el2 = document.createElement('div'); - el2.style = style; - document.body.appendChild(el2); - const el2Computed = getComputedStyle(el2)['width']; + let elComputedWidth = getComputedStyle(el)['width']; + let elComputedHeight = getComputedStyle(el)['height']; - assert_equals(el1Computed, el2Computed); -}, `Uses of two style rules on two elements with identical arguments accross two different style resolutions`); + assert_equals(elComputedWidth, elComputedHeight); + } + } finally { + document.body.removeChild(holder); + } +}, `Shared by name within an element: 'random(--identifier, a, b)'`); test(() => { - const el = document.getElementById('identicalTwoProperties'); - - let widthComputed = getComputedStyle(el)['width']; - let heightComputed = getComputedStyle(el)['height']; + const holder = document.createElement('div'); + document.body.appendChild(holder); + + try { + var allHaveSameMarginTopAndMarginLeft = true; + for (i = 0; i < iterations; ++i) { + const other = document.createElement('div'); + other.className = 'randomIdentifier'; + holder.appendChild(other); + const otherComputedMarginLeft = getComputedStyle(other)['margin-left']; + const otherComputedMarginTop = getComputedStyle(other)['margin-top']; + if (otherComputedMarginLeft != otherComputedMarginTop) { + allHaveSameMarginTopAndMarginLeft = false; + } + } - assert_equals(widthComputed, heightComputed); -}, `Uses of a style rule for two properies on an element with identical uses of random(...).`); + assert_true(allHaveSameMarginTopAndMarginLeft); + } finally { + document.body.removeChild(holder); + } +}, `Shared by name within an element - shorthand: random(--identifier, a, b))`); test(() => { - const el = document.getElementById('identicalTwoPropertiesWithIdentifier'); + const holder = document.createElement('div'); + document.body.appendChild(holder); + + try { + for (i = 0; i < iterations; ++i) { + const t1 = document.createElement('div'); + t1.className = 'randomMatchElement'; + holder.appendChild(t1); + const t2 = document.createElement('div'); + t2.className = 'randomMatchElement'; + holder.appendChild(t2); + + let t1ComputedWidth = getComputedStyle(t1)['width']; + let t2ComputedWidth = getComputedStyle(t2)['width']; + + assert_equals(t1ComputedWidth, t2ComputedWidth); + } + } finally { + document.body.removeChild(holder); + } +}, `Shared between elements within a property: random(element-shared, a, b)`); - let widthComputed = getComputedStyle(el)['width']; - let heightComputed = getComputedStyle(el)['height']; +test(() => { + const holder = document.createElement('div'); + document.body.appendChild(holder); + + try { + var allHaveSameMarginTopAndMarginLeft = true; + for (i = 0; i < iterations; ++i) { + const other = document.createElement('div'); + other.className = 'randomMatchElement'; + holder.appendChild(other); + const otherComputedMarginLeft = getComputedStyle(other)['margin-left']; + const otherComputedMarginTop = getComputedStyle(other)['margin-top']; + if (otherComputedMarginLeft != otherComputedMarginTop) { + allHaveSameMarginTopAndMarginLeft = false; + } + } - assert_equals(widthComputed, heightComputed); -}, `Uses of a style rule for two properies on an element with identical uses of random(--identifier, ...).`); + assert_true(allHaveSameMarginTopAndMarginLeft); + } finally { + document.body.removeChild(holder); + } +}, `Shared between elements within a property - shorthand: random(element-shared, a, b))`); test(() => { - const el = document.getElementById('identicalTwoPropertiesWithPerElement'); + const holder = document.createElement('div'); + document.body.appendChild(holder); + + try { + for (i = 0; i < iterations; ++i) { + const t1 = document.createElement('div'); + t1.className = 'randomMatchElementAndIdentifier'; + holder.appendChild(t1); + const t2 = document.createElement('div'); + t2.className = 'randomMatchElementAndIdentifier'; + holder.appendChild(t2); + + let t1ComputedWidth = getComputedStyle(t1)['width']; + let t2ComputedHeight = getComputedStyle(t2)['height']; + + assert_equals(t1ComputedWidth, t2ComputedHeight); + } + } finally { + document.body.removeChild(holder); + } +}, `Shared globally: random(--identifier element-shared, a, b)`); - let widthComputed = getComputedStyle(el)['width']; - let heightComputed = getComputedStyle(el)['height']; +test(() => { + const holder = document.createElement('div'); + document.body.appendChild(holder); + + try { + var allHaveSameMarginTopAndMarginLeft = true; + for (i = 0; i < iterations; ++i) { + const other = document.createElement('div'); + other.className = 'randomMatchElementAndIdentifier'; + holder.appendChild(other); + const otherComputedMarginLeft = getComputedStyle(other)['margin-left']; + const otherComputedMarginTop = getComputedStyle(other)['margin-top']; + if (otherComputedMarginLeft != otherComputedMarginTop) { + allHaveSameMarginTopAndMarginLeft = false; + } + } - assert_equals(widthComputed, heightComputed); -}, `Uses of a style rule for two properies on an element with identical uses of random(per-elemnent, ...).`); + assert_true(allHaveSameMarginTopAndMarginLeft); + } finally { + document.body.removeChild(holder); + } +}, `Shared globally - shorthand: random(element-shared, a, b))`); test(() => { - const el = document.getElementById('identicalTwoPropertiesWithPerElementAndIdentifier'); + const holder = document.createElement('div'); + document.body.appendChild(holder); - let widthComputed = getComputedStyle(el)['width']; - let heightComputed = getComputedStyle(el)['height']; + try { + for (i = 0; i < iterations; ++i) { + const t1 = document.createElement('div'); + t1.className = 'randomFixed'; + holder.appendChild(t1); - assert_equals(widthComputed, heightComputed); -}, `Uses of a style rule for two properies on an element with identical uses of random(per-elemnent --identifier, ...).`); + let t1ComputedWidth = getComputedStyle(t1)['width']; -test(() => { - const el = document.createElement('div'); - el.className = 'randomPerElement'; - document.body.appendChild(el); - const elComputed = getComputedStyle(el)['width']; - - // It is statistically improbable that all 100 elements will have - // the same width when picked as a random number between 0 and 100000. - var allSame = true; - for (i = 0; i < 100; ++i) { - const other = document.createElement('div'); - other.className = 'randomPerElement'; - document.body.appendChild(other); - const otherComputed = getComputedStyle(other)['width']; - if (elComputed != otherComputed) { - allSame = false; + assert_equals(t1ComputedWidth, "55px"); } + } finally { + document.body.removeChild(holder); } - - assert_false(allSame); -}, `Uses of a style rule on multiple elements with 'random(per-element, ...)'`); +}, `Fixed: random(fixed <number>, a, b)`); </script> diff --git a/tests/wpt/tests/css/css-values/random-invalid.tentative.html b/tests/wpt/tests/css/css-values/random-invalid.tentative.html index f21d36077dc..dd428868a2d 100644 --- a/tests/wpt/tests/css/css-values/random-invalid.tentative.html +++ b/tests/wpt/tests/css/css-values/random-invalid.tentative.html @@ -13,16 +13,22 @@ test_invalid_value('width', 'random(1px, )'); test_invalid_value('width', 'random(,1px)'); test_invalid_value('width', 'random(1px)'); test_invalid_value('width', 'random(1px,2px,)'); -test_invalid_value('width', 'random(1px,2px,by 1px,)'); -test_invalid_value('width', 'random(1px,2px,by 1px foo)'); +test_invalid_value('width', 'random(1px,2px,1px,)'); +test_invalid_value('width', 'random(1px,2px,1px foo)'); test_invalid_value('width', 'random(foo, 1px, 2px)'); test_invalid_value('width', 'random("foo", 1px, 2px)'); test_invalid_value('width', 'random("--foo", 1px, 2px)'); -test_invalid_value('width', 'random(per-element foo, 1px, 2px)'); -test_invalid_value('width', 'random(per-element 1px, 2px)'); -test_invalid_value('width', 'random(1px, 2px, by 1px, per-element)'); +test_invalid_value('width', 'random(element-shared foo, 1px, 2px)'); +test_invalid_value('width', 'random(element-shared 1px, 2px)'); +test_invalid_value('width', 'random(1px, 2px, 1px, element-shared)'); test_invalid_value('width', 'random(--foo --bar, 1px, 2px)'); - +test_invalid_value('width', 'random(fixed random(1, 2), 1px, 2px)'); +test_invalid_value('width', 'random(fixed 0.5 element-shared, 1px, 2px)'); +test_invalid_value('width', 'random(fixed 0.5 auto, 1px, 2px)'); +test_invalid_value('width', 'random(fixed 0.5 --foo, 1px, 2px)'); +test_invalid_value('width', 'random(fixed 0.5px, 1px, 2px)'); +test_invalid_value('width', 'random(fixed 0.5%, 1px, 2px)'); +test_invalid_value('width', 'random(fixed -1, 1px, 2px)'); test_invalid_value('width', 'random(10deg, 20deg)'); test_invalid_value('width', 'random(10px, 20%)'); diff --git a/tests/wpt/tests/css/css-values/random-serialize.tentative.html b/tests/wpt/tests/css/css-values/random-serialize.tentative.html index 43dc3a3f677..5c0b9601da0 100644 --- a/tests/wpt/tests/css/css-values/random-serialize.tentative.html +++ b/tests/wpt/tests/css/css-values/random-serialize.tentative.html @@ -8,37 +8,47 @@ <script> test_valid_value('width', 'random(0px, 100px)'); -test_valid_value('width', 'random(0px, 100px, by 50px)'); +test_valid_value('width', 'random(0px, 100px, 50px)'); test_valid_value('width', 'random(--foo, 0px, 100px)'); -test_valid_value('width', 'random(--foo per-element, 0px, 100px)'); -test_valid_value('width', 'random(per-element --foo, 0px, 100px)', 'random(--foo per-element, 0px, 100px)'); -test_valid_value('width', 'random(--foo, 0px, 100px, by 50px)'); -test_valid_value('width', 'random(--foo per-element, 0px, 100px, by 50px)'); -test_valid_value('width', 'random(per-element --foo, 0px, 100px, by 50px)', 'random(--foo per-element, 0px, 100px, by 50px)'); +test_valid_value('width', 'random(auto, 0px, 100px)', 'random(0px, 100px)'); +test_valid_value('width', 'random(--foo element-shared, 0px, 100px)'); +test_valid_value('width', 'random(auto element-shared, 0px, 100px)', 'random(element-shared, 0px, 100px)'); +test_valid_value('width', 'random(element-shared --foo, 0px, 100px)', 'random(--foo element-shared, 0px, 100px)'); +test_valid_value('width', 'random(element-shared auto, 0px, 100px)', 'random(element-shared, 0px, 100px)'); +test_valid_value('width', 'random(fixed 0.5, 0px, 100px)'); +test_valid_value('width', 'random(--foo, 0px, 100px, 50px)'); +test_valid_value('width', 'random(auto, 0px, 100px, 50px)', 'random(0px, 100px, 50px)'); +test_valid_value('width', 'random(--foo element-shared, 0px, 100px, 50px)'); +test_valid_value('width', 'random(auto element-shared, 0px, 100px, 50px)', 'random(element-shared, 0px, 100px, 50px)'); +test_valid_value('width', 'random(element-shared --foo, 0px, 100px, 50px)', 'random(--foo element-shared, 0px, 100px, 50px)'); +test_valid_value('width', 'random(element-shared auto, 0px, 100px, 50px)', 'random(element-shared, 0px, 100px, 50px)'); +test_valid_value('width', 'random(fixed 0.5, 0px, 100px, 50px)'); // Test out of order. test_valid_value('width', 'random(100px, 0px)'); // Test negative values test_valid_value('width', 'random(-100px, -10px)'); +test_valid_value('width', 'random(-100px, -10px, -5px)'); // Test mixed units. test_valid_value('width', 'random(1em, 200rem)'); // Test nested expressions test_valid_value('width', 'random(10 * 100px, 200em / 2)', 'random(1000px, 100em)'); +test_valid_value('width', 'random(fixed calc(2 / 4), 0px, 100px)', 'random(fixed calc(0.5), 0px, 100px)'); // Test nested in expressions test_valid_value('width', 'calc(2 * random(0px, 100px))'); // Test other types test_valid_value('max-lines', 'random(25, 50)'); -test_valid_value('max-lines', 'random(25, 50, by 5)'); +test_valid_value('max-lines', 'random(25, 50, 5)'); test_valid_value('scale', 'random(0.5, 2.5)'); -test_valid_value('scale', 'random(0.5, 2.5, by 0.1)'); +test_valid_value('scale', 'random(0.5, 2.5, 0.1)'); test_valid_value('rotate', 'random(25deg, 1turn)', 'random(25deg, 360deg)'); -test_valid_value('rotate', 'random(25deg, 1turn, by 5deg)', 'random(25deg, 360deg, by 5deg)'); +test_valid_value('rotate', 'random(25deg, 1turn, 5deg)', 'random(25deg, 360deg, 5deg)'); test_valid_value('transition-delay', 'random(25ms, 50s)', 'random(0.025s, 50s)'); -test_valid_value('transition-delay', 'random(25ms, 50s, by 5s)', 'random(0.025s, 50s, by 5s)'); +test_valid_value('transition-delay', 'random(25ms, 50s, 5s)', 'random(0.025s, 50s, 5s)'); </script> diff --git a/tests/wpt/tests/css/css-values/sin-cos-tan-computed.html b/tests/wpt/tests/css/css-values/sin-cos-tan-computed.html index a19b118f754..80b4d1972f6 100644 --- a/tests/wpt/tests/css/css-values/sin-cos-tan-computed.html +++ b/tests/wpt/tests/css/css-values/sin-cos-tan-computed.html @@ -38,4 +38,12 @@ test_math_used('calc(sin(0.25turn) )', '1', {type:'number', approx:0.1}); //Test nesting test_math_used('calc(cos(sin(cos(pi) + 1)))', '1', {type:'number', approx:0.1}); test_math_used('calc(sin(tan(pi/4)*pi/2) )', '1', {type:'number', approx:0.1}); + +//Test unresolved at parse time +test_math_used('calc(sin(pi * sibling-index())', '0', {type:'number', approx:0.1}); +test_math_used('calc(cos(pi * sibling-index())', '-1', {type:'number', approx:0.1}); +test_math_used('calc(tan(pi * sibling-index())', '0', {type:'number', approx:0.1}); +test_math_used('calc(sin(180deg * sibling-index())', '0', {type:'number', approx:0.1}); +test_math_used('calc(cos(180deg * sibling-index())', '-1', {type:'number', approx:0.1}); +test_math_used('calc(tan(180deg * sibling-index())', '0', {type:'number', approx:0.1}); </script> diff --git a/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-anonymous-negative.sub.html b/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-anonymous-negative.sub.html new file mode 100644 index 00000000000..f5066a55d2b --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-anonymous-negative.sub.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: crossorigin(anonymous)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-crossorigin-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../url-image-ref.html"> +<meta name="assert" content="A url with the request URL modifier crossorigin(anonymous) requires a response with the appropriate headers."> +<style> + .test { + width: 200px; + height: 200px; + background-color: green; + background-image: url("http://{{hosts[][]}}:{{ports[http][1]}}/css/support/1x1-red.png" crossorigin(anonymous)); + } +</style> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-anonymous.sub.html b/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-anonymous.sub.html new file mode 100644 index 00000000000..0a45eda33d7 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-anonymous.sub.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: crossorigin(anonymous)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-crossorigin-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../url-image-ref.html"> +<meta name="assert" content="A url with the request URL modifier crossorigin(anonymous) requires a response with the appropriate headers."> +<style> + .test { + width: 200px; + height: 200px; + background-color: red; + background-image: url("http://{{hosts[][]}}:{{ports[http][1]}}/css/support/1x1-green.png?pipe=header(Access-Control-Allow-Origin,*)" crossorigin(anonymous)); + } +</style> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-use-credentials-negative.sub.html b/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-use-credentials-negative.sub.html new file mode 100644 index 00000000000..952f953d844 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-use-credentials-negative.sub.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: crossorigin(use-credentials)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-crossorigin-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../url-image-ref.html"> +<meta name="assert" content="A url with the request URL modifier crossorigin(use-credentials) requires a response with the appropriate headers."> +<style> + .test { + width: 200px; + height: 200px; + background-color: green; + background-image: url("http://{{hosts[][]}}:{{ports[http][1]}}/css/support/1x1-green.png" crossorigin(use-credentials)); + } +</style> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-use-credentials.sub.html b/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-use-credentials.sub.html new file mode 100644 index 00000000000..f592a02c486 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/cross-origin/url-image-crossorigin-use-credentials.sub.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: crossorigin(use-credentials)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-crossorigin-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../url-image-ref.html"> +<meta name="assert" content="A url with the request URL modifier crossorigin(use-credentials) requires a response with the appropriate headers."> +<style> + .test { + width: 200px; + height: 200px; + background-color: red; + background-image: url("http://{{hosts[][]}}:{{ports[http][1]}}/css/support/1x1-green.png?pipe=header(Access-Control-Allow-Origin,http://{{hosts[][]}}:{{ports[http][0]}})|header(Access-Control-Allow-Credentials,true)" crossorigin(use-credentials)); + } +</style> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer-when-downgrade/url-image-referrerpolicy-cross-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer-when-downgrade/url-image-referrerpolicy-cross-origin.sub.html new file mode 100644 index 00000000000..ce51df67c02 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer-when-downgrade/url-image-referrerpolicy-cross-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(no-referrer-when-downgrade)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A cross origin url with the request URL modifier referrerpolicy(no-referrer-when-downgrade) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`cross-origin`, referrer_policy:`no-referrer-when-downgrade`, expected_referrer:`url`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer-when-downgrade/url-image-referrerpolicy-same-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer-when-downgrade/url-image-referrerpolicy-same-origin.sub.html new file mode 100644 index 00000000000..6860e7386bf --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer-when-downgrade/url-image-referrerpolicy-same-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(no-referrer-when-downgrade)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A same origin url with the request URL modifier referrerpolicy(no-referrer-when-downgrade) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`same-origin`, referrer_policy:`no-referrer-when-downgrade`, expected_referrer:`url`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer/url-image-referrerpolicy-cross-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer/url-image-referrerpolicy-cross-origin.sub.html new file mode 100644 index 00000000000..30a52a848a4 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer/url-image-referrerpolicy-cross-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(no-referrer)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A cross origin url with the request URL modifier referrerpolicy(no-referrer) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`cross-origin`, referrer_policy:`no-referrer`, expected_referrer:`none`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer/url-image-referrerpolicy-same-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer/url-image-referrerpolicy-same-origin.sub.html new file mode 100644 index 00000000000..ebbff834b92 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/no-referrer/url-image-referrerpolicy-same-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(no-referrer)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A same origin url with the request URL modifier referrerpolicy(no-referrer) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`same-origin`, referrer_policy:`no-referrer`, expected_referrer:`none`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/origin-when-cross-origin/url-image-referrerpolicy-cross-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/origin-when-cross-origin/url-image-referrerpolicy-cross-origin.sub.html new file mode 100644 index 00000000000..6285f2f0e5d --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/origin-when-cross-origin/url-image-referrerpolicy-cross-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(origin-when-cross-origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A cross origin url with the request URL modifier referrerpolicy(origin-when-cross-origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`cross-origin`, referrer_policy:`origin-when-cross-origin`, expected_referrer:`origin`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/origin-when-cross-origin/url-image-referrerpolicy-same-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/origin-when-cross-origin/url-image-referrerpolicy-same-origin.sub.html new file mode 100644 index 00000000000..eb4e081e940 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/origin-when-cross-origin/url-image-referrerpolicy-same-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(origin-when-cross-origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A same origin url with the request URL modifier referrerpolicy(origin-when-cross-origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`same-origin`, referrer_policy:`origin-when-cross-origin`, expected_referrer:`url`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/origin/url-image-referrerpolicy-cross-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/origin/url-image-referrerpolicy-cross-origin.sub.html new file mode 100644 index 00000000000..14a8172d6e3 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/origin/url-image-referrerpolicy-cross-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A cross origin url with the request URL modifier referrerpolicy(origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`cross-origin`, referrer_policy:`origin`, expected_referrer:`origin`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/origin/url-image-referrerpolicy-same-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/origin/url-image-referrerpolicy-same-origin.sub.html new file mode 100644 index 00000000000..1cc6f011c12 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/origin/url-image-referrerpolicy-same-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A same origin url with the request URL modifier referrerpolicy(origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`same-origin`, referrer_policy:`origin`, expected_referrer:`origin`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/same-origin/url-image-referrerpolicy-cross-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/same-origin/url-image-referrerpolicy-cross-origin.sub.html new file mode 100644 index 00000000000..de23eb1f095 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/same-origin/url-image-referrerpolicy-cross-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(same-origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A cross origin url with the request URL modifier referrerpolicy(same-origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`cross-origin`, referrer_policy:`same-origin`, expected_referrer:`none`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/same-origin/url-image-referrerpolicy-same-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/same-origin/url-image-referrerpolicy-same-origin.sub.html new file mode 100644 index 00000000000..866affc6d9f --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/same-origin/url-image-referrerpolicy-same-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(same-origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A same origin url with the request URL modifier referrerpolicy(same-origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`same-origin`, referrer_policy:`same-origin`, expected_referrer:`url`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin-when-cross-origin/url-image-referrerpolicy-cross-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin-when-cross-origin/url-image-referrerpolicy-cross-origin.sub.html new file mode 100644 index 00000000000..1e66fbf659f --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin-when-cross-origin/url-image-referrerpolicy-cross-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(strict-origin-when-cross-origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A cross origin url with the request URL modifier referrerpolicy(strict-origin-when-cross-origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`cross-origin`, referrer_policy:`strict-origin-when-cross-origin`, expected_referrer:`origin`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin-when-cross-origin/url-image-referrerpolicy-same-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin-when-cross-origin/url-image-referrerpolicy-same-origin.sub.html new file mode 100644 index 00000000000..57f5351a5a1 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin-when-cross-origin/url-image-referrerpolicy-same-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(strict-origin-when-cross-origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A same origin url with the request URL modifier referrerpolicy(strict-origin-when-cross-origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`same-origin`, referrer_policy:`strict-origin-when-cross-origin`, expected_referrer:`url`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin/url-image-referrerpolicy-cross-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin/url-image-referrerpolicy-cross-origin.sub.html new file mode 100644 index 00000000000..b17ac4b4ef7 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin/url-image-referrerpolicy-cross-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(strict-origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A cross origin url with the request URL modifier referrerpolicy(strict-origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`cross-origin`, referrer_policy:`strict-origin`, expected_referrer:`origin`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin/url-image-referrerpolicy-same-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin/url-image-referrerpolicy-same-origin.sub.html new file mode 100644 index 00000000000..dadf1c58d52 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/strict-origin/url-image-referrerpolicy-same-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(strict-origin)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A same origin url with the request URL modifier referrerpolicy(strict-origin) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`same-origin`, referrer_policy:`strict-origin`, expected_referrer:`origin`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/unsafe-url/url-image-referrerpolicy-cross-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/unsafe-url/url-image-referrerpolicy-cross-origin.sub.html new file mode 100644 index 00000000000..dc5a3d51435 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/unsafe-url/url-image-referrerpolicy-cross-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(unsafe-url)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A cross origin url with the request URL modifier referrerpolicy(unsafe-url) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`cross-origin`, referrer_policy:`unsafe-url`, expected_referrer:`url`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/referrer-policy/unsafe-url/url-image-referrerpolicy-same-origin.sub.html b/tests/wpt/tests/css/css-values/urls/referrer-policy/unsafe-url/url-image-referrerpolicy-same-origin.sub.html new file mode 100644 index 00000000000..7eaba535f14 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/referrer-policy/unsafe-url/url-image-referrerpolicy-same-origin.sub.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<title>Request URL Modifiers: referrerpolicy(unsafe-url)</title> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<link rel="match" href="../../url-image-ref.html"> +<meta name="assert" content="A same origin url with the request URL modifier referrerpolicy(unsafe-url) sends the appropriate referrer header."> +<script src="../../support/image-referrerpolicy.sub.js"></script> +<script> + test_image_referrer_policy({ load_type:`same-origin`, referrer_policy:`unsafe-url`, expected_referrer:`url`}); +</script> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/support/1x1-green.png b/tests/wpt/tests/css/css-values/urls/support/1x1-green.png Binary files differnew file mode 100644 index 00000000000..b98ca0ba0a0 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/support/1x1-green.png diff --git a/tests/wpt/tests/css/css-values/urls/support/1x1-navy.png b/tests/wpt/tests/css/css-values/urls/support/1x1-navy.png Binary files differnew file mode 100644 index 00000000000..9b9a03955ba --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/support/1x1-navy.png diff --git a/tests/wpt/tests/css/css-values/urls/support/1x1-red.png b/tests/wpt/tests/css/css-values/urls/support/1x1-red.png Binary files differnew file mode 100644 index 00000000000..6bd73ac1018 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/support/1x1-red.png diff --git a/tests/wpt/tests/css/css-values/urls/support/image-referrerpolicy.py b/tests/wpt/tests/css/css-values/urls/support/image-referrerpolicy.py new file mode 100644 index 00000000000..cff09165f10 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/support/image-referrerpolicy.py @@ -0,0 +1,41 @@ +import os.path + +from wptserve.utils import isomorphic_decode + +def main(request, response): + origin = request.GET[b'origin'] + url = request.GET[b'url'] + expected_referrer = request.GET[b'expected_referrer'] + actual_referrer = request.headers.get(b'referer', b'') + + if expected_referrer == b'none': + if actual_referrer == b'': + body = open(os.path.join(os.path.dirname(isomorphic_decode(__file__)), u"1x1-green.png"), u"rb").read() + else: + body = open(os.path.join(os.path.dirname(isomorphic_decode(__file__)), u"1x1-red.png"), u"rb").read() + elif expected_referrer == b'origin': + if actual_referrer == origin: + body = open(os.path.join(os.path.dirname(isomorphic_decode(__file__)), u"1x1-green.png"), u"rb").read() + else: + body = open(os.path.join(os.path.dirname(isomorphic_decode(__file__)), u"1x1-red.png"), u"rb").read() + elif expected_referrer == b'url': + if actual_referrer == url: + body = open(os.path.join(os.path.dirname(isomorphic_decode(__file__)), u"1x1-green.png"), u"rb").read() + else: + body = open(os.path.join(os.path.dirname(isomorphic_decode(__file__)), u"1x1-red.png"), u"rb").read() + else: + # Return neither red nor green if there is an unexpected "expected_referrer". + body = open(os.path.join(os.path.dirname(isomorphic_decode(__file__)), u"1x1-navy.png"), u"rb").read() + + response.add_required_headers = False + response.writer.write_status(200) + + if b'corp' in request.GET: + response.writer.write_header(b"cross-origin-resource-policy", request.GET[b'corp']) + if b'acao' in request.GET: + response.writer.write_header(b"access-control-allow-origin", request.GET[b'acao']) + response.writer.write_header(b"content-length", len(body)) + response.writer.write_header(b"cache-control", b"no-cache; must-revalidate") + response.writer.end_headers() + + response.writer.write(body) diff --git a/tests/wpt/tests/css/css-values/urls/support/image-referrerpolicy.sub.js b/tests/wpt/tests/css/css-values/urls/support/image-referrerpolicy.sub.js new file mode 100644 index 00000000000..4fc9d46218f --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/support/image-referrerpolicy.sub.js @@ -0,0 +1,19 @@ +function make_test_url(type, policy, expected) { + if (type == "cross-origin") + return `url("http://{{hosts[][]}}:{{ports[http][1]}}/css/css-values/urls/support/image-referrerpolicy.py?expected_referrer=${expected}&origin=${location.origin}/&url=${document.URL}"${policy ? ` referrerpolicy(${policy})` : ``})`; + if (type == "same-origin") + return `url("http://{{hosts[][]}}:{{ports[http][0]}}/css/css-values/urls/support/image-referrerpolicy.py?expected_referrer=${expected}&origin=${location.origin}/&url=${document.URL}"${policy ? ` referrerpolicy(${policy})` : ``})`; + throw `Unknown type: ${type}`; +} + +function test_image_referrer_policy(descriptor) { + var style = document.createElement("style"); + style.innerHTML = ` + .test { + width: 200px; + height: 200px; + background-color: blue; + background-image: ${make_test_url(descriptor.load_type, descriptor.referrer_policy, descriptor.expected_referrer)}; + };`; + document.head.append(style); +} diff --git a/tests/wpt/tests/css/css-values/urls/url-image-ref.html b/tests/wpt/tests/css/css-values/urls/url-image-ref.html new file mode 100644 index 00000000000..a56c789f147 --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/url-image-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html> +<head> +<style> + .test { + width: 200px; + height: 200px; + background-color: green; + } +</style> +</head> +<body> +<p>Test passes if there is a green square.</p> +<div class="test"></div> +</body> +</html> diff --git a/tests/wpt/tests/css/css-values/urls/url-request-modifiers-computed.sub.html b/tests/wpt/tests/css/css-values/urls/url-request-modifiers-computed.sub.html new file mode 100644 index 00000000000..bc8c4ad95df --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/url-request-modifiers-computed.sub.html @@ -0,0 +1,45 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#request-url-modifiers"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/computed-testcommon.js"></script> +<div id="container" style="font-size: 20"> + <div id="target"></div> +</div> +<script> + +// No modifiers +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png")'); + +// <crossorigin-modifier> = crossorigin(anonymous | use-credentials) +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(use-credentials))'); + +// <integrity-modifier> = integrity(<string>) +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar"))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity(""))'); + +// <referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url) +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer-when-downgrade))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(same-origin))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(origin))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(strict-origin))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(origin-when-cross-origin))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(strict-origin-when-cross-origin))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(unsafe-url))'); + +// Multiple modifiers +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar"))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") crossorigin(anonymous))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar"))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) integrity("sha384-foobar"))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) referrerpolicy(no-referrer))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) crossorigin(anonymous))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) referrerpolicy(no-referrer))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") referrerpolicy(no-referrer) crossorigin(anonymous))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) crossorigin(anonymous) integrity("sha384-foobar"))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_computed_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) integrity("sha384-foobar") crossorigin(anonymous))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar") referrerpolicy(no-referrer))'); + +</script> diff --git a/tests/wpt/tests/css/css-values/urls/url-request-modifiers-invalid.sub.html b/tests/wpt/tests/css/css-values/urls/url-request-modifiers-invalid.sub.html new file mode 100644 index 00000000000..c30edfbaeaa --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/url-request-modifiers-invalid.sub.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#request-url-modifiers"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/parsing-testcommon.js"></script> +<script> + +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin())'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(,))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous,))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(,anonymous))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous foobar))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) cross-origin(anonymous))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) cross-origin(use-credentials))'); +test_invalid_value('background-image', 'url(crossorigin(anonymous) "http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png")'); +test_invalid_value('background-image', '"http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous)'); + +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity())'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity(,))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar",))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity(,"sha384-foobar"))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar" foobar))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity(sha384-foobar))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") integrity("sha384-foobar"))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") integrity("sha384-barbaz"))'); +test_invalid_value('background-image', 'url(integrity("sha384-foobar") "http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png")'); +test_invalid_value('background-image', '"http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar")'); + +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy())'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(,))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer,))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(,no-referrer))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer foobar))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer same-origin))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) referrerpolicy(no-referrer))'); +test_invalid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) referrerpolicy(same-origin))'); +test_invalid_value('background-image', 'url(referrerpolicy(no-referrer) "http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png")'); +test_invalid_value('background-image', '"http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer)'); + +</script> diff --git a/tests/wpt/tests/css/css-values/urls/url-request-modifiers-serialize.sub.html b/tests/wpt/tests/css/css-values/urls/url-request-modifiers-serialize.sub.html new file mode 100644 index 00000000000..cca9f2ccf9b --- /dev/null +++ b/tests/wpt/tests/css/css-values/urls/url-request-modifiers-serialize.sub.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-values-5/#request-url-modifiers"> +<link rel="author" title="Sam Weinig" href="mailto:weinig@webkit.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/parsing-testcommon.js"></script> +<div id=target></div> +<script> + +// No modifiers +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png")'); + +// <crossorigin-modifier> = crossorigin(anonymous | use-credentials) +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(use-credentials))'); + +// <integrity-modifier> = integrity(<string>) +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar"))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity(""))'); + +// <referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url) +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer-when-downgrade))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(same-origin))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(origin))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(strict-origin))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(origin-when-cross-origin))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(strict-origin-when-cross-origin))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(unsafe-url))'); + +// Multiple modifiers +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar"))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") crossorigin(anonymous))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar"))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) integrity("sha384-foobar"))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) referrerpolicy(no-referrer))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) crossorigin(anonymous))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) referrerpolicy(no-referrer))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" integrity("sha384-foobar") referrerpolicy(no-referrer) crossorigin(anonymous))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) crossorigin(anonymous) integrity("sha384-foobar"))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar") referrerpolicy(no-referrer))'); +test_valid_value('background-image', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" referrerpolicy(no-referrer) integrity("sha384-foobar") crossorigin(anonymous))', 'url("http://{{hosts[][]}}:{{ports[http][0]}}/css/support/1x1-green.png" crossorigin(anonymous) integrity("sha384-foobar") referrerpolicy(no-referrer))'); + +</script> |
