Bug 505115 - Part 13 - Add basic reftests for 3d transforms. r=roc
authorMatt Woodrow <mwoodrow@mozilla.com>
Wed, 31 Aug 2011 14:03:43 +1200
changeset 76247 819f2a8e13189a7178b58df59be25e92728b48b6
parent 76246 62b958e49c664f69d691660423005c92f242ea7f
child 76248 9f201033b0e6531650c460044d87efacd0a69984
push id1584
push usermwoodrow@mozilla.com
push dateWed, 31 Aug 2011 02:04:11 +0000
treeherdermozilla-inbound@9f201033b0e6 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersroc
bugs505115
milestone9.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 505115 - Part 13 - Add basic reftests for 3d transforms. r=roc
layout/reftests/reftest.list
layout/reftests/transform-3d/backface-visibility-1a.html
layout/reftests/transform-3d/backface-visibility-1b.html
layout/reftests/transform-3d/matrix3d-1-ref.html
layout/reftests/transform-3d/matrix3d-1a.html
layout/reftests/transform-3d/matrix3d-2-ref.html
layout/reftests/transform-3d/matrix3d-2a.html
layout/reftests/transform-3d/perspective-origin-1a.html
layout/reftests/transform-3d/perspective-origin-1b.html
layout/reftests/transform-3d/preserve3d-1-ref.html
layout/reftests/transform-3d/preserve3d-1a.html
layout/reftests/transform-3d/preserve3d-1b.html
layout/reftests/transform-3d/reftest.list
layout/reftests/transform-3d/rotate3d-1a.html
layout/reftests/transform-3d/rotate3d-2a.html
layout/reftests/transform-3d/rotatex-1-ref.html
layout/reftests/transform-3d/rotatex-1a.html
layout/reftests/transform-3d/rotatex-perspective-1a.html
layout/reftests/transform-3d/rotatex-perspective-1b.html
layout/reftests/transform-3d/rotatex-perspective-1c.html
layout/reftests/transform-3d/rotatey-1-ref.html
layout/reftests/transform-3d/rotatey-1a.html
layout/reftests/transform-3d/scale3d-1-ref.html
layout/reftests/transform-3d/scale3d-2-ref.html
layout/reftests/transform-3d/scale3d-all.html
layout/reftests/transform-3d/scale3d-xz.html
layout/reftests/transform-3d/scale3d-z.html
layout/reftests/transform-3d/scalez-1-ref.html
layout/reftests/transform-3d/scalez-1a.html
layout/reftests/transform-3d/scalezrotatex-1-ref.html
layout/reftests/transform-3d/scalezrotatex-1.html
layout/reftests/transform-3d/translate3d-1-ref.html
layout/reftests/transform-3d/translate3d-1a.html
layout/reftests/transform-3d/translatez-1-ref.html
layout/reftests/transform-3d/translatez-1a.html
layout/reftests/transform-3d/translatez-1b.html
--- a/layout/reftests/reftest.list
+++ b/layout/reftests/reftest.list
@@ -268,16 +268,19 @@ skip-if(Android) include text-shadow/ref
 include ../../toolkit/themes/pinstripe/reftests/reftest.list
 
 # text-transform/
 include text-transform/reftest.list
 
 # -moz-transform/
 include transform/reftest.list
 
