[SPv2] Add CSS mask support

third_party/WebKit/Source/core/paint/PaintPropertyTreeBuilderTest.cpp

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 #include "core/paint/PaintPropertyTreeBuilderTest.h"
 
 #include "core/html/HTMLIFrameElement.h"
 #include "core/layout/LayoutTreeAsText.h"
 #include "core/paint/ObjectPaintProperties.h"
 #include "core/paint/PaintPropertyTreePrinter.h"
@@ skipping 2962 matching lines @@
   EXPECT_TRUE(
       getLayoutObjectByElementId("absolute")->container()->isLayoutBlock());
 }
 
 TEST_P(PaintPropertyTreeBuilderTest, SimpleFilter) {
   setBodyInnerHTML(
       "<div id='filter' style='filter:opacity(0.5); height:1000px;'>"
       "</div>");
   const ObjectPaintProperties* filterProperties =
       getLayoutObjectByElementId("filter")->paintProperties();
-  EXPECT_TRUE(filterProperties->effect()->parent()->isRoot());
+  EXPECT_TRUE(filterProperties->filter()->parent()->isRoot());
   EXPECT_EQ(frameScrollTranslation(),
-            filterProperties->effect()->localTransformSpace());
-  EXPECT_EQ(frameContentClip(), filterProperties->effect()->outputClip());
+            filterProperties->filter()->localTransformSpace());
+  EXPECT_EQ(frameContentClip(), filterProperties->filter()->outputClip());
 }
 
 TEST_P(PaintPropertyTreeBuilderTest, FilterReparentClips) {
   setBodyInnerHTML(
       "<div id='clip' style='overflow:hidden;'>"
       "  <div id='filter' style='filter:opacity(0.5); height:1000px;'>"
       "    <div id='child' style='position:fixed;'></div>"
       "  </div>"
       "</div>");
   const ObjectPaintProperties* clipProperties =
       getLayoutObjectByElementId("clip")->paintProperties();
   const ObjectPaintProperties* filterProperties =
       getLayoutObjectByElementId("filter")->paintProperties();
-  EXPECT_TRUE(filterProperties->effect()->parent()->isRoot());
+  EXPECT_TRUE(filterProperties->filter()->parent()->isRoot());
   EXPECT_EQ(frameScrollTranslation(),
-            filterProperties->effect()->localTransformSpace());
+            filterProperties->filter()->localTransformSpace());
   EXPECT_EQ(clipProperties->overflowClip(),
-            filterProperties->effect()->outputClip());
+            filterProperties->filter()->outputClip());
 
   const PropertyTreeState& childPaintState =
       *getLayoutObjectByElementId("child")
            ->paintProperties()
            ->localBorderBoxProperties();
 
   // This will change once we added clip expansion node.
