Fix the bug that negative outline-offset is covered up by composited

third_party/WebKit/Source/core/layout/compositing/CompositedLayerMapping.cpp

 /*
  * Copyright (C) 2009, 2010, 2011 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  * 1. Redistributions of source code must retain the above copyright
  *    notice, this list of conditions and the following disclaimer.
  * 2. Redistributions in binary form must reproduce the above copyright
  *    notice, this list of conditions and the following disclaimer in the
@@ skipping 541 matching lines @@
 
   if (updateClippingLayers(needsAncestorClip, needsDescendantsClippingLayer))
     layerConfigChanged = true;
 
   bool scrollingConfigChanged = false;
   if (updateScrollingLayers(m_owningLayer.needsCompositedScrolling())) {
     layerConfigChanged = true;
     scrollingConfigChanged = true;
   }
 
+  // The decoration layer is currently used for painting outline with negative
+  // offset that would be covered up by the composited scrolling contents layer
+  // and scrollbars.
+  if (updateDecorationLayer(m_owningLayer.getScrollableArea()->usesCompositedScrolling()) &&

[flackr, 2016/10/25 19:48:10]

Can you move this condition to a boolean similar to needsAncestorClip? Also, it
looks like you're only passing usesCompositedScrolling() for
needsDecorationLayer.

[yigu, 2016/10/25 20:58:44]

This bug has been fixed in patch 4.

+      layoutObject->style()->hasOutline() && layoutObject->style()->outlineOffset() < 0)

[flackr, 2016/10/25 19:48:10]

In fact, now that I think about it this should be less than the minimum negative
border width (i.e. same check that we have in
LayoutBoxModelObject::hasLocalEquivalentBackground). Can you remove the check
for negative outline offset there since with this patch we can now composite it
correctly?

[yigu, 2016/10/25 20:58:44]

Done.

+    layerConfigChanged = true;
+
   if (updateOverflowControlsLayers(
           requiresHorizontalScrollbarLayer(), requiresVerticalScrollbarLayer(),
           requiresScrollCornerLayer(), needsAncestorClip))
     layerConfigChanged = true;
 
   bool hasPerspective = style.hasPerspective();
   bool needsChildTransformLayer = hasPerspective && layoutObject->isBox();
   if (updateChildTransformLayer(needsChildTransformLayer))
     layerConfigChanged = true;
 
@@ skipping 365 matching lines @@
     clippingBox = clipBox(toLayoutBox(layoutObject()));
 
   updateChildTransformLayerGeometry();
   updateChildContainmentLayerGeometry(clippingBox, localCompositingBounds);
 
   updateMaskLayerGeometry();
   updateTransformGeometry(snappedOffsetFromCompositedAncestor,
                           relativeCompositingBounds);
   updateForegroundLayerGeometry(contentsSize, clippingBox);
   updateBackgroundLayerGeometry(contentsSize);
+  updateDecorationLayerGeometry(contentsSize);

[flackr, 2016/10/25 19:48:10]

It seems to me that the sizes of these layers will be larger than they need to
be. Consider for example:

outline: 20px solid blue;
outline-offset: -5px;

This should result in only the decoration layer being 15px larger than the
element since the background and foreground layers will no longer draw the
outline. For now, it's probably safe to have the layers be the same size but we
should fix this in the future. Can you leave a TODO to only make the layers as
large as they need to be?

[yigu, 2016/10/25 20:58:44]

TODO added.

   updateScrollingLayerGeometry(localCompositingBounds);
   updateChildClippingMaskLayerGeometry();
 
   if (m_owningLayer.getScrollableArea() &&
       m_owningLayer.getScrollableArea()->scrollsOverflow())
     m_owningLayer.getScrollableArea()->positionOverflowControls();
 
   updateLayerBlendMode(layoutObject()->styleRef());
   updateIsRootForIsolatedGroup();
   updateContentsRect();
@@ skipping 407 matching lines @@
   }
   m_backgroundLayer->setPosition(FloatPoint());
   if (backgroundSize != m_backgroundLayer->size()) {
     m_backgroundLayer->setSize(backgroundSize);
     m_backgroundLayer->setNeedsDisplay();
   }
   m_backgroundLayer->setOffsetFromLayoutObject(
       m_graphicsLayer->offsetFromLayoutObject());
 }
 
+void CompositedLayerMapping::updateDecorationLayerGeometry(
+    const FloatSize& relativeCompositingBoundsSize) {
+  if (!m_decorationLayer)
+    return;
+  FloatSize decorationSize = relativeCompositingBoundsSize;
+  m_decorationLayer->setPosition(FloatPoint());
+  if (decorationSize != m_decorationLayer->size()) {
+    m_decorationLayer->setSize(decorationSize);
+    m_decorationLayer->setNeedsDisplay();
+  }
+  m_decorationLayer->setOffsetFromLayoutObject(
+      m_graphicsLayer->offsetFromLayoutObject());
+}
+
 void CompositedLayerMapping::registerScrollingLayers() {
   // Register fixed position layers and their containers with the scrolling
   // coordinator.
   ScrollingCoordinator* scrollingCoordinator =
       scrollingCoordinatorFromLayer(m_owningLayer);
   if (!scrollingCoordinator)
     return;
 
   scrollingCoordinator->updateLayerPositionConstraint(&m_owningLayer);
 
@@ skipping 47 matching lines @@
                       .containerLayer();
   updateBottomLayer(m_overflowControlsAncestorClippingLayer.get());
   updateBottomLayer(m_overflowControlsHostLayer.get());
   if (m_layerForHorizontalScrollbar)
     m_overflowControlsHostLayer->addChild(m_layerForHorizontalScrollbar.get());
   if (m_layerForVerticalScrollbar)
     m_overflowControlsHostLayer->addChild(m_layerForVerticalScrollbar.get());
   if (m_layerForScrollCorner)
     m_overflowControlsHostLayer->addChild(m_layerForScrollCorner.get());
 
+  // Now add the DecorationLayer as a subtree to GraphicsLayer
+  bottomLayer = m_graphicsLayer.get();
+  updateBottomLayer(m_decorationLayer.get());
+
   // The squashing containment layer, if it exists, becomes a no-op parent.
   if (m_squashingLayer) {
     ASSERT((m_ancestorClippingLayer && !m_squashingContainmentLayer) ||
            (!m_ancestorClippingLayer && m_squashingContainmentLayer));
 
     if (m_squashingContainmentLayer) {
       m_squashingContainmentLayer->removeAllChildren();
       m_squashingContainmentLayer->addChild(m_graphicsLayer.get());
       m_squashingContainmentLayer->addChild(m_squashingLayer.get());
     } else {
@@ skipping 114 matching lines @@
   }
 
   // FIXME: we could refine this to only allocate backings for one of these
   // layers if possible.
   if (m_foregroundLayer)
     m_foregroundLayer->setDrawsContent(hasPaintedContent);
 
   if (m_backgroundLayer)
     m_backgroundLayer->setDrawsContent(hasPaintedContent);
 
+  if (m_decorationLayer)
+    m_decorationLayer->setDrawsContent(hasPaintedContent);
+
   if (m_maskLayer)
     m_maskLayer->setDrawsContent(true);
 
   if (m_childClippingMaskLayer)
     m_childClippingMaskLayer->setDrawsContent(true);
 }
 
 void CompositedLayerMapping::updateChildrenTransform() {
   if (GraphicsLayer* childTransformLayer = this->childTransformLayer()) {
     childTransformLayer->setTransform(owningLayer().perspectiveTransform());
@@ skipping 179 matching lines @@
   ApplyToLayersAffectedByPreserve3D = (1 << 0),
   ApplyToSquashingLayer = (1 << 1),
   ApplyToScrollbarLayers = (1 << 2),
   ApplyToBackgroundLayer = (1 << 3),
   ApplyToMaskLayers = (1 << 4),
   ApplyToContentLayers = (1 << 5),
   ApplyToChildContainingLayers =
       (1 << 6),  // layers between m_graphicsLayer and children
   ApplyToNonScrollingContentLayers = (1 << 7),
   ApplyToScrollingContentLayers = (1 << 8),
+  ApplyToDecorationLayer = (1 << 9),
   ApplyToAllGraphicsLayers =
       (ApplyToSquashingLayer | ApplyToScrollbarLayers | ApplyToBackgroundLayer |
        ApplyToMaskLayers |
        ApplyToLayersAffectedByPreserve3D |
        ApplyToContentLayers |
-       ApplyToScrollingContentLayers)
+       ApplyToScrollingContentLayers |
+       ApplyToDecorationLayer)
 };
 typedef unsigned ApplyToGraphicsLayersMode;
 
 template <typename Func>
 static void ApplyToGraphicsLayers(const CompositedLayerMapping* mapping,
                                   const Func& f,
                                   ApplyToGraphicsLayersMode mode) {
   ASSERT(mode);
 
   if ((mode & ApplyToLayersAffectedByPreserve3D) &&
@@ skipping 42 matching lines @@
        (mode & ApplyToNonScrollingContentLayers)) &&
       mapping->backgroundLayer())
     f(mapping->backgroundLayer());
 
   if ((mode & ApplyToScrollbarLayers) && mapping->layerForHorizontalScrollbar())
     f(mapping->layerForHorizontalScrollbar());
   if ((mode & ApplyToScrollbarLayers) && mapping->layerForVerticalScrollbar())
     f(mapping->layerForVerticalScrollbar());
   if ((mode & ApplyToScrollbarLayers) && mapping->layerForScrollCorner())
     f(mapping->layerForScrollCorner());
+
+  if (((mode & ApplyToDecorationLayer) ||
+       (mode & ApplyToNonScrollingContentLayers)) && mapping->decorationLayer())
+    f(mapping->decorationLayer());
 }
 
 struct UpdateRenderingContextFunctor {
   void operator()(GraphicsLayer* layer) const {
     layer->setRenderingContext(renderingContext);
   }
   int renderingContext;
 };
 
 void CompositedLayerMapping::updateRenderingContext() {
@@ skipping 158 matching lines @@
       layerChanged = true;
     }
   }
 
   if (layerChanged && !m_owningLayer.layoutObject()->documentBeingDestroyed())
     compositor()->rootFixedBackgroundsChanged();
 
   return layerChanged;
 }
 
+bool CompositedLayerMapping::updateDecorationLayer(bool needsDecorationLayer) {
+  bool layerChanged = false;
+  if (needsDecorationLayer) {
+    if (!m_decorationLayer) {
+      m_decorationLayer =
+          createGraphicsLayer(CompositingReasonLayerForDecoration);
+      m_decorationLayer->setPaintingPhase(GraphicsLayerPaintDecoration);
+      layerChanged = true;
+    }
+  } else if (m_decorationLayer) {
+    m_decorationLayer = nullptr;
+    layerChanged = true;
+  }
+
+  return layerChanged;
+}
+
 bool CompositedLayerMapping::updateMaskLayer(bool needsMaskLayer) {
   bool layerChanged = false;
   if (needsMaskLayer) {
     if (!m_maskLayer) {
       m_maskLayer = createGraphicsLayer(CompositingReasonLayerForMask);
       m_maskLayer->setPaintingPhase(GraphicsLayerPaintMask);
       layerChanged = true;
     }
   } else if (m_maskLayer) {
     m_maskLayer = nullptr;
@@ skipping 918 matching lines @@
   if (graphicsLayerPaintingPhase & GraphicsLayerPaintForeground)
     paintLayerFlags |= PaintLayerPaintingCompositingForegroundPhase;
   if (graphicsLayerPaintingPhase & GraphicsLayerPaintMask)
     paintLayerFlags |= PaintLayerPaintingCompositingMaskPhase;
   if (graphicsLayerPaintingPhase & GraphicsLayerPaintChildClippingMask)
     paintLayerFlags |= PaintLayerPaintingChildClippingMaskPhase;
   if (graphicsLayerPaintingPhase & GraphicsLayerPaintOverflowContents)
     paintLayerFlags |= PaintLayerPaintingOverflowContents;
   if (graphicsLayerPaintingPhase & GraphicsLayerPaintCompositedScroll)
     paintLayerFlags |= PaintLayerPaintingCompositingScrollingPhase;
+  if (graphicsLayerPaintingPhase & GraphicsLayerPaintDecoration)
+    paintLayerFlags |= PaintLayerPaintingCompositingDecorationPhase;
 
   if (graphicsLayer == m_backgroundLayer.get())
     paintLayerFlags |= PaintLayerPaintingRootBackgroundOnly;
   else if (compositor()->fixedRootBackgroundLayer() &&
            m_owningLayer.isRootLayer())
     paintLayerFlags |= PaintLayerPaintingSkipRootBackground;
 
   if (graphicsLayer == m_graphicsLayer.get() ||
       graphicsLayer == m_foregroundLayer.get() ||
       graphicsLayer == m_backgroundLayer.get() ||
       graphicsLayer == m_maskLayer.get() ||
       graphicsLayer == m_childClippingMaskLayer.get() ||
-      graphicsLayer == m_scrollingContentsLayer.get()) {
+      graphicsLayer == m_scrollingContentsLayer.get() ||
+      graphicsLayer == m_decorationLayer.get()) {
     bool paintRootBackgroundOntoScrollingContentsLayer =
         m_backgroundPaintsOntoScrollingContentsLayer;
     DCHECK(!paintRootBackgroundOntoScrollingContentsLayer ||
            (!m_backgroundLayer && !m_foregroundLayer));
     if (paintRootBackgroundOntoScrollingContentsLayer) {
       if (graphicsLayer == m_scrollingContentsLayer.get())
         paintLayerFlags &= ~PaintLayerPaintingSkipRootBackground;
       else
         paintLayerFlags |= PaintLayerPaintingSkipRootBackground;
     }
@@ skipping 260 matching lines @@
   } else if (graphicsLayer == m_layerForScrollCorner.get()) {
     name = "Scroll Corner Layer";
   } else if (graphicsLayer == m_overflowControlsHostLayer.get()) {
     name = "Overflow Controls Host Layer";
   } else if (graphicsLayer == m_overflowControlsAncestorClippingLayer.get()) {
     name = "Overflow Controls Ancestor Clipping Layer";
   } else if (graphicsLayer == m_scrollingLayer.get()) {
     name = "Scrolling Layer";
   } else if (graphicsLayer == m_scrollingContentsLayer.get()) {
     name = "Scrolling Contents Layer";
+  } else if (graphicsLayer == m_decorationLayer.get()) {
+    name = "Decoration Layer";
   } else {
     ASSERT_NOT_REACHED();
   }
 
   return name;
 }
 
 }  // namespace blink