Bug 885939 (Part 2) - Add reftests for SVG image stretching and scaling. r=dholbert

This commit is contained in:
Seth Fowler 2013-07-16 15:41:33 -04:00
parent 7426ec7020
commit 939a7f10c0
9 changed files with 171 additions and 0 deletions

View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<style>
div {
background-color: white;
width: 12px;
height: 60px;
}
body {
background-color: black;
margin: 0px;
padding: 0px;
border: 0px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html reftest-zoom="2.0">
<head>
<style>
div {
background-color: yellow;
background-image: url("white-rect-no-viewbox.svg");
width: 6px;
height: 30px;
}
body {
background-color: black;
margin: 0px;
padding: 0px;
border: 0px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<style>
div {
background-color: white;
width: 12px;
height: 60px;
}
body {
background-color: black;
margin: 0px;
padding: 0px;
border: 0px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html reftest-zoom="2.0">
<head>
<style>
div {
background-color: yellow;
background-image: url("white-rect-with-viewbox.svg");
width: 6px;
height: 30px;
}
body {
background-color: black;
margin: 0px;
padding: 0px;
border: 0px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

View File

@ -0,0 +1,37 @@
<!DOCTYPE html>
<html>
<head>
<style>
div {
background-color: yellow;
height: 30px;
}
.container {
width: 100px;
}
.stretch {
width: 40px;
background-color: white;
display: inline-block;
}
.left-spacer {
width: 30px;
float: left;
}
.right-spacer {
width: 30px;
float: right;
}
body {
background-color: black;
}
</style>
</head>
<body>
<div class="container">
<div class="left-spacer"></div>
<div class="stretch"></div>
<div class="right-spacer"></div>
</div>
</body>
</html>

View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<style>
div {
height: 30px;
width: 100px;
background-image: url("white-rect-with-viewbox.svg");
background-repeat: no-repeat;
background-position: 30px;
background-size: 40px 30px;
background-color: yellow;
}
body {
background-color: black;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

View File

@ -16,6 +16,13 @@ skip-if(B2G) == background-simple-1.html lime100x100-ref.html # bug 773482
== background-resize-3.html lime100x100-ref.html
== background-resize-4.html lime100x100-ref.html
# Test for stretching background images by different amounts in each dimension
== background-stretch-1.html background-stretch-1-ref.html
# Tests for scaling background images
== background-scale-no-viewbox-1.html background-scale-no-viewbox-1-ref.html
== background-scale-with-viewbox-1.html background-scale-with-viewbox-1-ref.html
# Tests with -moz-image-rect()
skip-if(B2G) == background-image-rect-1svg.html lime100x100-ref.html # bug 773482
== background-image-rect-1png.html lime100x100-ref.html

View File

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<rect width="6" height="30" style="fill:white;" />
</svg>

After

Width:  |  Height:  |  Size: 213 B

View File

@ -0,0 +1,11 @@
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="6px"
height="30px"
viewBox="0 0 6 30">
<rect width="6" height="30" style="fill:white;" />
</svg>

After

Width:  |  Height:  |  Size: 284 B