Move transform_3d.html to wpt reftests.

This commit is contained in:
Corey Farwell 2015-10-15 22:07:18 -04:00
parent fa8971588a
commit fbc4dd18ea
4 changed files with 25 additions and 1 deletions

View file

@ -831,6 +831,18 @@
"url": "/_mozilla/css/text_transform_uppercase_a.html"
}
],
"css/transform_3d.html": [
{
"path": "css/transform_3d.html",
"references": [
[
"/_mozilla/css/transform_3d_ref.html",
"=="
]
],
"url": "/_mozilla/css/transform_3d.html"
}
],
"css/transform_optimization.html": [
{
"path": "css/transform_optimization.html",
@ -2612,6 +2624,18 @@
"url": "/_mozilla/css/text_transform_uppercase_a.html"
}
],
"css/transform_3d.html": [
{
"path": "css/transform_3d.html",
"references": [
[
"/_mozilla/css/transform_3d_ref.html",
"=="
]
],
"url": "/_mozilla/css/transform_3d.html"
}
],
"css/transform_optimization.html": [
{
"path": "css/transform_optimization.html",

View file

@ -0,0 +1,128 @@
<!DOCTYPE html>
<html>
<head>
<link rel='match' href='transform_3d_ref.html'>
<style type="text/css">
#div_t3d_1 {
position: absolute;
background-color: red;
top: 10px;
left: 10px;
width: 40px;
height: 40px;
}
#div_t3d_2 {
position: absolute;
background-color: green;
top: 10px;
left: 10px;
width: 20px;
height: 20px;
transform: translate3d(50%, 50%, 0);
}
#div_t3d_3 {
position: absolute;
background-color: red;
top: 10px;
left: 60px;
width: 40px;
height: 40px;
}
#div_t3d_4 {
position: absolute;
background-color: green;
top: 10px;
left: 10px;
width: 20px;
height: 20px;
transform: translate3d(-5px, 10px, 0);
}
#div_s3d_1 {
position: absolute;
background-color: red;
top: 10px;
left: 110px;
width: 40px;
height: 40px;
}
#div_s3d_2 {
position: absolute;
background-color: green;
top: 10px;
left: 10px;
width: 20px;
height: 20px;
transform: scale3d(0.5, 2, 1);
}
#div_r3d_1 {
position: absolute;
background-color: red;
top: 60px;
left: 10px;
width: 40px;
height: 40px;
}
#div_r3d_2 {
position: absolute;
background-color: green;
top: 10px;
left: 10px;
width: 10px;
height: 20px;
transform: rotateZ(90deg);
}
#div_r3d_3 {
position: absolute;
background-color: red;
top: 60px;
left: 60px;
width: 40px;
height: 40px;
}
#div_r3d_4 {
position: absolute;
background-color: green;
top: 10px;
left: 10px;
width: 10px;
height: 20px;
transform: rotate3d(0, 0, 1, 90deg);
}
</style>
</head>
<body>
<div id="div_t3d_1">
<div id="div_t3d_2">
</div>
</div>
<div id="div_t3d_3">
<div id="div_t3d_4">
</div>
</div>
<div id="div_s3d_1">
<div id="div_s3d_2">
</div>
</div>
<div id="div_r3d_1">
<div id="div_r3d_2">
</div>
</div>
<div id="div_r3d_3">
<div id="div_r3d_4">
</div>
</div>
</body>
</html>

View file

@ -0,0 +1,122 @@
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#div_t3d_1 {
position: absolute;
background-color: red;
top: 10px;
left: 10px;
width: 40px;
height: 40px;
}
#div_t3d_2 {
position: absolute;
background-color: green;
top: 20px;
left: 20px;
width: 20px;
height: 20px;
}
#div_t3d_3 {
position: absolute;
background-color: red;
top: 10px;
left: 60px;
width: 40px;
height: 40px;
}
#div_t3d_4 {
position: absolute;
background-color: green;
top: 20px;
left: 5px;
width: 20px;
height: 20px;
}
#div_s3d_1 {
position: absolute;
background-color: red;
top: 10px;
left: 110px;
width: 40px;
height: 40px;
}
#div_s3d_2 {
position: absolute;
background-color: green;
top: 0;
left: 15px;
width: 10px;
height: 40px;
}
#div_r3d_1 {
position: absolute;
background-color: red;
top: 60px;
left: 10px;
width: 40px;
height: 40px;
}
#div_r3d_2 {
position: absolute;
background-color: green;
top: 15px;
left: 5px;
width: 20px;
height: 10px;
}
#div_r3d_3 {
position: absolute;
background-color: red;
top: 60px;
left: 60px;
width: 40px;
height: 40px;
}
#div_r3d_4 {
position: absolute;
background-color: green;
top: 15px;
left: 5px;
width: 20px;
height: 10px;
}
</style>
</head>
<body>
<div id="div_t3d_1">
<div id="div_t3d_2">
</div>
</div>
<div id="div_t3d_3">
<div id="div_t3d_4">
</div>
</div>
<div id="div_s3d_1">
<div id="div_s3d_2">
</div>
</div>
<div id="div_r3d_1">
<div id="div_r3d_2">
</div>
</div>
<div id="div_r3d_3">
<div id="div_r3d_4">
</div>
</div>
</body>
</html>