wine/gecko
0
0
Fork 0
mirror of https://gitlab.winehq.org/wine/wine-gecko.git synced 2024-09-13 09:24:08 -07:00
Code Issues Packages Projects Releases Wiki Activity

Bug 1187851 patch 1 - Tests for making dynamic changes to filter and perspective change fixed position containing block for descendants. r=roc

Browse Source 
As expected, without the patch in patch 4, the filter and perspective
tests fail, but the added transform test passes.  All the tests pass
locally with patch 4.
This commit is contained in:
L. David Baron 2015-08-03 20:18:00 -07:00
parent 88c47ec3d2
commit 09e1edef79
11 changed files with 334 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
layout/reftests/w3c-css/submitted/filters/filter-containing-block-dynamic-1-ref.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS filters: Creating containing block for fixed positioned elements</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<style>
html, body { margin: 0; padding: 0 }
#fixedmoves {
position: absolute;
top: 150px;
left: 150px;
background: green;
height: 100px;
width: 100px;
}
</style>
<body>
<div id="fixedmoves"></div>
</body>

47
layout/reftests/w3c-css/submitted/filters/filter-containing-block-dynamic-1a.html Normal file
View File

@ -0,0 +1,47 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS filters: Creating containing block for fixed positioned elements</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="https://drafts.fxtf.org/filters/#FilterProperty">
<link rel="help" href="http://www.w3.org/2015/02/10-fx-minutes.html#action02">
<link rel="match" href="filter-containing-block-dynamic-1-ref.html">
<meta name="flags" content="dom">
<style>
html, body { margin: 0; padding: 0 }
#changefilter {
position: absolute;
top: 100px;
left: 100px;
}
#abscovered {
position: absolute;
top: 50px;
left: 50px;
background: red;
height: 100px;
width: 100px;
}
#fixedmoves {
position: fixed;
top: 150px;
left: 150px;
background: green;
height: 100px;
width: 100px;
}
</style>
<body>
<div id="changefilter" style="filter: blur(4px)">
<div id="abscovered"></div>
<div id="fixedmoves"></div>
</div>
<script>
var changefilter = document.getElementById("changefilter");
var fixedmoves = document.getElementById("fixedmoves");
var causeFlush = fixedmoves.offsetTop;
changefilter.style.filter = "";
</script>
</body>

47
layout/reftests/w3c-css/submitted/filters/filter-containing-block-dynamic-1b.html Normal file
View File

@ -0,0 +1,47 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS filters: Creating containing block for fixed positioned elements</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="https://drafts.fxtf.org/filters/#FilterProperty">
<link rel="help" href="http://www.w3.org/2015/02/10-fx-minutes.html#action02">
<link rel="match" href="filter-containing-block-dynamic-1-ref.html">
<meta name="flags" content="dom">
<style>
html, body { margin: 0; padding: 0 }
#changefilter {
position: absolute;
top: 100px;
left: 100px;
}
#abscovered {
position: absolute;
top: 50px;
left: 50px;
background: red;
height: 100px;
width: 100px;
}
#fixedmoves {
position: fixed;
top: 50px;
left: 50px;
background: green;
height: 100px;
width: 100px;
}
</style>
<body>
<div id="changefilter">
<div id="abscovered"></div>
<div id="fixedmoves"></div>
</div>
<script>
var changefilter = document.getElementById("changefilter");
var fixedmoves = document.getElementById("fixedmoves");
var causeFlush = fixedmoves.offsetTop;
changefilter.style.filter = "blur(0px)";
</script>
</body>

2
layout/reftests/w3c-css/submitted/filters/reftest.list Normal file
View File

@ -0,0 +1,2 @@
fails == filter-containing-block-dynamic-1a.html filter-containing-block-dynamic-1-ref.html # bug 1187851
fails == filter-containing-block-dynamic-1b.html filter-containing-block-dynamic-1-ref.html # bug 1187851

5
layout/reftests/w3c-css/submitted/reftest.list
View File

@ -19,6 +19,9 @@ include css21/reftest.list
# Conditional Rules Level 3
include conditional3/reftest.list
# Filter Effects Module
include filters/reftest.list
# Flexible Box Layout Module
include flexbox/reftest.list
@ -53,7 +56,7 @@ include text3/reftest.list
include text-decor-3/reftest.list
# Transforms
# include transforms/reftest.list
include transforms/reftest.list
# Transitions
# include transitions/reftest.list

19
layout/reftests/w3c-css/submitted/transforms/containing-block-dynamic-1-ref.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS transforms: Creating containing block for fixed positioned elements</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<style>
html, body { margin: 0; padding: 0 }
#fixedmoves {
position: absolute;
top: 150px;
left: 150px;
background: green;
height: 100px;
width: 100px;
}
</style>
<body>
<div id="fixedmoves"></div>
</body>

47
layout/reftests/w3c-css/submitted/transforms/perspective-containing-block-dynamic-1a.html Normal file
View File

