diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-transforms/scale')
17 files changed, 448 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-transforms/scale/reference/svg-scale-ref.html b/testing/web-platform/tests/css/css-transforms/scale/reference/svg-scale-ref.html new file mode 100644 index 0000000000..1b03454e92 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/reference/svg-scale-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Reftest Reference</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <meta name="flags" content="svg"> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect width="100%" height="100%" fill="green"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-001.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-001.html new file mode 100644 index 0000000000..e87df4a98d --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-001.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale 0.5 with only one parameter specified</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="If the second parameter of the scale function is not provided, it is takes a value equal to the first. The red rect in this test should be scaled down 0.5 vertically and horizontally to be completely hidden by the green rect."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: green; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="1" y="1" width="196" height="196" fill="red" transform="scale(0.5)"/> + <rect x="0" y="0" width="100" height="100" fill="green"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-002.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-002.html new file mode 100644 index 0000000000..2d1e975523 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-002.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale 1.5 with only one parameter specified</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="If the second parameter is not provided, it is takes a value equal to the first. The green rect in this test should be scaled up 1.5 vertically and horizontally to completely cover the red rect."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: green; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="1" y="1" width="148" height="148" fill="red"/> + <rect width="100" height="100" fill="green" transform="scale(1.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-003.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-003.html new file mode 100644 index 0000000000..45501bbdb3 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-003.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale 2 with only one parameter specified</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="If the second parameter is not provided, it is takes a value equal to the first. The green rect in this test should be scaled up 2 vertically and horizontally to completely cover the red rect."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: green; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="1" y="1" width="148" height="148" fill="red"/> + <rect width="75" height="75" fill="green" transform="scale(2)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-004.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-004.html new file mode 100644 index 0000000000..728dce1efe --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-004.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale 0.5 with parameters separated by commas + no whitespace</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Parameters in the scale function can be separated by commas and no whitespace. The red rect in this test should be scaled down 0.5 to completely cover the green rect."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: green; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="1" y="1" width="196" height="196" fill="red" transform="scale(0.5,0.5)"/> + <rect width="100" height="100" fill="green"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-006.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-006.html new file mode 100644 index 0000000000..a45d2319ea --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-006.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale horizontally 0.5 and vertically 1.5</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="The green rect in the test should be scaled down horizontally and up vertically to form a square and completely cover the red rect."> + <style type="text/css"> + svg { + width: 500px; + height: 500px; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="1" y="1" width="198" height="198" fill="red"/> + <rect width="400" height="133.333" fill="green" transform="scale(0.5, 1.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-007.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-007.html new file mode 100644 index 0000000000..07a3923de6 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-007.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale horizontally 1.5 and vertically 0.5</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="The green rect in the test should be scaled up horizontally and down vertically to form a square completely cover the red rect."> + <style type="text/css"> + svg { + width: 500px; + height: 500px; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="1" y="1" width="198" height="198" fill="red"/> + <rect width="133.333" height="400" fill="green" transform="scale(1.5, 0.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-008.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-008.html new file mode 100644 index 0000000000..5c91cc9be2 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-008.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale 0.5 on the g element </title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="The group containing the red rect in this test should be scaled down 0.5 to be completely hidden behind the green rect."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: green; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <g transform="scale(0.5)"> + <rect x="1" y="1" width="296" height="296" fill="red"/> + </g> + <rect width="150" height="150" fill="green"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-009.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-009.html new file mode 100644 index 0000000000..8b33f1eada --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-009.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale 0.5 on the g element and scale 0.5 on the rect element</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="The group containing the red rect in this test should be scaled down 0.5 and the red rect should be scaled down again 0.5 to be completely hidden behind the green rect."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: green; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <g transform="scale(0.5)"> + <rect x="1" y="1" width="592" height="592" fill="red" transform="scale(0.5)"/> + </g> + <rect width="150" height="150" fill="green"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-010.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-010.html new file mode 100644 index 0000000000..3bae506c5f --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-010.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale -0.5 with only one parameter specified</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Scaling by a negative value should flip the element and if the second parameter of the scale function is not provided, it is takes a value equal to the first. The green rect in this test should be flipped downward and rightward into view and scaled down 0.5 horizontally and vertically to completely cover the red background."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: red; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="-400" y="-400" width="400" height="400" fill="green" transform="scale(-0.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-011.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-011.html new file mode 100644 index 0000000000..dd02c3ceb1 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-011.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale -2 with only one parameter specified</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Scaling by a negative value should flip the element and if the second parameter of the scale function is not provided, it is takes a value equal to the first. The green rect in this test flipped rightward and downard into view and scaled up 2 to completely cover the red background."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: red; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="-100" y="-100" width="100" height="100" fill="green" transform="scale(-2)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-012.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-012.html new file mode 100644 index 0000000000..641de40522 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-012.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale -0.5 with parameters separated by commas + no whitespace</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Scaling by a negative value should flip the element and parameters to the scale function can be separated by commas with no whitespace. The green rect in this test should be flipped downward and rightward into view right scaled down 0.5 to to completely cover the red background."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: red; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="-400" y="-400" width="400" height="400" fill="green" transform="scale(-0.5,-0.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-013.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-013.html new file mode 100644 index 0000000000..00c754552f --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-013.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale horizontally -0.5 and vertically -1.5</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Scaling by a negative value should flip the element. The green rect in this test should be flipped downward and rightward into view and scaled down horizontally and up vertically to completely cover the red background."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: red; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="-400" y="-133.333" width="400" height="133.333" fill="green" transform="scale(-0.5, -1.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-014.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-014.html new file mode 100644 index 0000000000..15662267c2 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-014.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale horizontally -1.5 and vertically -0.5</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Scaling by a negative value should flip the element. The green rect in this test should be flipped downward and rightward into view and scaled up horizontally and down vertically to completely cover the red background."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: red; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="-133.333" y="-400" width="133.333" height="400" fill="green" transform="scale(-1.5, -0.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-015.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-015.html new file mode 100644 index 0000000000..ecc85c76bc --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-015.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale horizontally -0.5 and vertically 1.5</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Scaling by a negative value should flip the element. The green rect in this test should be flipped rightward into view and scaled down horizontally and up vertically to completely cover the red background."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: red; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="-400" y="0" width="400" height="133.333" fill="green" transform="scale(-0.5, 1.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-016.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-016.html new file mode 100644 index 0000000000..9b562597c8 --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-016.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale horizontally 1.5 and vertically -0.5</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Scaling by a negative value should flip the element. The green rect in this test should be flipped downward into view and scaled up horizontally and down vertically to completely cover the red background."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: red; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <rect x="0" y="-400" width="133.333" height="400" fill="green" transform="scale(1.5, -0.5)"/> + </svg> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-transforms/scale/svg-scale-017.html b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-017.html new file mode 100644 index 0000000000..c939b783de --- /dev/null +++ b/testing/web-platform/tests/css/css-transforms/scale/svg-scale-017.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Transforms Test: SVG presentation attribute and scale -0.5 on the g element</title> + <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> + <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-scale"> + <link rel="match" href="reference/svg-scale-ref.html"> + <meta name="flags" content="svg"> + <meta name="assert" content="Scaling by a negative value should flip the element. The group containing the green rect in this test should be flipped downard and rightward into view and scaled down horizontally and vertically to completely cover the red background."> + <style type="text/css"> + svg { + width: 200px; + height: 200px; + background: red; + } + </style> +</head> +<body> + <p>The test passes if you see a green square and no red.</p> + <svg> + <g transform="scale(-0.5)"> + <rect x="-400" y="-400" width="400" height="400" fill="green"/> + </g> + </svg> +</body> +</html>
\ No newline at end of file |