зеркало из https://github.com/mozilla/gecko-dev.git
Bug 825771 (Part 4) - Add image-orientation reftests for raster images. r=dholbert
This commit is contained in:
Seth Fowler
Родитель
7e052ef315
Коммит
0056e609fc
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.7 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.7 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.7 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.7 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.7 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.7 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.7 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.7 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 1.7 KiB |
|
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
div {
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
border: 50px solid black;
|
||||
margin: 50px;
|
||||
padding: 50px;
|
||||
|
||||
/* This is deliberately an image with a non-neutral inherent orientation to */
|
||||
/* ensure that the inherent orientation is irrelevant. */
|
||||
background-image: url(image-exif-90-deg-flip.jpg);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div></div>
|
||||
|
||||
<script>
|
||||
var orientation = location.search.substring(1).split("&");
|
||||
var angle = orientation[0];
|
||||
var flip = orientation[1] == "flip" ? true : false;
|
||||
|
||||
// Construct a style. "from-image" is special-cased.
|
||||
var style;
|
||||
if (angle == "from-image") {
|
||||
style = "div { image-orientation: from-image; }\n";
|
||||
} else {
|
||||
style = "div { image-orientation: "
|
||||
+ angle + "deg"
|
||||
+ (flip ? " flip" : "")
|
||||
+ "; }\n";
|
||||
}
|
||||
|
||||
// Apply the style to the document.
|
||||
var sheet = document.createElement('style');
|
||||
sheet.innerHTML = style;
|
||||
document.body.appendChild(sheet);
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
div {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: 50px;
|
||||
|
||||
/* This is deliberately an image with a non-neutral inherent orientation to */
|
||||
/* ensure that the inherent orientation is irrelevant. */
|
||||
border-style: solid;
|
||||
border-width: 20px;
|
||||
border-image: url(image-exif-90-deg-flip.jpg) 27 repeat;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div></div>
|
||||
|
||||
<script>
|
||||
var orientation = location.search.substring(1).split("&");
|
||||
var angle = orientation[0];
|
||||
var flip = orientation[1] == "flip" ? true : false;
|
||||
|
||||
// Construct a style. "from-image" is special-cased.
|
||||
var style;
|
||||
if (angle == "from-image") {
|
||||
style = "div { image-orientation: from-image; }\n";
|
||||
} else {
|
||||
style = "div { image-orientation: "
|
||||
+ angle + "deg"
|
||||
+ (flip ? " flip" : "")
|
||||
+ "; }\n";
|
||||
}
|
||||
|
||||
// Apply the style to the document.
|
||||
var sheet = document.createElement('style');
|
||||
sheet.innerHTML = style;
|
||||
document.body.appendChild(sheet);
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
img {
|
||||
border: 50px solid black;
|
||||
margin: 50px;
|
||||
padding: 50px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- This is deliberately an image with a non-neutral inherent orientation to
|
||||
ensure that the inherent orientation is irrelevant. -->
|
||||
<img src="image-exif-90-deg-flip.jpg">
|
||||
|
||||
<script>
|
||||
var orientation = location.search.substring(1).split("&");
|
||||
var angle = orientation[0];
|
||||
var flip = orientation[1] == "flip" ? true : false;
|
||||
|
||||
// Construct a style.
|
||||
var style = "img { image-orientation: "
|
||||
+ angle + "deg"
|
||||
+ (flip ? " flip" : "")
|
||||
+ "; }\n";
|
||||
|
||||
// Apply the style to the document.
|
||||
var sheet = document.createElement('style');
|
||||
sheet.innerHTML = style;
|
||||
document.body.appendChild(sheet);
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
<!DOCTYPE>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
img {
|
||||
image-orientation: from-image;
|
||||
border: 50px solid black;
|
||||
margin: 50px;
|
||||
padding: 50px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<img id="image">
|
||||
|
||||
<script>
|
||||
var orientation = location.search.substring(1).split("&");
|
||||
var angle = orientation[0];
|
||||
var flip = orientation[1] == "flip" ? true : false;
|
||||
|
||||
// Determine the final image file. 'none' is special-cased since its
|
||||
// filename doesn't quite follow the same pattern as the others.
|
||||
var imageFile;
|
||||
if (angle == "none") {
|
||||
imageFile = "image-exif-none.jpg";
|
||||
} else {
|
||||
var imageFile = "image-exif-"
|
||||
+ angle
|
||||
+ "-deg"
|
||||
+ (flip ? "-flip" : "")
|
||||
+ ".jpg";
|
||||
}
|
||||
|
||||
document.getElementById('image').src = imageFile;
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
<!DOCTYPE>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
table {
|
||||
border-spacing: 0px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<table>
|
||||
<tr>
|
||||
<td id="ul"></td>
|
||||
<td id="ur"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="ll"></td>
|
||||
<td id="lr"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var orientation = location.search.substring(1).split("&");
|
||||
var angle = parseInt(orientation[0]);
|
||||
var flip = orientation[1] == "flip" ? true : false;
|
||||
|
||||
// Each id corresponds to a color.
|
||||
var ids = ["ul", "ur", "lr", "ll"];
|
||||
var colors = [
|
||||
"rgb(0, 191, 0)",
|
||||
"rgb(0, 255, 1)",
|
||||
"rgb(254, 0, 122)",
|
||||
"rgb(191, 0, 93)",
|
||||
];
|
||||
|
||||
// 'Rotate' the colors according to the angle.
|
||||
colors.unshift.apply(colors, colors.splice((360 - angle) / 90, colors.length));
|
||||
|
||||
// 'Flip' the colors if requested.
|
||||
if (flip) {
|
||||
var tmp = colors[0];
|
||||
colors[0] = colors[1];
|
||||
colors[1] = tmp;
|
||||
tmp = colors[2];
|
||||
colors[2] = colors[3];
|
||||
colors[3] = tmp;
|
||||
}
|
||||
|
||||
// Construct a style.
|
||||
var style = "";
|
||||
|
||||
if (angle == 90 || angle == 270) {
|
||||
style += "div { width: 200px; height: 100px; }\n";
|
||||
style += "td { width: 100px; height: 50px; }\n";
|
||||
} else {
|
||||
style += "div { width: 100px; height: 200px; }\n";
|
||||
style += "td { width: 50px; height: 100px; }\n";
|
||||
}
|
||||
|
||||
for (var i = 0 ; i < 4 ; ++i) {
|
||||
style += "#" + ids[i] + " { background-color: " + colors[i] + "; }\n";
|
||||
}
|
||||
|
||||
// Apply the style to the document.
|
||||
var sheet = document.createElement('style');
|
||||
sheet.innerHTML = style;
|
||||
document.body.appendChild(sheet);
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
p:before {
|
||||
content: url(image-exif-270-deg-flip.jpg);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p></p>
|
||||
|
||||
<script>
|
||||
var orientation = location.search.substring(1).split("&");
|
||||
var angle = orientation[0];
|
||||
var flip = orientation[1] == "flip" ? true : false;
|
||||
|
||||
// Construct a style. "from-image" is special-cased.
|
||||
var style;
|
||||
if (angle == "from-image") {
|
||||
style = "p { image-orientation: from-image; }\n";
|
||||
} else {
|
||||
style = "p { image-orientation: "
|
||||
+ angle + "deg"
|
||||
+ (flip ? " flip" : "")
|
||||
+ "; }\n";
|
||||
}
|
||||
|
||||
// Apply the style to the document.
|
||||
var sheet = document.createElement('style');
|
||||
sheet.innerHTML = style;
|
||||
document.body.appendChild(sheet);
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
ul {
|
||||
list-style-position: inside;
|
||||
list-style-image: url(image-exif-270-deg-flip.jpg);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul><li></li></ul>
|
||||
|
||||
<script>
|
||||
var orientation = location.search.substring(1).split("&");
|
||||
var angle = orientation[0];
|
||||
var flip = orientation[1] == "flip" ? true : false;
|
||||
|
||||
// Construct a style. "from-image" is special-cased.
|
||||
var style;
|
||||
if (angle == "from-image") {
|
||||
style = "ul { image-orientation: from-image; }\n";
|
||||
} else {
|
||||
style = "ul { image-orientation: "
|
||||
+ angle + "deg"
|
||||
+ (flip ? " flip" : "")
|
||||
+ "; }\n";
|
||||
}
|
||||
|
||||
// Apply the style to the document.
|
||||
var sheet = document.createElement('style');
|
||||
sheet.innerHTML = style;
|
||||
document.body.appendChild(sheet);
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
<!DOCTYPE>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
div {
|
||||
border: 50px solid black;
|
||||
margin: 50px;
|
||||
padding: 50px;
|
||||
}
|
||||
table {
|
||||
border-spacing: 0px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<table>
|
||||
<tr>
|
||||
<td id="ul"></td>
|
||||
<td id="ur"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="ll"></td>
|
||||
<td id="lr"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var orientation = location.search.substring(1).split("&");
|
||||
var angle = parseInt(orientation[0]);
|
||||
var flip = orientation[1] == "flip" ? true : false;
|
||||
|
||||
// Each id corresponds to a color.
|
||||
var ids = ["ul", "ur", "lr", "ll"];
|
||||
var colors = [
|
||||
"rgb(0, 191, 0)",
|
||||
"rgb(0, 255, 1)",
|
||||
"rgb(254, 0, 122)",
|
||||
"rgb(191, 0, 93)",
|
||||
];
|
||||
|
||||
// 'Rotate' the colors according to the angle.
|
||||
colors.unshift.apply(colors, colors.splice((360 - angle) / 90, colors.length));
|
||||
|
||||
// 'Flip' the colors if requested.
|
||||
if (flip) {
|
||||
var tmp = colors[0];
|
||||
colors[0] = colors[1];
|
||||
colors[1] = tmp;
|
||||
tmp = colors[2];
|
||||
colors[2] = colors[3];
|
||||
colors[3] = tmp;
|
||||
}
|
||||
|
||||
// Construct a style.
|
||||
var style = "";
|
||||
|
||||
if (angle == 90 || angle == 270) {
|
||||
style += "div { width: 200px; height: 100px; }\n";
|
||||
style += "td { width: 100px; height: 50px; }\n";
|
||||
} else {
|
||||
style += "div { width: 100px; height: 200px; }\n";
|
||||
style += "td { width: 50px; height: 100px; }\n";
|
||||
}
|
||||
|
||||
for (var i = 0 ; i < 4 ; ++i) {
|
||||
style += "#" + ids[i] + " { background-color: " + colors[i] + "; }\n";
|
||||
}
|
||||
|
||||
// Apply the style to the document.
|
||||
var sheet = document.createElement('style');
|
||||
sheet.innerHTML = style;
|
||||
document.body.appendChild(sheet);
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -10,3 +10,84 @@ random-if(/^Windows\x20NT\x205\.1/.test(http.oscpu)) == sync-image-switch-1a.htm
|
|||
random-if(/^Windows\x20NT\x205\.1/.test(http.oscpu)) == sync-image-switch-1b.html sync-image-switch-1-ref.html # bug 855050 for WinXP
|
||||
random-if(/^Windows\x20NT\x205\.1/.test(http.oscpu)) == sync-image-switch-1c.html sync-image-switch-1-ref.html # bug 855050 for WinXP
|
||||
random-if(/^Windows\x20NT\x205\.1/.test(http.oscpu)) == sync-image-switch-1d.html sync-image-switch-1-ref.html # bug 855050 for WinXP
|
||||
|
||||
# Tests for image-orientation used with 'from-image' (note that all
|
||||
# image-orientation tests are fuzzy because the JPEG images do not perfectly
|
||||
# reproduce blocks of solid color, even at maximum quality):
|
||||
fuzzy(2,5) == image-orientation-from-image.html?none image-orientation-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-from-image.html?0 image-orientation-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-from-image.html?90 image-orientation-ref.html?90
|
||||
fuzzy(1,1) == image-orientation-from-image.html?180 image-orientation-ref.html?180
|
||||
fuzzy(1,1) == image-orientation-from-image.html?270 image-orientation-ref.html?270
|
||||
fuzzy(1,1) == image-orientation-from-image.html?0&flip image-orientation-ref.html?0&flip
|
||||
fuzzy(1,1) == image-orientation-from-image.html?90&flip image-orientation-ref.html?90&flip
|
||||
fuzzy(1,1) == image-orientation-from-image.html?180&flip image-orientation-ref.html?180&flip
|
||||
fuzzy(1,1) == image-orientation-from-image.html?270&flip image-orientation-ref.html?270&flip
|
||||
|
||||
# Tests for image-orientation used with an explicit orientation:
|
||||
fuzzy(1,1) == image-orientation-explicit.html?0 image-orientation-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-explicit.html?90 image-orientation-ref.html?90
|
||||
fuzzy(1,1) == image-orientation-explicit.html?180 image-orientation-ref.html?180
|
||||
fuzzy(1,1) == image-orientation-explicit.html?270 image-orientation-ref.html?270
|
||||
fuzzy(1,1) == image-orientation-explicit.html?0&flip image-orientation-ref.html?0&flip
|
||||
fuzzy(1,1) == image-orientation-explicit.html?90&flip image-orientation-ref.html?90&flip
|
||||
fuzzy(1,1) == image-orientation-explicit.html?180&flip image-orientation-ref.html?180&flip
|
||||
fuzzy(1,1) == image-orientation-explicit.html?270&flip image-orientation-ref.html?270&flip
|
||||
|
||||
# Tests for image-orientation used with non-axis-aligned angles:
|
||||
fuzzy(1,1) == image-orientation-explicit.html?-45 image-orientation-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-explicit.html?-15 image-orientation-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-explicit.html?15 image-orientation-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-explicit.html?45 image-orientation-ref.html?90
|
||||
fuzzy(1,1) == image-orientation-explicit.html?75 image-orientation-ref.html?90
|
||||
fuzzy(1,1) == image-orientation-explicit.html?105 image-orientation-ref.html?90
|
||||
fuzzy(1,1) == image-orientation-explicit.html?135 image-orientation-ref.html?180
|
||||
fuzzy(1,1) == image-orientation-explicit.html?165 image-orientation-ref.html?180
|
||||
fuzzy(1,1) == image-orientation-explicit.html?195 image-orientation-ref.html?180
|
||||
fuzzy(1,1) == image-orientation-explicit.html?225 image-orientation-ref.html?270
|
||||
fuzzy(1,1) == image-orientation-explicit.html?255 image-orientation-ref.html?270
|
||||
fuzzy(1,1) == image-orientation-explicit.html?285 image-orientation-ref.html?270
|
||||
fuzzy(1,1) == image-orientation-explicit.html?315 image-orientation-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-explicit.html?345 image-orientation-ref.html?0
|
||||
|
||||
# Tests for image-orientation used on generated content:
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?from-image image-orientation-generated-content-ref.html?270&flip
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?0 image-orientation-generated-content-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?90 image-orientation-generated-content-ref.html?90
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?180 image-orientation-generated-content-ref.html?180
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?270 image-orientation-generated-content-ref.html?270
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?0&flip image-orientation-generated-content-ref.html?0&flip
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?90&flip image-orientation-generated-content-ref.html?90&flip
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?180&flip image-orientation-generated-content-ref.html?180&flip
|
||||
fuzzy(1,1) == image-orientation-generated-content.html?270&flip image-orientation-generated-content-ref.html?270&flip
|
||||
|
||||
# Tests that image-orientation does not apply to decorative images:
|
||||
fuzzy(1,1) == image-orientation-background.html?from-image image-orientation-ref.html?0
|
||||
fuzzy(1,1) == image-orientation-background.html?90&flip image-orientation-ref.html?0
|
||||
== image-orientation-border-image.html?from-image image-orientation-border-image.html?0
|
||||
== image-orientation-border-image.html?90&flip image-orientation-border-image.html?0
|
||||
== image-orientation-list-style-image.html?from-image image-orientation-list-style-image.html?0
|
||||
== image-orientation-list-style-image.html?90&flip image-orientation-list-style-image.html?0
|
||||
|
||||
# Sanity checks for the image-orientation tests. Ensures that the various
|
||||
# combinations of rotations and flips actually look different from each other.
|
||||
!= image-orientation-ref.html?0 image-orientation-ref.html?90
|
||||
!= image-orientation-ref.html?0 image-orientation-ref.html?180
|
||||
!= image-orientation-ref.html?0 image-orientation-ref.html?270
|
||||
!= image-orientation-ref.html?90 image-orientation-ref.html?180
|
||||
!= image-orientation-ref.html?90 image-orientation-ref.html?270
|
||||
!= image-orientation-ref.html?180 image-orientation-ref.html?270
|
||||
!= image-orientation-ref.html?0 image-orientation-ref.html?0&flip
|
||||
!= image-orientation-ref.html?90 image-orientation-ref.html?90&flip
|
||||
!= image-orientation-ref.html?180 image-orientation-ref.html?180&flip
|
||||
!= image-orientation-ref.html?270 image-orientation-ref.html?270&flip
|
||||
!= image-orientation-generated-content-ref.html?0 image-orientation-generated-content-ref.html?90
|
||||
!= image-orientation-generated-content-ref.html?0 image-orientation-generated-content-ref.html?180
|
||||
!= image-orientation-generated-content-ref.html?0 image-orientation-generated-content-ref.html?270
|
||||
!= image-orientation-generated-content-ref.html?90 image-orientation-generated-content-ref.html?180
|
||||
!= image-orientation-generated-content-ref.html?90 image-orientation-generated-content-ref.html?270
|
||||
!= image-orientation-generated-content-ref.html?180 image-orientation-generated-content-ref.html?270
|
||||
!= image-orientation-generated-content-ref.html?0 image-orientation-generated-content-ref.html?0&flip
|
||||
!= image-orientation-generated-content-ref.html?90 image-orientation-generated-content-ref.html?90&flip
|
||||
!= image-orientation-generated-content-ref.html?180 image-orientation-generated-content-ref.html?180&flip
|
||||
!= image-orientation-generated-content-ref.html?270 image-orientation-generated-content-ref.html?270&flip
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче