Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-11-27 23:02:20 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1269321: Part 4 - Add tests. r=thinker

Browse Source 
--HG--
extra : rebase_source : 4a6756ea08ac3f949fd2ad3a50aa5160921e446e
This commit is contained in:
Matt Woodrow 2016-06-30 18:10:49 +02:00
parent 4f7d3bf72f
commit e6469da752
5 changed files with 133 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
layout/reftests/transform-3d/mask-layer-1.html Normal file
View File

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>border-radius should work correctly for elements with perspective</title>
<style>
#a {
position: relative;
width: 300px;
height: 300px;
border-radius: 10px;
overflow: hidden;
background: red;
perspective: 1000px;
}
#b {
position: relative;
background: green;
height: 100%;
width: 10000px;
transform: translateX(0px);
}
</style>
<div id="a">
<div id="b"></div>
</div>

37
layout/reftests/transform-3d/mask-layer-2.html Normal file
View File

@ -0,0 +1,37 @@
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>border-radius should work correctly for elements with perspective and preserve-3d</title>
<style>
#a {
position: relative;
width: 300px;
height: 300px;
border-radius: 10px;
overflow: hidden;
background: red;
perspective: 1000px;
}
#b {
height: 100%;
transform-style: preserve-3d;
transform: rotateX(90deg);
}
#c {
position: relative;
background: green;
height: 100%;
width: 10000px;
transform: rotateX(90deg);
}
</style>
<div id="a">
<div id="b">
<div id="c"></div>
</div>
</div>

36
layout/reftests/transform-3d/mask-layer-3.html Normal file
View File

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>border-radius should work correctly for elements with preserve-3d</title>
<style>
#a {
position: relative;
width: 300px;
height: 300px;
border-radius: 10px;
overflow: hidden;
background: red;
}
#b {
height: 100%;
transform-style: preserve-3d;
transform: rotateX(90deg);
}
#c {
position: relative;
background: green;
height: 100%;
width: 10000px;
transform: rotateX(90deg);
}
</style>
<div id="a">
<div id="b">
<div id="c"></div>
</div>
</div>

28
layout/reftests/transform-3d/mask-layer-ref.html Normal file
View File

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>border-radius should work correctly for transformed elements</title>
<style>
#a {
position: relative;
width: 300px;
height: 300px;
border-radius: 10px;
overflow: hidden;
background: red;
}
#b {
position: relative;
background: green;
height: 100%;
width: 10000px;
transform: translateZ(1px);
}
</style>
<div id="a">
<div id="b"></div>
</div>

3
layout/reftests/transform-3d/reftest.list
View File

@ -78,3 +78,6 @@ fuzzy(1,15000) == opacity-preserve3d-2.html opacity-preserve3d-2-ref.html
fuzzy(1,10000) == opacity-preserve3d-3.html opacity-preserve3d-3-ref.html
fuzzy(1,10000) == opacity-preserve3d-4.html opacity-preserve3d-4-ref.html
== snap-perspective-1.html snap-perspective-1-ref.html
== mask-layer-1.html mask-layer-ref.html
== mask-layer-2.html mask-layer-ref.html
== mask-layer-3.html mask-layer-ref.html