Bug 976533 - Add a reftest. r=roc
authorHoria Iosif Olaru <olaru@adobe.com>
Fri, 28 Feb 2014 09:11:37 -0500
changeset 171506 43137b4b4b2a3a2ff37456063274ef93a298d03a
parent 171505 3bbd029605a2533a891b8202c465e7d0ae017e59
child 171507 7e217afc70021b83999d60bf39b7a5cd90a7ef36
push id270
push userpvanderbeken@mozilla.com
push dateThu, 06 Mar 2014 09:24:21 +0000
reviewersroc
bugs976533
milestone30.0a1
Bug 976533 - Add a reftest. r=roc
layout/reftests/css-blending/mix-blend-mode-nested-976533-ref.html
layout/reftests/css-blending/mix-blend-mode-nested-976533.html
layout/reftests/css-blending/reftest.list
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-blending/mix-blend-mode-nested-976533-ref.html
@@ -0,0 +1,47 @@
+<!DOCTYPE HTML>
+<head>
+	<style>
+		.parent {
+		  width: 200px;
+		  height: 200px;
+		  position: absolute;
+		  z-index: 1;
+			background-color: #00ff00;
+		}
+
+		.intermediate {
+			width: 100px;
+		  height: 100px;
+		  margin-left:50px;
+		  background-color: #ffffff;
+		}
+
+		.child {
+		  width: 100px;
+		  height: 100px;
+		  margin-left:50px;
+		  background-color: #00ffff;
+		}
+
+		.grandchild {
+			width: 50px;
+			height: 100px;
+			margin-left: 50px;
+			background-color: #0000ff;
+		}
+
+		body {
+			margin:0px;
+		}
+
+	</style>
+</head>
+<body>
+	<div class="parent">
+		<div class="intermediate">
+	    <div class="child">
+	    	<div class="grandchild"></div>
+	    </div>
+    </div>
+	</div>
+</body>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-blending/mix-blend-mode-nested-976533.html
@@ -0,0 +1,45 @@
+<!DOCTYPE HTML>
+<head>
+	<style>
+		.parent {
+		  width: 200px;
+		  height: 200px;
+		  position: absolute;
+		  z-index: 1;
+			background-color: #00ff00;
+		}
+
+		.intermediate {
+			width: 100px;
+		  height: 100px;
+		  margin-left:50px;
+		  background-color: #ff00ff;
+		  mix-blend-mode: difference;
+		}
+
+		.child {
+		  width: 100px;
+		  height: 100px;
+		  margin-left:50px;
+		  background-color: #00ffff;
+		  mix-blend-mode: multiply;
+		}
+
+		body {
+			margin:0px;
+		}
+	</style>
+	<!-- Blending should happen as follows:
+				First, the child element should blend with the intermediate element, with
+				the multiply operator. Is should not blend with the parent directly.
+				Then, group formed by the blended child and the intermediate element should
+				blend with the parent as a single layer.
+	 -->
+</head>
+<body>
+	<div class="parent">
+		<div class="intermediate">
+	    <div class="child"></div>
+    </div>
+	</div>
+</body>
--- a/layout/reftests/css-blending/reftest.list
+++ b/layout/reftests/css-blending/reftest.list
@@ -37,16 +37,18 @@ fuzzy-if(azureQuartz,1,1600) fuzzy-if(d2
 
 fuzzy-if(azureQuartz,2,40000) fuzzy-if(azureSkia||d2d||gtk2Widget,1,40000) pref(layout.css.background-blend-mode.enabled,true) == background-blending-image-color-959674.html background-blending-image-color-959674-ref.html
 
 #fuzzy due to inconsistencies in rounded rect cliping between parent and child; may be related to antialiasing. Between platforms, the max difference is the same, and the number of different pixels is either 36 or 37. (Win, Mac and Lin)
 fuzzy(64,37) pref(layout.css.mix-blend-mode.enabled,true) == mix-blend-mode-952051.html mix-blend-mode-952051-ref.html
 
 pref(layout.css.mix-blend-mode.enabled,true) == mix-blend-mode-child-of-blended-has-opacity.html mix-blend-mode-child-of-blended-has-opacity-ref.html
 
+pref(layout.css.mix-blend-mode.enabled,true) == mix-blend-mode-nested-976533.html mix-blend-mode-nested-976533-ref.html
+
 # Test plan 5.3.1 Blending between the background layers and the background color for an element with background-blend-mode
 # Test 9
 pref(layout.css.background-blend-mode.enabled,true) == background-blending-image-color-svg-as-data-uri.html background-blending-image-color-ref.html
 # Test 10
 pref(layout.css.background-blend-mode.enabled,true) == background-blending-image-color-gif.html background-blending-image-color-gif-ref.html
 pref(layout.css.background-blend-mode.enabled,true) == background-blending-image-color-transform3d.html background-blending-image-color-ref.html
 
 # Test plan 5.3.2 Background layers do not blend with content outside the background (or behind the element) - tests 2 and 3