-  EXPECT_EQ(filterProperties->effect()->outputClip(), childPaintState.clip());
-  EXPECT_EQ(filterProperties->effect(), childPaintState.effect());
+  EXPECT_EQ(filterProperties->filter()->outputClip(), childPaintState.clip());
+  EXPECT_EQ(filterProperties->filter(), childPaintState.effect());
 }
 
 TEST_P(PaintPropertyTreeBuilderTest, TransformOriginWithAndWithoutTransform) {
   setBodyInnerHTML(
       "<style>"
       "  body { margin: 0 }"
       "  div {"
       "    width: 400px;"
       "    height: 100px;"
       "  }"
@@ skipping 143 matching lines @@
   setBodyInnerHTML(
       "<div id='target' style='overflow: auto; width: 100px; height: 100px'>"
       "  <div style='width: 200px; height: 200px'></div>"
       "</div>");
 
   const ObjectPaintProperties* properties = paintPropertiesForElement("target");
   EXPECT_NE(CompositorElementId(),
             properties->scrollTranslation()->compositorElementId());
 }
 
+TEST_P(PaintPropertyTreeBuilderTest, MaskSimple) {
+  setBodyInnerHTML(
+      "<div id='target' style='width:300px; height:200px; "
+      "-webkit-mask:linear-gradient(red,red)'>"
+      "  Lorem ipsum"
+      "</div>");
+
+  const ObjectPaintProperties* properties = paintPropertiesForElement("target");
+  const ClipPaintPropertyNode* outputClip = properties->maskClip();
+
+  EXPECT_EQ(outputClip, properties->localBorderBoxProperties()->clip());
+  EXPECT_EQ(frameContentClip(), outputClip->parent());
+  EXPECT_EQ(FloatRoundedRect(8, 8, 300, 200), outputClip->clipRect());
+
+  EXPECT_EQ(properties->effect(),
+            properties->localBorderBoxProperties()->effect());
+  EXPECT_TRUE(properties->effect()->parent()->isRoot());
+  EXPECT_EQ(SkBlendMode::kSrcOver, properties->effect()->blendMode());
+  EXPECT_EQ(outputClip, properties->effect()->outputClip());
+
+  EXPECT_EQ(properties->effect(), properties->mask()->parent());
+  EXPECT_EQ(SkBlendMode::kDstIn, properties->mask()->blendMode());
+  EXPECT_EQ(outputClip, properties->mask()->outputClip());
+}
+
+TEST_P(PaintPropertyTreeBuilderTest, MaskUnescapeClip) {

[chrishtr, 2017/02/13 23:23:49]

MaskEscapeClip?

[trchen, 2017/02/14 01:37:30]

Done. Actually this test is not very good. I changed it to a more complex one.

+  // This test verifies an abs-pos element still escape the scroll of a
+  // static-pos ancestor, but gets clipped due to the presence of a mask.
+  setBodyInnerHTML(
+      "<div id='target' style='width:300px; height:200px; overflow:scroll; "
+      "-webkit-mask:linear-gradient(red,red)'>"
+      "  <div id='normal' style='position:relative; height:1000px;'>Lorem "
+      "ipsum</div>"
+      "  <div id='absolute' style='position:absolute; left:0; top:0;'>Lorem "
+      "ipsum</div>"
+      "</div>");
+
+  const ObjectPaintProperties* properties = paintPropertiesForElement("target");
+  const ClipPaintPropertyNode* outputClip = properties->maskClip();
+
+  EXPECT_EQ(framePreTranslation(),
+            properties->localBorderBoxProperties()->transform());
+
+  EXPECT_EQ(outputClip, properties->localBorderBoxProperties()->clip());
+  EXPECT_EQ(frameContentClip(), outputClip->parent());
+  EXPECT_EQ(FloatRoundedRect(8, 8, 300, 200), outputClip->clipRect());
+
+  EXPECT_EQ(properties->effect(),
+            properties->localBorderBoxProperties()->effect());
+  EXPECT_TRUE(properties->effect()->parent()->isRoot());
+  EXPECT_EQ(SkBlendMode::kSrcOver, properties->effect()->blendMode());
+  EXPECT_EQ(outputClip, properties->effect()->outputClip());
+
+  EXPECT_EQ(properties->effect(), properties->mask()->parent());
+  EXPECT_EQ(SkBlendMode::kDstIn, properties->mask()->blendMode());
+  EXPECT_EQ(outputClip, properties->mask()->outputClip());
+
+  const ObjectPaintProperties* properties2 =
+      paintPropertiesForElement("normal");
+  EXPECT_EQ(properties->scrollTranslation(),
+            properties2->localBorderBoxProperties()->transform());
+  EXPECT_EQ(properties->overflowClip(),
+            properties2->localBorderBoxProperties()->clip());
+
+  const ObjectPaintProperties* properties3 =
+      paintPropertiesForElement("absolute");
+  EXPECT_EQ(framePreTranslation(),
+            properties3->localBorderBoxProperties()->transform());
+  EXPECT_EQ(outputClip, properties3->localBorderBoxProperties()->clip());
+}
+
+TEST_P(PaintPropertyTreeBuilderTest, MaskInline) {
+  // This test verifies CSS mask applied on an inline element is clipped to
+  // the line box of the said element. In this test the masked element has
+  // only one box, and one of the child element overflows the box.
+  setBodyInnerHTML(
+      "<span style='display:inline-block; width:50px;'></span>"
+      "<span id='target' style='-webkit-mask:linear-gradient(red,red); "
+      "font-size:16px;'>"
+      "  <span style='display:inline-block; width:50px;'></span>"
+      "  <span id='overflowing' style='position:relative; font-size:32px;'>"
+      "    <span style='display:inline-block; width:50px;'></span>"
+      "  </span>"
+      "  <span style='display:inline-block; width:50px;'></span>"
+      "</span>");
+
+  const ObjectPaintProperties* properties = paintPropertiesForElement("target");
+  const ClipPaintPropertyNode* outputClip = properties->maskClip();
+
+  EXPECT_EQ(outputClip, properties->localBorderBoxProperties()->clip());
+  EXPECT_EQ(frameContentClip(), outputClip->parent());
+  EXPECT_EQ(FloatRoundedRect(58, 23, 170, 19), outputClip->clipRect());
+
+  EXPECT_EQ(properties->effect(),
+            properties->localBorderBoxProperties()->effect());
+  EXPECT_TRUE(properties->effect()->parent()->isRoot());
+  EXPECT_EQ(SkBlendMode::kSrcOver, properties->effect()->blendMode());
+  EXPECT_EQ(outputClip, properties->effect()->outputClip());
+
+  EXPECT_EQ(properties->effect(), properties->mask()->parent());
+  EXPECT_EQ(SkBlendMode::kDstIn, properties->mask()->blendMode());
+  EXPECT_EQ(outputClip, properties->mask()->outputClip());
+
+  const ObjectPaintProperties* properties2 =
+      paintPropertiesForElement("overflowing");
+  EXPECT_EQ(outputClip, properties2->localBorderBoxProperties()->clip());
+  EXPECT_EQ(properties->effect(),
+            properties2->localBorderBoxProperties()->effect());
+}
+
 }  // namespace blink