+# 3d transforms - disabled currently
+#include transform-3d/reftest.list
+
 # unicode/ (verify that we don't do expend effort doing unicode-aware case checks)
 include unicode/reftest.list
 
 # widget/
 include ../../widget/reftests/reftest.list
 
 # xml-stylesheet/
 include ../../content/test/reftest/xml-stylesheet/reftest.list
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/backface-visibility-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(180deg); -moz-backface-visibility: visible; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/backface-visibility-1b.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(180deg); -moz-backface-visibility: hidden; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/matrix3d-1-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: matrix(1,2,3,4,5,6); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/matrix3d-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: matrix3d(1,2,0,0,3,4,0,0,0,0,1,0,5,6,0,1); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/matrix3d-2-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: scale3d(1,2,3) translate3d(4px,5px,6px); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/matrix3d-2a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: matrix3d(1,0,0,0,0,2,0,0,0,0,3,0,4,5,6,1); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/perspective-origin-1a.html
@@ -0,0 +1,11 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-perspective: 1000px; -moz-perspective-origin: 0 0;">
+    <div style="-moz-transform: rotatex(45deg); width: 100px; height: 100px;">
+      Test Text
+    </div>
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/perspective-origin-1b.html
@@ -0,0 +1,11 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-perspective: 1000px; -moz-perspective-origin: top left;">
+    <div style="-moz-transform: rotatex(45deg); width: 100px; height: 100px;">
+      Test Text
+    </div>
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/preserve3d-1-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(180deg); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/preserve3d-1a.html
@@ -0,0 +1,15 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(90deg); -moz-transform-style: preserve-3d;">
+    <div style="-moz-transform: rotatex(90deg); -moz-transform-style: preserve-3d;">
+      <div style="-moz-transform: rotatex(90deg); -moz-transform-style: preserve-3d;">
+        <div style="-moz-transform: rotatex(90deg); width: 100px; height: 100px;">
+          Test Text
+        </div>
+      </div>
+    </div>
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/preserve3d-1b.html
@@ -0,0 +1,11 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(90deg);">
+    <div style="-moz-transform: rotatex(90deg); width: 100px; height: 100px;">
+      Test Text
+    </div>
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/reftest.list
@@ -0,0 +1,27 @@
+== rotatey-1a.html rotatey-1-ref.html 
+== rotatex-1a.html rotatex-1-ref.html 
+# Check that scaleZ(-1) rotateX(180deg) is the same as rotateY(180deg)
+== scalezrotatex-1.html scalezrotatex-1-ref.html
+# Check that the perspectve() transform function results in some visual changes
+!= rotatex-perspective-1a.html rotatex-1-ref.html
+# Check that -moz-perspective results in visual changes to child transformed elements
+!= rotatex-perspective-1b.html rotatex-1-ref.html
+# -moz-perspective should only apply to child elements
+== rotatex-perspective-1c.html rotatex-1-ref.html
+== scalez-1a.html scalez-1-ref.html
+fails == preserve3d-1a.html preserve3d-1-ref.html
+== preserve3d-1b.html about:blank
+== scale3d-z.html scalez-1-ref.html
+== scale3d-all.html scale3d-1-ref.html
+== scale3d-xz.html scale3d-2-ref.html
+== translatez-1a.html translatez-1-ref.html
+!= translatez-1b.html translatez-1-ref.html
+== translate3d-1a.html translate3d-1-ref.html
+== matrix3d-1a.html matrix3d-1-ref.html
+== matrix3d-2a.html matrix3d-2-ref.html
+== rotate3d-1a.html rotatex-1-ref.html
+== rotate3d-2a.html rotatey-1-ref.html
+!= backface-visibility-1a.html about:blank
+== backface-visibility-1b.html about:blank
+!= perspective-origin-1a.html rotatex-perspective-1a.html
+== perspective-origin-1b.html perspective-origin-1a.html
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotate3d-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotate3d(1, 0, 0, 45deg); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotate3d-2a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotate3d(0, 1, 0, 45deg); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotatex-1-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(45deg); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotatex-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(45deg) rotatey(360deg) rotatex(360deg); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotatex-perspective-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: perspective(1000px) rotatex(45deg); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotatex-perspective-1b.html
@@ -0,0 +1,11 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-perspective: 1000px;">
+    <div style="-moz-transform: perspective(1000px) rotatex(45deg); width: 100px; height: 100px;">
+      Test Text
+    </div>
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotatex-perspective-1c.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(45deg); -moz-perspective: 1000px; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotatey-1-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatey(45deg); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/rotatey-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatey(45deg) rotatey(360deg); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scale3d-1-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: scaleX(2) scaleY(2) scaleZ(2); -moz-transform-origin: 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scale3d-2-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: scaleX(2) scaleY(2); -moz-transform-origin: 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scale3d-all.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: scale3D(2,2,2); -moz-transform-origin: 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scale3d-xz.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(90deg) scale3D(2,1,2) rotatex(-90deg); -moz-transform-origin: 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scale3d-z.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(90deg) scale3D(1,1,2) rotatex(-90deg); -moz-transform-origin: 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scalez-1-ref.html
@@ -0,0 +1,10 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: scaleY(2); -moz-transform-origin: 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
+
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scalez-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(90deg) scaleZ(2) rotatex(-90deg); -moz-transform-origin: 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scalezrotatex-1-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: scaleY(-1); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/scalezrotatex-1.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(180deg) scaleZ(-1); width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/translate3d-1-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(45deg); -moz-transform-origin: 10 30 -10; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/translate3d-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: translate3d(10px, 30px, -10px) rotatex(45deg) translate3d(-10px, -30px, 10px); -moz-transform-origin: 0 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/translatez-1-ref.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: rotatex(45deg); -moz-transform-origin: 0 0 -10; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/translatez-1a.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: translatez(-10px) rotatex(45deg) translatez(10px); -moz-transform-origin: 0 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/transform-3d/translatez-1b.html
@@ -0,0 +1,9 @@
+<html>
+<head>
+</head>
+<body>
+  <div style="-moz-transform: translatez(-20px) rotatex(45deg) translatez(20px); -moz-transform-origin: 0 0 0; width: 100px; height: 100px;">
+    Test Text
+  </div>
+</body>
+</html>