diff options
Diffstat (limited to 'testing/web-platform/tests/svg/geometry')
47 files changed, 1358 insertions, 0 deletions
diff --git a/testing/web-platform/tests/svg/geometry/inheritance.svg b/testing/web-platform/tests/svg/geometry/inheritance.svg new file mode 100644 index 0000000000..760328ac31 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/inheritance.svg @@ -0,0 +1,28 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>Inheritance of geometry properties</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <h:meta name="assert" content="None of the geometry properties inherit."/> + <h:meta name="assert" content="Properties have initial values according to spec."/> + </metadata> + <g id="container"> + <g id="target"></g> + </g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/inheritance-testcommon.js"/> + <script><![CDATA[ + +assert_not_inherited('cx', '0px', '-10px'); +assert_not_inherited('cy', '0px', '-10px'); +assert_not_inherited('r', '0px', '10px'); +assert_not_inherited('rx', 'auto', '10px'); +assert_not_inherited('ry', 'auto', '10px'); +assert_not_inherited('x', '0px', '-10px'); +assert_not_inherited('y', '0px', '-10px'); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/cx-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/cx-computed.svg new file mode 100644 index 0000000000..c349a6b97c --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/cx-computed.svg @@ -0,0 +1,28 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: getComputedStyle().cx</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#CX"/> + </metadata> + <g id="target"></g> + <style> + #target { + font-size: 40px; + } + </style> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/computed-testcommon.js"/> + <script><![CDATA[ + +test_computed_value("cx", "-10px"); +test_computed_value("cx", "0.5em", "20px"); +test_computed_value("cx", "calc(10px + 0.5em)", "30px"); +test_computed_value("cx", "calc(10px - 0.5em)", "-10px"); +test_computed_value("cx", "40%"); +test_computed_value("cx", "calc(50% + 60px)"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/cx-invalid.svg b/testing/web-platform/tests/svg/geometry/parsing/cx-invalid.svg new file mode 100644 index 0000000000..4b1b90158f --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/cx-invalid.svg @@ -0,0 +1,21 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing cx with invalid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#CX"/> + <h:meta name="assert" content="cx supports only the grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_invalid_value("cx", "10"); +test_invalid_value("cx", "auto"); +test_invalid_value("cx", "10px 20px"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/cx-valid.svg b/testing/web-platform/tests/svg/geometry/parsing/cx-valid.svg new file mode 100644 index 0000000000..a96fee5655 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/cx-valid.svg @@ -0,0 +1,23 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing cx with valid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#CX"/> + <h:meta name="assert" content="cx supports the full grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_valid_value("cx", "0", "0px"); +test_valid_value("cx", "-1px"); +test_valid_value("cx", "calc(2em + 3ex)"); +test_valid_value("cx", "4%"); +test_valid_value("cx", "5ch"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/cy-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/cy-computed.svg new file mode 100644 index 0000000000..a37c99560b --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/cy-computed.svg @@ -0,0 +1,28 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: getComputedStyle().cy</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#CY"/> + </metadata> + <g id="target"></g> + <style> + #target { + font-size: 40px; + } + </style> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/computed-testcommon.js"/> + <script><![CDATA[ + +test_computed_value("cy", "-10px"); +test_computed_value("cy", "0.5em", "20px"); +test_computed_value("cy", "calc(10px + 0.5em)", "30px"); +test_computed_value("cy", "calc(10px - 0.5em)", "-10px"); +test_computed_value("cy", "40%"); +test_computed_value("cy", "calc(50% + 60px)"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/cy-invalid.svg b/testing/web-platform/tests/svg/geometry/parsing/cy-invalid.svg new file mode 100644 index 0000000000..528eed02ce --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/cy-invalid.svg @@ -0,0 +1,21 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing cy with invalid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#CY"/> + <h:meta name="assert" content="cy supports only the grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_invalid_value("cy", "10"); +test_invalid_value("cy", "auto"); +test_invalid_value("cy", "10px 20px"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/cy-valid.svg b/testing/web-platform/tests/svg/geometry/parsing/cy-valid.svg new file mode 100644 index 0000000000..022445662b --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/cy-valid.svg @@ -0,0 +1,23 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing cy with valid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#CY"/> + <h:meta name="assert" content="cy supports the full grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_valid_value("cy", "0", "0px"); +test_valid_value("cy", "-1px"); +test_valid_value("cy", "calc(2em + 3ex)"); +test_valid_value("cy", "4%"); +test_valid_value("cy", "5rem"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/height-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/height-computed.svg new file mode 100644 index 0000000000..bcc1f9d0e1 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/height-computed.svg @@ -0,0 +1,130 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>SVG Geometry Properties: getComputedStyle().height</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#Sizing"/> + <h:link rel="help" href="https://drafts.csswg.org/cssom/#resolved-values"/> + </metadata> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <svg width="200" height="100" id="test-content"> + <rect/> + <rect width="100" height="200"/> + <rect width="42" style="height: auto"/> + <rect width="42" style="height: 20px"/> + <rect width="42" style="height: 40%"/> + <rect width="42" style="height: 80%; display: none"/> + + <g><rect width="100" height="100"/></g> + <g width="100" height="42px"><rect width="100" height="100"/></g> + <g style="width: 10%; height: auto"><rect width="100" height="100"/></g> + <g style="width: auto; height: 20px"><rect width="100" height="100"/></g> + <g style="width: 20px; height: 10%"><rect width="100" height="100"/></g> + + <image/> + <image width="42" height="200"/> + <image width="42" style="height: auto"/> + <image width="42" style="height: 230px"/> + <image width="42" style="height: 25%"/> + <image width="42" style="height: 25%; display: none"/> + + <foreignObject>Some content</foreignObject> + <foreignObject height="200">Some content</foreignObject> + <foreignObject style="height: auto">Some content</foreignObject> + <foreignObject style="height: 75px">Some content</foreignObject> + <foreignObject style="height: 50%">Some content</foreignObject> + <foreignObject style="height: auto; display: none">Some content</foreignObject> + + <svg/> + <svg height="200"/> + <svg style="height: auto"/> + <svg style="height: 200px"/> + <svg style="height: 50%"/> + <svg style="height: auto; display: none"/> + + <text>Text1</text> + <text width="100px" height="42">Text2</text> + <text style="width: 30%; height: auto">Text3</text> + <text style="width: auto; height: 20px">Text3</text> + <text style="width: 20px; height: 30%">Text3</text> + </svg> + <script><![CDATA[ +[ + // Cases where computed 'height' return the used value. + { + element: 'rect', + expected: [ + { value: '0px', description: 'initial' }, + { value: '200px', description: 'presentation attribute' }, + { value: '0px', description: 'inline style (auto)' }, + { value: '20px', description: 'inline style (pixels)' }, + { value: '40px', description: 'inline style (percentage)' }, + { value: '80%', description: 'inline style but "display: none"' }, + ] + }, + { + element: 'image', + expected: [ + { value: '0px', description: 'initial' }, + { value: '200px', description: 'presentation attribute' }, + { value: '0px', description: 'inline style (auto)' }, + { value: '230px', description: 'inline style (pixels)' }, + { value: '25px', description: 'inline style (percentage)' }, + { value: '25%', description: 'inline style but "display: none"' }, + ] + }, + { + element: 'foreignObject', + expected: [ + { value: '0px', description: 'initial' }, + { value: '200px', description: 'presentation attribute' }, + { value: '0px', description: 'inline style (auto)' }, + { value: '75px', description: 'inline style (pixels)' }, + { value: '50px', description: 'inline style (percentage)' }, + { value: 'auto', description: 'inline style but "display: none"' }, + ] + }, + { + element: 'svg', + expected: [ + { value: '100px', description: 'initial' }, + { value: '200px', description: 'presentation attribute' }, + { value: '100px', description: 'inline style (auto)' }, + { value: '200px', description: 'inline style (pixels)' }, + { value: '50px', description: 'inline style (percentage)' }, + { value: 'auto', description: 'inline style but "display: none"' }, + ] + }, + + // Cases where computed 'height' return the computed value. + { + element: 'g', + expected: [ + { value: 'auto', description: 'initial' }, + { value: 'auto', description: 'initial (with dummy attribute)' }, + { value: 'auto', description: 'inline style (auto)' }, + { value: '20px', description: 'inline style (pixels)' }, + { value: '10%', description: 'inline style (percentage)' }, + ] + }, + { + element: 'text', + expected: [ + { value: 'auto', description: 'initial' }, + { value: 'auto', description: 'initial (with dummy attribute)' }, + { value: 'auto', description: 'inline style (auto)' }, + { value: '20px', description: 'inline style (pixels)' }, + { value: '30%', description: 'inline style (percentage)' }, + ] + }, +].forEach(function(entry) { + let element_set = document.querySelectorAll('#test-content > ' + entry.element); + entry.expected.forEach(function(expected, index) { + test(function() { + let style = getComputedStyle(element_set[index]); + assert_equals(style.height, expected.value, expected.description); + }, document.title + ', <' + entry.element + '> ' + expected.description); + }); +}); + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/r-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/r-computed.svg new file mode 100644 index 0000000000..ac897cd91a --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/r-computed.svg @@ -0,0 +1,28 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: getComputedStyle().r</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#R"/> + </metadata> + <g id="target"></g> + <style> + #target { + font-size: 40px; + } + </style> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/computed-testcommon.js"/> + <script><![CDATA[ + +test_computed_value("r", "10px"); +test_computed_value("r", "0.5em", "20px"); +test_computed_value("r", "calc(10px + 0.5em)", "30px"); +test_computed_value("r", "calc(10px - 0.5em)", "0px"); +test_computed_value("r", "40%"); +test_computed_value("r", "calc(50% + 60px)"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/r-invalid.svg b/testing/web-platform/tests/svg/geometry/parsing/r-invalid.svg new file mode 100644 index 0000000000..a14c52266c --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/r-invalid.svg @@ -0,0 +1,23 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing r with invalid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#R"/> + <h:meta name="assert" content="r supports only the grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_invalid_value("r", "10"); +test_invalid_value("r", "auto"); +test_invalid_value("r", "10px 20px"); +test_invalid_value("r", "-1px"); +test_invalid_value("r", "-10%"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/r-valid.svg b/testing/web-platform/tests/svg/geometry/parsing/r-valid.svg new file mode 100644 index 0000000000..70cd5503b7 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/r-valid.svg @@ -0,0 +1,23 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing r with valid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#R"/> + <h:meta name="assert" content="r supports the full grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_valid_value("r", "0", "0px"); +test_valid_value("r", "1px"); +test_valid_value("r", "calc(2em + 3ex)"); +test_valid_value("r", "4%"); +test_valid_value("r", "5vmin"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/rx-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/rx-computed.svg new file mode 100644 index 0000000000..c07368b5f2 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/rx-computed.svg @@ -0,0 +1,30 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: getComputedStyle().rx</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#RX"/> + </metadata> + <g id="target"></g> + <style> + #target { + font-size: 40px; + } + </style> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/computed-testcommon.js"/> + <script><![CDATA[ + +test_computed_value("rx", "auto"); + +test_computed_value("rx", "10px"); +test_computed_value("rx", "0.5em", "20px"); +test_computed_value("rx", "calc(10px + 0.5em)", "30px"); +test_computed_value("rx", "calc(10px - 0.5em)", "0px"); +test_computed_value("rx", "40%"); +test_computed_value("rx", "calc(50% + 60px)"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/rx-invalid.svg b/testing/web-platform/tests/svg/geometry/parsing/rx-invalid.svg new file mode 100644 index 0000000000..9ce0603bea --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/rx-invalid.svg @@ -0,0 +1,22 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing rx with invalid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#RX"/> + <h:meta name="assert" content="rx supports only the grammar '<length-percentage> | auto'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_invalid_value("rx", "10"); +test_invalid_value("rx", "none"); +test_invalid_value("rx", "10px 20px"); +test_invalid_value("rx", "-1px"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/rx-valid.svg b/testing/web-platform/tests/svg/geometry/parsing/rx-valid.svg new file mode 100644 index 0000000000..9d156b3ccc --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/rx-valid.svg @@ -0,0 +1,25 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing rx with valid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#RX"/> + <h:meta name="assert" content="rx supports the full grammar '<length-percentage> | auto'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_valid_value("rx", "auto"); + +test_valid_value("rx", "0", "0px"); +test_valid_value("rx", "1px"); +test_valid_value("rx", "calc(2em + 3ex)"); +test_valid_value("rx", "4%"); +test_valid_value("rx", "5vw"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/ry-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/ry-computed.svg new file mode 100644 index 0000000000..8e54bd219d --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/ry-computed.svg @@ -0,0 +1,30 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: getComputedStyle().ry</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#RY"/> + </metadata> + <g id="target"></g> + <style> + #target { + font-size: 40px; + } + </style> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/computed-testcommon.js"/> + <script><![CDATA[ + +test_computed_value("ry", "auto"); + +test_computed_value("ry", "10px"); +test_computed_value("ry", "0.5em", "20px"); +test_computed_value("ry", "calc(10px + 0.5em)", "30px"); +test_computed_value("ry", "calc(10px - 0.5em)", "0px"); +test_computed_value("ry", "40%"); +test_computed_value("ry", "calc(50% + 60px)"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/ry-invalid.svg b/testing/web-platform/tests/svg/geometry/parsing/ry-invalid.svg new file mode 100644 index 0000000000..5938ae830d --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/ry-invalid.svg @@ -0,0 +1,22 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing ry with invalid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#RY"/> + <h:meta name="assert" content="ry supports only the grammar '<length-percentage> | auto'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_invalid_value("ry", "10"); +test_invalid_value("ry", "none"); +test_invalid_value("ry", "10px 20px"); +test_invalid_value("ry", "-1px"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/ry-valid.svg b/testing/web-platform/tests/svg/geometry/parsing/ry-valid.svg new file mode 100644 index 0000000000..178c0c007d --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/ry-valid.svg @@ -0,0 +1,25 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing ry with valid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#RY"/> + <h:meta name="assert" content="ry supports the full grammar '<length-percentage> | auto'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_valid_value("ry", "auto"); + +test_valid_value("ry", "0", "0px"); +test_valid_value("ry", "1px"); +test_valid_value("ry", "calc(2em + 3ex)"); +test_valid_value("ry", "4%"); +test_valid_value("ry", "5vh"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/sizing-properties-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/sizing-properties-computed.svg new file mode 100644 index 0000000000..01713fbbe2 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/sizing-properties-computed.svg @@ -0,0 +1,56 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="800px"> + <title>SVG Geometry Properties: getComputedStyle().width</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#Sizing"/> + <h:link rel="help" href="https://drafts.csswg.org/css-sizing-3/#preferred-size-properties"/> + <h:link rel="help" href="https://drafts.csswg.org/cssom/#resolved-values"/> + </metadata> + <rect id="target"></rect> + <style> + #target { + font-size: 40px; + } + </style> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/computed-testcommon.js"/> + <script><![CDATA[ + +test_computed_value("width", "10px"); +test_computed_value("width", "0.5em", "20px"); +test_computed_value("width", "calc(10px + 0.5em)", "30px"); +test_computed_value("width", "calc(10px - 0.5em)", "0px"); +test_computed_value("width", "40%", "320px"); +test_computed_value("width", "calc(50% + 1.5em)", "460px"); + +test_computed_value("height", "10px"); +test_computed_value("height", "0.5em", "20px"); +test_computed_value("height", "calc(10px + 0.5em)", "30px"); +test_computed_value("height", "calc(10px - 0.5em)", "0px"); +test_computed_value("height", "40%", "320px"); +test_computed_value("height", "calc(50% + 1.5em)", "460px"); + +test(() => { + const target = document.getElementById('target'); + target.style.width = 'calc(50% + 1.5em)'; + target.style.display = 'none'; + assert_equals(getComputedStyle(target).width, 'calc(50% + 60px)'); + target.style.width = ''; + target.style.display = ''; +}, "resolved value is computed value when display is none"); + +test(() => { + const target = document.getElementById('target'); + target.style.height = 'calc(50% + 1.5em)'; + target.style.display = 'none'; + assert_equals(getComputedStyle(target).height, 'calc(50% + 60px)'); + target.style.height = ''; + target.style.display = ''; +}, "resolved value is computed value when display is contents"); + + ]]></script> +} +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/width-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/width-computed.svg new file mode 100644 index 0000000000..1af3de1234 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/width-computed.svg @@ -0,0 +1,130 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>SVG Geometry Properties: getComputedStyle().width</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#Sizing"/> + <h:link rel="help" href="https://drafts.csswg.org/cssom/#resolved-values"/> + </metadata> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <svg width="200" height="100" id="test-content"> + <rect/> + <rect width="100" height="200"/> + <rect height="42" style="width: 40%"/> + <rect height="42" style="width: auto"/> + <rect height="42" style="width: 20px"/> + <rect height="42" style="width: 42%; display: none"/> + + <g><rect width="100" height="100"/></g> + <g width="100" height="42px"><rect width="100" height="100"/></g> + <g style="width: 10%; height: auto"><rect width="100" height="100"/></g> + <g style="width: auto; height: 20px"><rect width="100" height="100"/></g> + <g style="width: 20px; height: 10%"><rect width="100" height="100"/></g> + + <image/> + <image width="100"/> + <image height="42" style="width: 25%"/> + <image height="42" style="width: auto"/> + <image height="42" style="width: 230px"/> + <image height="42" style="width: 25%; display: none"/> + + <foreignObject>Some content</foreignObject> + <foreignObject width="100">Some content</foreignObject> + <foreignObject style="width: 50%">Some content</foreignObject> + <foreignObject style="width: auto">Some content</foreignObject> + <foreignObject style="width: 75px">Some content</foreignObject> + <foreignObject style="width: auto; display: none">Some content</foreignObject> + + <svg/> + <svg width="100"/> + <svg style="width: auto"/> + <svg style="width: 200px"/> + <svg style="width: 50%"/> + <svg style="width: auto; display: none"/> + + <text>Text1</text> + <text width="100px" height="42">Text2</text> + <text style="width: 30%; height: auto">Text3</text> + <text style="width: auto; height: 20px">Text3</text> + <text style="width: 20px; height: 30%">Text3</text> + </svg> + <script><![CDATA[ +[ + // Cases where computed 'width' return the used value. + { + element: 'rect', + expected: [ + { value: '0px', description: 'initial' }, + { value: '100px', description: 'presentation attribute' }, + { value: '80px', description: 'inline style (percentage)' }, + { value: '0px', description: 'inline style (auto)' }, + { value: '20px', description: 'inline style (pixels)' }, + { value: '42%', description: 'inline style but "display: none"' }, + ] + }, + { + element: 'image', + expected: [ + { value: '0px', description: 'initial' }, + { value: '100px', description: 'presentation attribute' }, + { value: '50px', description: 'inline style (percentage)' }, + { value: '0px', description: 'inline style (auto)' }, + { value: '230px', description: 'inline style (pixels)' }, + { value: '25%', description: 'inline style but "display: none"' }, + ] + }, + { + element: 'foreignObject', + expected: [ + { value: '0px', description: 'initial' }, + { value: '100px', description: 'presentation attribute' }, + { value: '100px', description: 'inline style (percentage)' }, + { value: '0px', description: 'inline style (auto)' }, + { value: '75px', description: 'inline style (pixels)' }, + { value: 'auto', description: 'inline style but "display: none"' }, + ] + }, + { + element: 'svg', + expected: [ + { value: '200px', description: 'initial' }, + { value: '100px', description: 'presentation attribute' }, + { value: '200px', description: 'inline style (auto)' }, + { value: '200px', description: 'inline style (pixels)' }, + { value: '100px', description: 'inline style (percentage)' }, + { value: 'auto', description: 'inline style but "display: none"' }, + ] + }, + + // Cases where computed 'width' return the computed value. + { + element: 'g', + expected: [ + { value: 'auto', description: 'initial' }, + { value: 'auto', description: 'initial (with dummy attribute)' }, + { value: '10%', description: 'inline style (percentage)' }, + { value: 'auto', description: 'inline style (auto)' }, + { value: '20px', description: 'inline style (pixels)' }, + ] + }, + { + element: 'text', + expected: [ + { value: 'auto', description: 'initial' }, + { value: 'auto', description: 'initial (with dummy attribute)' }, + { value: '30%', description: 'inline style (percentage)' }, + { value: 'auto', description: 'inline style (auto)' }, + { value: '20px', description: 'inline style (pixels)' }, + ] + }, +].forEach(function(entry) { + let element_set = document.querySelectorAll('#test-content > ' + entry.element); + entry.expected.forEach(function(expected, index) { + test(function() { + let style = getComputedStyle(element_set[index]); + assert_equals(style.width, expected.value, expected.description); + }, document.title + ', <' + entry.element + '> ' + expected.description); + }); +}); + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/x-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/x-computed.svg new file mode 100644 index 0000000000..458c343814 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/x-computed.svg @@ -0,0 +1,28 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: getComputedStyle().x</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#X"/> + </metadata> + <g id="target"></g> + <style> + #target { + font-size: 40px; + } + </style> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/computed-testcommon.js"/> + <script><![CDATA[ + +test_computed_value("x", "-10px"); +test_computed_value("x", "0.5em", "20px"); +test_computed_value("x", "calc(10px + 0.5em)", "30px"); +test_computed_value("x", "calc(10px - 0.5em)", "-10px"); +test_computed_value("x", "40%"); +test_computed_value("x", "calc(50% + 60px)"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/x-invalid.svg b/testing/web-platform/tests/svg/geometry/parsing/x-invalid.svg new file mode 100644 index 0000000000..31ad29524e --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/x-invalid.svg @@ -0,0 +1,21 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing x with invalid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#X"/> + <h:meta name="assert" content="x supports only the grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_invalid_value("x", "10"); +test_invalid_value("x", "auto"); +test_invalid_value("x", "10px 20px"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/x-valid.svg b/testing/web-platform/tests/svg/geometry/parsing/x-valid.svg new file mode 100644 index 0000000000..2b06f26ac4 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/x-valid.svg @@ -0,0 +1,23 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing x with valid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#X"/> + <h:meta name="assert" content="x supports the full grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_valid_value("x", "0", "0px"); +test_valid_value("x", "-1px"); +test_valid_value("x", "calc(2em + 3ex)"); +test_valid_value("x", "4%"); +test_valid_value("x", "5cm"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/y-computed.svg b/testing/web-platform/tests/svg/geometry/parsing/y-computed.svg new file mode 100644 index 0000000000..c3dc874215 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/y-computed.svg @@ -0,0 +1,28 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: getComputedStyle().y</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#Y"/> + </metadata> + <g id="target"></g> + <style> + #target { + font-size: 40px; + } + </style> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/computed-testcommon.js"/> + <script><![CDATA[ + +test_computed_value("y", "-10px"); +test_computed_value("y", "0.5em", "20px"); +test_computed_value("y", "calc(10px + 0.5em)", "30px"); +test_computed_value("y", "calc(10px - 0.5em)", "-10px"); +test_computed_value("y", "40%"); +test_computed_value("y", "calc(50% + 60px)"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/y-invalid.svg b/testing/web-platform/tests/svg/geometry/parsing/y-invalid.svg new file mode 100644 index 0000000000..d6ea944dbd --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/y-invalid.svg @@ -0,0 +1,21 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing y with invalid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#Y"/> + <h:meta name="assert" content="y supports only the grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_invalid_value("y", "10"); +test_invalid_value("y", "auto"); +test_invalid_value("y", "10px 20px"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/parsing/y-valid.svg b/testing/web-platform/tests/svg/geometry/parsing/y-valid.svg new file mode 100644 index 0000000000..aad0e4e293 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/parsing/y-valid.svg @@ -0,0 +1,23 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" + width="800px" height="8000px"> + <title>SVG Geometry Properties: parsing y with valid values</title> + <metadata> + <h:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html#Y"/> + <h:meta name="assert" content="y supports the full grammar '<length-percentage>'."/> + </metadata> + <g id="target"></g> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <h:script src="/css/support/parsing-testcommon.js"/> + <script><![CDATA[ + +test_valid_value("y", "0", "0px"); +test_valid_value("y", "-1px"); +test_valid_value("y", "calc(2em + 3ex)"); +test_valid_value("y", "4%"); +test_valid_value("y", "5mm"); + + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/circle-001.svg b/testing/web-platform/tests/svg/geometry/reftests/circle-001.svg new file mode 100644 index 0000000000..2fbd70d5a6 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/circle-001.svg @@ -0,0 +1,16 @@ +<svg width="340" height="140" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Circle coordinates and radius specified by properties</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="circle-ref.svg" /> + <style> + circle { + cx: 204px; + cy: 56px; + r: 65px; + fill: blue; + } + </style> + <circle /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/circle-002.svg b/testing/web-platform/tests/svg/geometry/reftests/circle-002.svg new file mode 100644 index 0000000000..7f98f56ad0 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/circle-002.svg @@ -0,0 +1,16 @@ +<svg width="340" height="140" viewBox="60000 70000 3400 1400" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Circle coordinates and radius specified in user units</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="circle-ref.svg" /> + <style> + circle { + cx: 62040px; + cy: 70560px; + r: 650px; + fill: blue; + } + </style> + <circle /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/circle-003.svg b/testing/web-platform/tests/svg/geometry/reftests/circle-003.svg new file mode 100644 index 0000000000..74c32fb33c --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/circle-003.svg @@ -0,0 +1,16 @@ +<svg width="340" height="140" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Circle coordinates and radius specified by percentage</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="circle-ref.svg" /> + <style> + circle { + cx: 60%; /* 60% of width 340 */ + cy: 40%; /* 40% of height 140 */ + r: 25%; /* 25% of normalized diagonal 260 */ + fill: blue; + } + </style> + <circle /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/circle-004.svg b/testing/web-platform/tests/svg/geometry/reftests/circle-004.svg new file mode 100644 index 0000000000..36c9e0096f --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/circle-004.svg @@ -0,0 +1,15 @@ +<svg width="340" height="140" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Circle coordinates and radius specified using calc</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="circle-ref.svg" /> + <style> + circle { + fill: blue; + font-size: 40px; + } + </style> + <circle cx="calc(80px + 60% - 2em)" cy="calc(80px + 40% - 2em)" + r="calc(5 * 5%)" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/circle-005.svg b/testing/web-platform/tests/svg/geometry/reftests/circle-005.svg new file mode 100644 index 0000000000..2d1fbf92aa --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/circle-005.svg @@ -0,0 +1,24 @@ +<svg width="340" height="140" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Circle coordinates and radius specified by properties</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1683652"/> + <html:link rel="match" href="circle-ref.svg"/> + <style> + circle { + cx: 204px; + cy: 56px; + r: 5px; + fill: blue; + } + </style> + <circle /> + <script><![CDATA[ + let circle = document.querySelector("circle"); + circle.parentNode.style.display = "none"; + circle.getTotalLength(); + circle.parentNode.style.display = ""; + circle.style.r = "65px"; + ]]></script> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/circle-ref.svg b/testing/web-platform/tests/svg/geometry/reftests/circle-ref.svg new file mode 100644 index 0000000000..36ccde7fce --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/circle-ref.svg @@ -0,0 +1,4 @@ +<svg width="340" height="140" + xmlns="http://www.w3.org/2000/svg"> + <circle cx="204" cy="56" r="65" fill="blue" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/ellipse-001.svg b/testing/web-platform/tests/svg/geometry/reftests/ellipse-001.svg new file mode 100644 index 0000000000..e6d394de20 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-001.svg @@ -0,0 +1,17 @@ +<svg width="300" height="200" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Ellipse coordinates and radii specified by properties</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="ellipse-ref.svg" /> + <style> + ellipse { + cx: 75px; + cy: 120px; + rx: 60px; + ry: 50px; + fill: blue; + } + </style> + <ellipse /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/ellipse-002.svg b/testing/web-platform/tests/svg/geometry/reftests/ellipse-002.svg new file mode 100644 index 0000000000..081617288a --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-002.svg @@ -0,0 +1,17 @@ +<svg width="300" height="200" viewBox="6000 7000 600 400" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Ellipse coordinates and radii specified in user units</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="ellipse-ref.svg" /> + <style> + ellipse { + cx: 6150px; + cy: 7240px; + rx: 120px; + ry: 100px; + fill: blue; + } + </style> + <ellipse /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/ellipse-003.svg b/testing/web-platform/tests/svg/geometry/reftests/ellipse-003.svg new file mode 100644 index 0000000000..6b81eadf1b --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-003.svg @@ -0,0 +1,17 @@ +<svg width="300" height="200" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Ellipse coordinates and radii specified by percentage</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="ellipse-ref.svg" /> + <style> + ellipse { + cx: 25%; + cy: 60%; + rx: 20%; + ry: 25%; + fill: blue; + } + </style> + <ellipse /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/ellipse-004.svg b/testing/web-platform/tests/svg/geometry/reftests/ellipse-004.svg new file mode 100644 index 0000000000..1c6b132cd6 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-004.svg @@ -0,0 +1,15 @@ +<svg width="300" height="200" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Ellipse coordinates and radii specified using calc</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="ellipse-ref.svg" /> + <style> + ellipse { + fill: blue; + font-size: 40px; + } + </style> + <ellipse cx="calc(80px + 25% - 2em)" cy="calc(80px + 60% - 2em)" + rx="calc(4 * 5%)" ry="calc(5 * 5%)" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/ellipse-ref.svg b/testing/web-platform/tests/svg/geometry/reftests/ellipse-ref.svg new file mode 100644 index 0000000000..57e6f4d5e8 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-ref.svg @@ -0,0 +1,4 @@ +<svg width="300" height="200" + xmlns="http://www.w3.org/2000/svg"> + <ellipse cx="75" cy="120" rx="60" ry="50" fill="blue" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/percentage-attribute.svg b/testing/web-platform/tests/svg/geometry/reftests/percentage-attribute.svg new file mode 100644 index 0000000000..44c386d517 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/percentage-attribute.svg @@ -0,0 +1,21 @@ +<?xml version="1.0" encoding="utf-8"?> +<svg id="svg-root" + width="310" height="170" viewBox="0, 0, 620, 340" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Percentages in shapes</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="percentage-ref.svg" /> + + <style> + svg { + fill: none; + stroke-width: 30px; + } + </style> + + <circle cx="70%" cy="60%" r="50%" stroke="cyan" /> + <ellipse cx="40%" cy="30%" rx="10%" ry="20%" stroke="green" /> + <rect x="10%" y="20%" width="70%" height="60%" stroke="blue" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/percentage-ref.svg b/testing/web-platform/tests/svg/geometry/reftests/percentage-ref.svg new file mode 100644 index 0000000000..09fd10f287 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/percentage-ref.svg @@ -0,0 +1,18 @@ +<?xml version="1.0" encoding="utf-8"?> +<svg id="svg-root" + width="310" height="170" viewBox="0, 0, 620, 340" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + + <style> + svg { + fill: none; + stroke-width: 30px; + } + </style> + + <circle cx="434" cy="204" r="250" stroke="cyan" /> + <ellipse cx="248" cy="102" rx="62" ry="68" stroke="green" /> + <rect x="62" y="68" width="434" height="204" stroke="blue" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/percentage.svg b/testing/web-platform/tests/svg/geometry/reftests/percentage.svg new file mode 100644 index 0000000000..c2ca49341c --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/percentage.svg @@ -0,0 +1,38 @@ +<?xml version="1.0" encoding="utf-8"?> +<svg id="svg-root" + width="310" height="170" viewBox="0, 0, 620, 340" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Percentages in shapes</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="percentage-ref.svg" /> + + <style> + svg { + fill: none; + stroke-width: 30px; + } + circle { + cx: 70%; + cy: 60%; + r: 50%; + } + ellipse { + cx: 40%; + cy: 30%; + rx: 10%; + ry: 20%; + } + rect { + x: 10%; + y: 20%; + width: 70%; + height: 60%; + } + </style> + + <circle stroke="cyan" /> + <ellipse stroke="green" /> + <rect stroke="blue" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/rect-001.svg b/testing/web-platform/tests/svg/geometry/reftests/rect-001.svg new file mode 100644 index 0000000000..020e499dc2 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/rect-001.svg @@ -0,0 +1,17 @@ +<svg width="300" height="200" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Rectangle coordinates and sizes specified by properties</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="rect-ref.svg" /> + <style> + rect { + x: 30px; + y: 60px; + width: 120px; + height: 100px; + fill: blue; + } + </style> + <rect /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/rect-002.svg b/testing/web-platform/tests/svg/geometry/reftests/rect-002.svg new file mode 100644 index 0000000000..e9b27db7e6 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/rect-002.svg @@ -0,0 +1,17 @@ +<svg width="300" height="200" viewBox="600 700 150 100" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Rectangle coordinates and sizes specified in user units</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="rect-ref.svg" /> + <style> + rect { + x: 615px; + y: 730px; + width: 60px; + height: 50px; + fill: blue; + } + </style> + <rect /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/rect-003.svg b/testing/web-platform/tests/svg/geometry/reftests/rect-003.svg new file mode 100644 index 0000000000..d3d7c5abb4 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/rect-003.svg @@ -0,0 +1,17 @@ +<svg width="300" height="200" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Rectangle coordinates and sizes specified by percentage</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="rect-ref.svg" /> + <style> + rect { + x: 10%; + y: 30%; + width: 40%; + height: 50%; + fill: blue; + } + </style> + <rect /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/rect-004.svg b/testing/web-platform/tests/svg/geometry/reftests/rect-004.svg new file mode 100644 index 0000000000..926b2a8e0a --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/rect-004.svg @@ -0,0 +1,15 @@ +<svg width="300" height="200" + xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Rectangle coordinates and sizes specified using calc</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="rect-ref.svg" /> + <style> + rect { + fill: blue; + font-size: 40px; + } + </style> + <rect x="calc(80px + 10% - 2em)" y="calc(80px + 30% - 2em)" + width="calc(8 * 5%)" height="calc(10 * 5%)" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/reftests/rect-ref.svg b/testing/web-platform/tests/svg/geometry/reftests/rect-ref.svg new file mode 100644 index 0000000000..ddfd51eed1 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/reftests/rect-ref.svg @@ -0,0 +1,4 @@ +<svg width="300" height="200" + xmlns="http://www.w3.org/2000/svg"> + <rect x="30" y="60" width="120" height="100" fill="blue" /> +</svg> diff --git a/testing/web-platform/tests/svg/geometry/svg-baseval-in-display-none.html b/testing/web-platform/tests/svg/geometry/svg-baseval-in-display-none.html new file mode 100644 index 0000000000..fa52d1b4c3 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/svg-baseval-in-display-none.html @@ -0,0 +1,67 @@ +<!DOCTYPE html> +<title>baseVal in symbol and other display:none</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<link rel="help" href="https://svgwg.org/svg2-draft/types.html#InterfaceSVGAnimatedLength"/> +<link rel="help" href="https://svgwg.org/svg2-draft/types.html#__svg__SVGAnimatedLength__baseVal"/> +<svg width="0" height="0"> + <svg width="600" height="400" font-size="5"> + <symbol width="40em" height="20em"> + <g font-size="10px"> + <rect id="r1" x="5em" y="6em" width="20%" height="30%" /> + <circle id="c1" cx="5em" cy="6em" r="10em" /> + </g> + </symbol> + <g font-size="10px" style="display:none"> + <rect id="r2" x="5em" y="6em" width="20%" height="30%" /> + <circle id="c2" cx="5em" cy="6em" r="10em" /> + </g> + </svg> +</svg> +<script> + let r1 = document.getElementById("r1"), + c1 = document.getElementById("c1"), + r2 = document.getElementById("r2"), + c2 = document.getElementById("c2"); + + const assertBaseVal = (length, expected, info) => { + assert_equals(length.baseVal.value, expected, info); + }; + + let tEm = async_test("With em"); + let tEmDone = tEm.step_func_done(() => { + assertBaseVal(r1.x, 50, "r1.x"); + assertBaseVal(r1.y, 60, "r1.y"); + assertBaseVal(c1.cx, 50, "c1.cx"); + assertBaseVal(c1.cy, 60, "c1.cy"); + assertBaseVal(c1.r, 100, "c1.r"); + + assertBaseVal(r2.x, 50, "r2.x"); + assertBaseVal(r2.y, 60, "r2.y"); + assertBaseVal(c2.cx, 50, "c2.cx"); + assertBaseVal(c2.cy, 60, "c2.cy"); + assertBaseVal(c2.r, 100, "c2.r"); + }); + + let tEmPercentage = async_test("With em and percentage"); + let tEmPercentageDone = tEmPercentage.step_func_done(() => { + assertBaseVal(r1.width, 40, "r1.width"); + assertBaseVal(r1.height, 30, "r1.height"); + + assertBaseVal(r2.width, 120, "r2.width"); + assertBaseVal(r2.height, 120, "r2.height"); + }); + + const main = () => { + window.requestAnimationFrame(() => { + tEmDone(); + tEmPercentageDone(); + }); + }; + + if (document.readyState === "complete") { + main(); + } else { + window.addEventListener("load", main); + } +</script> diff --git a/testing/web-platform/tests/svg/geometry/svg-image-intrinsic-size-with-cssstyle-auto-dynamic-image-change.html b/testing/web-platform/tests/svg/geometry/svg-image-intrinsic-size-with-cssstyle-auto-dynamic-image-change.html new file mode 100644 index 0000000000..8d5e2e982e --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/svg-image-intrinsic-size-with-cssstyle-auto-dynamic-image-change.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<title>Test <svg:image>'s sizing with css size as auto, with dynamic image change</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<link rel="help" href="https://svgwg.org/svg2-draft/single-page.html#geometry-Sizing"/> +<link rel="help" href="https://svgwg.org/svg2-draft/single-page.html#embedded-Placement"/> +<svg height="0"> + <image width="128" height="128" xlink:href="/images/green-256x256.png" style="width:auto; height:auto"/> +</svg> +<script> +async_test(function(t) { + var image = document.querySelector('image'); + window.onload = t.step_func(function() { + var rectBBox = image.getBBox(); + assert_equals(rectBBox.width, 256); + assert_equals(rectBBox.height, 256); + image.setAttributeNS("http://www.w3.org/1999/xlink","href","data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='64' height='64'></svg>"); + image.onload = t.step_func_done(function() { + var rectBBox = image.getBBox(); + assert_equals(rectBBox.width, 64); + assert_equals(rectBBox.height, 64); + }); + }); +}); +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/geometry/svg-image-intrinsic-size-with-cssstyle-auto.html b/testing/web-platform/tests/svg/geometry/svg-image-intrinsic-size-with-cssstyle-auto.html new file mode 100644 index 0000000000..92fb7bc533 --- /dev/null +++ b/testing/web-platform/tests/svg/geometry/svg-image-intrinsic-size-with-cssstyle-auto.html @@ -0,0 +1,98 @@ +<!DOCTYPE html> +<title><svg:image> 'auto' sizing</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<link rel="help" href="https://svgwg.org/svg2-draft/single-page.html#geometry-Sizing"/> +<link rel="help" href="https://svgwg.org/svg2-draft/single-page.html#embedded-Placement"/> +<svg height="0"> + <image width="64" height="64" xlink:href="/images/green-256x256.png" /> + <image width="128" height="64" xlink:href="/images/green-256x256.png" style="width:auto"/> + <image width="64" height="128" xlink:href="/images/green-256x256.png" style="height:auto"/> + <image width="128" height="64" xlink:href="/images/green-256x256.png" style="width:auto; height:auto"/> + <image width="50" height="50" + xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>"/> + <image width="50" height="50" + xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='width:auto; height:auto'/> + <image width="50" height="50" + xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='width:auto;'/> + <image xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='width:auto;'/> + <image height="50" + xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='width:auto;'/> + <image width="50" + xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'></svg>" style='height:auto;'/> + <image width="200" height="200" + xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>" style='width:auto; height:auto'/> + <image height="200" + xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>" style='width:auto; height:auto'/> + <image width="200" + xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>" style='width:auto; height:auto'/> + <image xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>"/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 100'></svg>"/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 100'></svg>" style='width:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 100'></svg>" style='height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 100'></svg>" style='width:auto; height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' viewBox='0 0 400 100'></svg>"/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' viewBox='0 0 400 100'></svg>" style='width:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' viewBox='0 0 400 100'></svg>" style='height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' viewBox='0 0 400 100'></svg>" style='width:auto; height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='100' viewBox='0 0 400 100'></svg>"/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='100' viewBox='0 0 400 100'></svg>" style='width:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='100' viewBox='0 0 400 100'></svg>" style='height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='100' viewBox='0 0 400 100'></svg>" style='width:auto; height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100' viewBox='0 0 400 100'></svg>"/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100' viewBox='0 0 400 100'></svg>" style='width:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100' viewBox='0 0 400 100'></svg>" style='height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100' viewBox='0 0 400 100'></svg>" style='width:auto; height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>" style='height:auto'/> + <image width="60" height="60" xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>" style='width:auto'/> +</svg> +<script> +const expectedBoxes = [ + { dimensions: [64, 64], description: "256x256 png image, attributes width='64' height='64'"}, + { dimensions: [64, 64], description: "256x256 png image, attributes width='128' height='64' and CSS 'width:auto'"}, + { dimensions: [64, 64], description: "256x256 png image, attributes width='64' height='128' and CSS 'height:auto'"}, + { dimensions: [256, 256], description: "256x256 png image, attributes width='64' height='64' and CSS 'width:auto; height:auto'"}, + { dimensions: [50, 50], description: "default sized svg image, attributes width='50' height='50'"}, + { dimensions: [200, 100], description: "200x100 svg image, attributes width='50' height='50' and CSS 'width:auto; height:auto'"}, + { dimensions: [100, 50], description: "200x100 svg image, attributes width='50' height='50' and CSS 'width:auto'"}, + { dimensions: [200, 100], description: "200x100 svg image, without attributes width and height and CSS 'width:auto'"}, + { dimensions: [100, 50], description: "200x100 svg image, attributes height='50' and 'width:auto'"}, + { dimensions: [50, 25], description: "200x100 svg image, attributes width='50' and CSS height:auto"}, + { dimensions: [300, 150], description: "default sized svg image, attributes width='200' height='200' and CSS 'width:auto; height:auto'"}, + { dimensions: [300, 150], description: "default sized svg image, attributes height='200' and CSS 'width:auto; height:auto'"}, + { dimensions: [300, 150], description: "default sized svg image, attributes width='200' and CSS 'width:auto; height:auto'"}, + { dimensions: [300, 150], description: "default sized svg image, without attributes width and height, no css width/height specified"}, + { dimensions: [60, 60], description: "default sized svg image viewBox='0 0 400 100', attributes width='60' height='60' and no css width/height specified"}, + { dimensions: [240, 60], description: "default sized svg image viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'width:auto'"}, + { dimensions: [60, 15], description: "default sized svg image viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'height:auto'"}, + { dimensions: [300, 75], description: "default sized svg image viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'width:auto; height:auto'"}, + { dimensions: [60, 60], description: "svg image width='200' viewBox='0 0 400 100', attributes width='60' height='60' and no css width/height specified"}, + { dimensions: [240, 60], description: "svg image width='200' viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'width:auto'"}, + { dimensions: [60, 15], description: "svg image width='200' viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'height:auto'"}, + { dimensions: [200, 50], description: "svg image width='200' viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'width:auto; height:auto'"}, + { dimensions: [60, 60], description: "svg image height='100' viewBox='0 0 400 100', attributes width='60' height='60' and no css width/height specified"}, + { dimensions: [240, 60], description: "svg image height='100' viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'width:auto'"}, + { dimensions: [60, 15], description: "svg image height='100' viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'height:auto'"}, + { dimensions: [400, 100], description: "svg image height='100' viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'width:auto; height:auto'"}, + { dimensions: [60, 60], description: "200x100 svg image viewBox='0 0 400 100', attributes width='60' height='60' and no css width/height specified"}, + { dimensions: [120, 60], description: "200x100 svg image viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'width:auto'"}, + { dimensions: [60, 30], description: "200x100 svg image viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'height:auto'"}, + { dimensions: [200, 100], description: "200x100 svg image viewBox='0 0 400 100', attributes width='60' height='60' and CSS 'width:auto; height:auto'"}, + { dimensions: [60, 150], description: "default sized svg image, attributes width='60' height='60' and CSS 'height:auto'"}, + { dimensions: [300, 60], description: "default sized svg image, attributes width='60' height='60' and CSS 'width:auto'"}, +]; + +const images = document.getElementsByTagName('image'); +for (var i = 0, length = images.length; i < length; ++i) { + async_test(t => { + const image = images[i]; + const expected = expectedBoxes[i]; + window.addEventListener('load', t.step_func_done(() => { + const [expectedWidth, expectedHeight] = expected.dimensions; + const bbox = image.getBBox(); + assert_equals(bbox.width, expectedWidth, 'width'); + assert_equals(bbox.height, expectedHeight, 'height'); + })); + }, document.title + ' with ' + expectedBoxes[i].description); +} +</script> |