@ -0,0 +1,47 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS transforms: Creating containing block for fixed positioned elements</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-transforms/#perspective-property">
<link rel="match" href="containing-block-dynamic-1-ref.html">
<meta name="assert" content="It also establishes a containing block (somewhat similar to position: relative), just like the transform property does.">
<meta name="flags" content="dom">
<style>
html, body { margin: 0; padding: 0 }
#changeperspective {
position: absolute;
top: 100px;
left: 100px;
}
#abscovered {
position: absolute;
top: 50px;
left: 50px;
background: red;
height: 100px;
width: 100px;
}
#fixedmoves {
position: fixed;
top: 150px;
left: 150px;
background: green;
height: 100px;
width: 100px;
}
</style>
<body>
<div id="changeperspective" style="perspective: 1000px">
<div id="abscovered"></div>
<div id="fixedmoves"></div>
</div>
<script>
var changeperspective = document.getElementById("changeperspective");
var fixedmoves = document.getElementById("fixedmoves");
var causeFlush = fixedmoves.offsetTop;
changeperspective.style.perspective = "";
</script>
</body>

47
layout/reftests/w3c-css/submitted/transforms/perspective-containing-block-dynamic-1b.html Normal file
View File

@ -0,0 +1,47 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS transforms: Creating containing block for fixed positioned elements</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-transforms/#perspective-property">
<link rel="match" href="containing-block-dynamic-1-ref.html">
<meta name="assert" content="It also establishes a containing block (somewhat similar to position: relative), just like the transform property does.">
<meta name="flags" content="dom">
<style>
html, body { margin: 0; padding: 0 }
#changeperspective {
position: absolute;
top: 100px;
left: 100px;
}
#abscovered {
position: absolute;
top: 50px;
left: 50px;
background: red;
height: 100px;
width: 100px;
}
#fixedmoves {
position: fixed;
top: 50px;
left: 50px;
background: green;
height: 100px;
width: 100px;
}
</style>
<body>
<div id="changeperspective">
<div id="abscovered"></div>
<div id="fixedmoves"></div>
</div>
<script>
var changeperspective = document.getElementById("changeperspective");
var fixedmoves = document.getElementById("fixedmoves");
var causeFlush = fixedmoves.offsetTop;
changeperspective.style.perspective = "1000px";
</script>
</body>

4
layout/reftests/w3c-css/submitted/transforms/reftest.list Normal file
View File

@ -0,0 +1,4 @@
== transform-containing-block-dynamic-1a.html containing-block-dynamic-1-ref.html
== transform-containing-block-dynamic-1b.html containing-block-dynamic-1-ref.html
fails == perspective-containing-block-dynamic-1a.html containing-block-dynamic-1-ref.html # bug 1187851
fails == perspective-containing-block-dynamic-1b.html containing-block-dynamic-1-ref.html # bug 1187851

49
layout/reftests/w3c-css/submitted/transforms/transform-containing-block-dynamic-1a.html Normal file
View File

@ -0,0 +1,49 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS transforms: Creating containing block for fixed positioned elements</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-rendering">
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-property">
<link rel="match" href="containing-block-dynamic-1-ref.html">
<meta name="assert" content="For elements whose layout is governed by the CSS box model, any value other than none for the transform results in the creation of both a stacking context and a containing block. The object acts as a containing block for fixed positioned descendants.">
<meta name="assert" content="The object acts as a containing block for fixed positioned descendants."
<meta name="flags" content="dom">
<style>
html, body { margin: 0; padding: 0 }
#changetransform {
position: absolute;
top: 100px;
left: 100px;
}
#abscovered {
position: absolute;
top: 50px;
left: 50px;
background: red;
height: 100px;
width: 100px;
}
#fixedmoves {
position: fixed;
top: 150px;
left: 150px;
background: green;
height: 100px;
width: 100px;
}
</style>
<body>
<div id="changetransform" style="transform: translateX(4px)">
<div id="abscovered"></div>
<div id="fixedmoves"></div>
</div>
<script>
var changetransform = document.getElementById("changetransform");
var fixedmoves = document.getElementById("fixedmoves");
var causeFlush = fixedmoves.offsetTop;
changetransform.style.transform = "";
</script>
</body>

49
layout/reftests/w3c-css/submitted/transforms/transform-containing-block-dynamic-1b.html Normal file
View File

@ -0,0 +1,49 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS transforms: Creating containing block for fixed positioned elements</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-rendering">
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-property">
<link rel="match" href="containing-block-dynamic-1-ref.html">
<meta name="assert" content="For elements whose layout is governed by the CSS box model, any value other than none for the transform results in the creation of both a stacking context and a containing block. The object acts as a containing block for fixed positioned descendants.">
<meta name="assert" content="The object acts as a containing block for fixed positioned descendants."
<meta name="flags" content="dom">
<style>
html, body { margin: 0; padding: 0 }
#changetransform {
position: absolute;
top: 100px;
left: 100px;
}
#abscovered {
position: absolute;
top: 50px;
left: 50px;
background: red;
height: 100px;
width: 100px;
}
#fixedmoves {
position: fixed;
top: 50px;
left: 50px;
background: green;
height: 100px;
width: 100px;
}
</style>
<body>
<div id="changetransform">
<div id="abscovered"></div>
<div id="fixedmoves"></div>
</div>
<script>
var changetransform = document.getElementById("changetransform");
var fixedmoves = document.getElementById("fixedmoves");
var causeFlush = fixedmoves.offsetTop;
changetransform.style.transform = "translateX(0px)";
</script>
</body>