Bug 759568 - Part 5. reftest for background-clip:text; r=dbaron
authorCJKu <cku@mozilla.com>
Thu, 14 Apr 2016 16:28:07 +0800
changeset 331120 a1d45ed2cb6388405977e6b3c5ad09eaab78f7c4
parent 331119 3b022b5f27475daff60dc0e6b171a93fa359bd40
child 331121 7baeeb594c97bf30c780108f7ce6e0bb2c458cb3
push id6048
push userkmoir@mozilla.com
push dateMon, 06 Jun 2016 19:02:08 +0000
treeherdermozilla-beta@46d72a56c57d [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdbaron
bugs759568
milestone48.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 759568 - Part 5. reftest for background-clip:text; r=dbaron MozReview-Commit-ID: DXl7mHnTxbL
layout/reftests/backgrounds/background-clip-text-1-ref.html
layout/reftests/backgrounds/background-clip-text-1a.html
layout/reftests/backgrounds/background-clip-text-1b.html
layout/reftests/backgrounds/background-clip-text-1c.html
layout/reftests/backgrounds/background-clip-text-1d.html
layout/reftests/backgrounds/reftest.list
new file mode 100644
--- /dev/null
+++ b/layout/reftests/backgrounds/background-clip-text-1-ref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>background-clip: text reference</title>
+  </head>
+  <body style="margin: 0px;">
+    <div style="width: 500px; height: 300px;">
+      <svg xmlns="http://www.w3.org/2000/svg" width="500px" height="300px">
+        <defs>
+          <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
+            <stop offset="0%" style="stop-color:green;stop-opacity:1" />
+            <stop offset="100%" style="stop-color:green;stop-opacity:1" />
+          </linearGradient>
+        </defs>
+        <text x="0" y="200" font-size="100px" fill="url(#grad1)" font-family="serif">TEXT clip</text>
+      </svg>
+    </div>
+  </body>
+</html>
\ No newline at end of file
new file mode 100644
--- /dev/null
+++ b/layout/reftests/backgrounds/background-clip-text-1a.html
@@ -0,0 +1,24 @@
+<!doctype HTML>
+<html>
+  <head>
+    <title>background-clip: text</title>
+    <style>
+      div.out {
+        width: 500px;
+        height: 300px;
+        margin: 0px;
+        background-image: linear-gradient(green, green);
+        background-clip: text;
+        color: transparent;
+        font-size: 100px;
+        font-family: serif;
+      }
+    </style>
+  </head>
+  <body style="margin: 0px;">
+    <div class="out">
+      TEXT clip
+      <div style="display:inline-block; width:0px; height:200px;"/>
+    </div>
+  </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/backgrounds/background-clip-text-1b.html
@@ -0,0 +1,24 @@
+<!doctype HTML>
+<html>
+  <head>
+    <title>background-clip: text</title>
+    <style>
+      div.out {
+        width: 500px;
+        height: 300px;
+        margin: 0px;
+        background-image: linear-gradient(green, green);
+        background-clip: text;
+        color: transparent;
+        font-size: 100px;
+        font-family: serif;
+      }
+    </style>
+  </head>
+  <body style="margin: 0px;">
+    <div class="out">
+      <p style="display:inline-block;">TEXT clip</p>
+      <div style="display:inline-block; width:0px; height:200px;"/>
+    </div>
+  </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/backgrounds/background-clip-text-1c.html
@@ -0,0 +1,26 @@
+<!doctype HTML>
+<html>
+  <head>
+    <title>background-clip: text</title>
+    <style>
+      div.out {
+        width: 500px;
+        height: 300px;
+        margin: 0px;
+        background-image: linear-gradient(green, green);
+        background-clip: text;
+        color: transparent;
+        font-size: 100px;
+        font-family: serif;
+      }
+    </style>
+  </head>
+  <body style="margin: 0px;">
+    <div class="out">
+      <div style="display:inline-block;">
+        <p style="display:inline-block;">TEXT clip</p>
+      </div>
+      <div style="display:inline-block; width:0px; height:200px;"/>
+    </div>
+  </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/backgrounds/background-clip-text-1d.html
@@ -0,0 +1,23 @@
+<!doctype HTML>
+<html>
+  <head>
+    <title>background-clip: text</title>
+    <style>
+      div.out {
+        width: 500px;
+        height: 300px;
+        margin: 0px;
+        background: linear-gradient(green, green) padding-box text;
+        color: transparent;
+        font-size: 100px;
+        font-family: serif;
+      }
+    </style>
+  </head>
+  <body style="margin: 0px;">
+    <div class="out">
+      TEXT clip
+      <div style="display:inline-block; width:0px; height:200px;"/>
+    </div>
+  </body>
+</html>
--- a/layout/reftests/backgrounds/reftest.list
+++ b/layout/reftests/backgrounds/reftest.list
@@ -160,8 +160,14 @@ fuzzy(50,500) == attachment-local-clippi
 fuzzy(16,69) fuzzy-if(skiaContent,64,1300) == attachment-local-clipping-image-4.html attachment-local-clipping-image-4-ref.html
 fuzzy(16,69) fuzzy-if(skiaContent,64,1300) == attachment-local-clipping-image-5.html attachment-local-clipping-image-4-ref.html
 fuzzy(80,500) == attachment-local-clipping-image-6.html attachment-local-clipping-image-6-ref.html
 
 fuzzy-if(skiaContent,1,8) == background-multiple-with-border-radius.html background-multiple-with-border-radius-ref.html
 == background-repeat-large-area.html background-repeat-large-area-ref.html
 
 fuzzy(30,474) fuzzy-if(skiaContent,31,474) == background-tiling-zoom-1.html background-tiling-zoom-1-ref.html
+
+pref(layout.css.background-clip-text.enabled,true) fuzzy-if(winWidget,1,44) == background-clip-text-1a.html background-clip-text-1-ref.html
+pref(layout.css.background-clip-text.enabled,true) fuzzy-if(winWidget,1,44) == background-clip-text-1b.html background-clip-text-1-ref.html
+pref(layout.css.background-clip-text.enabled,true) fuzzy-if(winWidget,1,44) == background-clip-text-1c.html background-clip-text-1-ref.html
+pref(layout.css.background-clip-text.enabled,true) fuzzy-if(winWidget,1,44) == background-clip-text-1d.html background-clip-text-1-ref.html
+pref(layout.css.background-clip-text.enabled,false) != background-clip-text-1a.html background-clip-text-1-ref.html