diff options
Diffstat (limited to 'layout/reftests/position-dynamic-changes/relative')
13 files changed, 192 insertions, 0 deletions
diff --git a/layout/reftests/position-dynamic-changes/relative/animate.js b/layout/reftests/position-dynamic-changes/relative/animate.js new file mode 100644 index 0000000000..38598e1d34 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/animate.js @@ -0,0 +1,30 @@ +var rfa = null; +if (window.requestAnimationFrame) { + rfa = requestAnimationFrame; +} else if (window.webkitRequestAnimationFrame) { + rfa = webkitRequestAnimationFrame; +} else if (window.msRequestAnimationFrame) { + rfa = msRequestAnimationFrame; +} else if (window.oRequestAnimationFrame) { + rfa = oRequestAnimationFrame; +} + +function animate(params, count) { + rfa(function() { + animateStep(params, count); + }); +} + +function animateStep(params, count) { + if (!count) { + document.documentElement.removeAttribute("class"); + return; + } + var rel = document.getElementById("rel"); + for (prop in params) { + rel.style[prop] = (parseInt(rel.style[prop]) + params[prop]) + "px"; + } + rfa(function() { + animateStep(params, count - 10); + }); +} diff --git a/layout/reftests/position-dynamic-changes/relative/move-right-bottom-ref.html b/layout/reftests/position-dynamic-changes/relative/move-right-bottom-ref.html new file mode 100644 index 0000000000..8e364b3679 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/move-right-bottom-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<html> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + </head> + <body> + <div id="container" + >surrounding <span id="rel" + style="left: 200px; top: 100px;" + >position relative</span> text</div> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/move-right-bottom-table-ref.html b/layout/reftests/position-dynamic-changes/relative/move-right-bottom-table-ref.html new file mode 100644 index 0000000000..82f5225969 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/move-right-bottom-table-ref.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<html> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + </head> + <body> + <div id="container"> + <table id="rel" style="left: 200px; top: 100px;"> + <tr><td>position relative</td></tr> + </table> + </div> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/move-right-bottom-table.html b/layout/reftests/position-dynamic-changes/relative/move-right-bottom-table.html new file mode 100644 index 0000000000..a2df018d41 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/move-right-bottom-table.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html class="reftest-wait"> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + <script src="animate.js" type="text/javascript"></script> + </head> + <body> + <div id="container"> + <table id="rel" style="left: 0; top: 0;"> + <tr><td>position relative</td></tr> + </table> + </div> + <script> + animate({top: 10, left: 20}, 100); + </script> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/move-right-bottom.html b/layout/reftests/position-dynamic-changes/relative/move-right-bottom.html new file mode 100644 index 0000000000..f283f3ace6 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/move-right-bottom.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html class="reftest-wait"> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + <script src="animate.js" type="text/javascript"></script> + </head> + <body> + <div id="container" + >surrounding <span id="rel" + style="left: 0; top: 0;" + >position relative</span> text</div> + <script> + animate({top: 10, left: 20}, 100); + </script> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/move-top-left-ref.html b/layout/reftests/position-dynamic-changes/relative/move-top-left-ref.html new file mode 100644 index 0000000000..48f0a8d1d6 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/move-top-left-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<html> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + </head> + <body> + <div id="container" + >surrounding <span id="rel" + style="right: -200px; bottom: -300px;" + >position relative</span> text</div> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/move-top-left-table-ref.html b/layout/reftests/position-dynamic-changes/relative/move-top-left-table-ref.html new file mode 100644 index 0000000000..748e1d7eec --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/move-top-left-table-ref.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<html> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + </head> + <body> + <div id="container"> + <table id="rel" style="right: -200px; bottom: -300px;"> + <tr><td>position relative</td></tr> + </table> + </div> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/move-top-left-table.html b/layout/reftests/position-dynamic-changes/relative/move-top-left-table.html new file mode 100644 index 0000000000..e9eb3a981f --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/move-top-left-table.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html class="reftest-wait"> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + <script src="animate.js" type="text/javascript"></script> + </head> + <body> + <div id="container"> + <table id="rel" style="right: -400px; bottom: -400px;"> + <tr><td>position relative</td></tr> + </table> + </div> + <script> + animate({bottom: 10, right: 20}, 100); + </script> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/move-top-left.html b/layout/reftests/position-dynamic-changes/relative/move-top-left.html new file mode 100644 index 0000000000..ec92ea4392 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/move-top-left.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html class="reftest-wait"> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + <script src="animate.js" type="text/javascript"></script> + </head> + <body> + <div id="container" + >surrounding <span id="rel" + style="right: -400px; bottom: -400px;" + >position relative</span> text</div> + <script> + animate({bottom: 10, right: 20}, 100); + </script> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/percent-ref.html b/layout/reftests/position-dynamic-changes/relative/percent-ref.html new file mode 100644 index 0000000000..cb496b0b52 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/percent-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<html> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + </head> + <body> + <div id="container" style="border-width: 10px; padding: 50px" + >surrounding <span id="rel" + style="left: 50%; top: 50%;" + >position relative</span> text</div> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/percent.html b/layout/reftests/position-dynamic-changes/relative/percent.html new file mode 100644 index 0000000000..18513256b7 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/percent.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html class="reftest-wait"> + <head> + <link rel="stylesheet" type="text/css" href="style.css"> + </head> + <body> + <div id="container" style="border-width: 10px; padding: 50px" + >surrounding <span id="rel" + style="left: 0; top: 0;" + >position relative</span> text</div> + <script> + document.addEventListener("MozReftestInvalidate", function() { + var rel = document.getElementById("rel"); + rel.style.top = "50%"; + rel.style.left = "50%"; + document.documentElement.removeAttribute("class"); + }); + </script> + </body> +</html> diff --git a/layout/reftests/position-dynamic-changes/relative/reftest.list b/layout/reftests/position-dynamic-changes/relative/reftest.list new file mode 100644 index 0000000000..320fad98b2 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/reftest.list @@ -0,0 +1,5 @@ +fuzzy-if(cocoaWidget,0-1,0-2) fuzzy-if(d2d,0-47,0-26) fuzzy-if(asyncPan&&!layersGPUAccelerated,0-169,0-970) == move-right-bottom.html move-right-bottom-ref.html +fuzzy-if(cocoaWidget,0-1,0-2) fuzzy-if(asyncPan&&!layersGPUAccelerated,0-169,0-970) == move-top-left.html move-top-left-ref.html # Bug 688545 +fuzzy-if(cocoaWidget,0-1,0-3) fuzzy-if(asyncPan&&!layersGPUAccelerated,0-144,0-580) == move-right-bottom-table.html move-right-bottom-table-ref.html +fuzzy-if(cocoaWidget,0-1,0-3) fuzzy-if(asyncPan&&!layersGPUAccelerated,0-144,0-580) == move-top-left-table.html move-top-left-table-ref.html # Bug 688545 +== percent.html percent-ref.html diff --git a/layout/reftests/position-dynamic-changes/relative/style.css b/layout/reftests/position-dynamic-changes/relative/style.css new file mode 100644 index 0000000000..92a977bff7 --- /dev/null +++ b/layout/reftests/position-dynamic-changes/relative/style.css @@ -0,0 +1,9 @@ +#container { + width: 400px; + height: 400px; + border: 1px solid red; +} +#rel { + white-space: pre; + position: relative; +} |