- Revision
- 245208
- Author
- [email protected]
- Date
- 2019-05-11 15:22:34 -0700 (Sat, 11 May 2019)
Log Message
Layer bounds are incorrect for sharing layers that paint with transforms
https://bugs.webkit.org/show_bug.cgi?id=197768
<rdar://problem/50695493>
Reviewed by Zalan Bujtas.
Source/WebCore:
We don't need to traverse shared layers if the backing-provider has overflow clip,
because we know they are containing-block descendants and therefore clipped.
Note tha the CSS "clip" property doesn't guarantee this, because the clip rect
can be larger than the element, so in that case we just traverse shared layers.
Tests: compositing/shared-backing/sharing-bounds-clip.html
compositing/shared-backing/sharing-bounds-non-clipping-shared-layer.html
compositing/shared-backing/sharing-bounds-transformed-sharing-layer.html
compositing/shared-backing/sharing-bounds.html
* rendering/RenderLayerBacking.cpp:
(WebCore::RenderLayerBacking::updateCompositedBounds):
LayoutTests:
Tests for backing-shared layer bounds in various configurations.
* compositing/shared-backing/sharing-bounds-clip-expected.txt: Added.
* compositing/shared-backing/sharing-bounds-clip.html: Added.
* compositing/shared-backing/sharing-bounds-expected.txt: Added.
* compositing/shared-backing/sharing-bounds-non-clipping-shared-layer-expected.txt: Added.
* compositing/shared-backing/sharing-bounds-non-clipping-shared-layer.html: Added.
* compositing/shared-backing/sharing-bounds-transformed-sharing-layer-expected.txt: Added.
* compositing/shared-backing/sharing-bounds-transformed-sharing-layer.html: Added.
* compositing/shared-backing/sharing-bounds.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (245207 => 245208)
--- trunk/LayoutTests/ChangeLog 2019-05-11 22:05:37 UTC (rev 245207)
+++ trunk/LayoutTests/ChangeLog 2019-05-11 22:22:34 UTC (rev 245208)
@@ -1,5 +1,24 @@
2019-05-11 Simon Fraser <[email protected]>
+ Layer bounds are incorrect for sharing layers that paint with transforms
+ https://bugs.webkit.org/show_bug.cgi?id=197768
+ <rdar://problem/50695493>
+
+ Reviewed by Zalan Bujtas.
+
+ Tests for backing-shared layer bounds in various configurations.
+
+ * compositing/shared-backing/sharing-bounds-clip-expected.txt: Added.
+ * compositing/shared-backing/sharing-bounds-clip.html: Added.
+ * compositing/shared-backing/sharing-bounds-expected.txt: Added.
+ * compositing/shared-backing/sharing-bounds-non-clipping-shared-layer-expected.txt: Added.
+ * compositing/shared-backing/sharing-bounds-non-clipping-shared-layer.html: Added.
+ * compositing/shared-backing/sharing-bounds-transformed-sharing-layer-expected.txt: Added.
+ * compositing/shared-backing/sharing-bounds-transformed-sharing-layer.html: Added.
+ * compositing/shared-backing/sharing-bounds.html: Added.
+
+2019-05-11 Simon Fraser <[email protected]>
+
Translucent gradient rendering bug due to will-change transform
https://bugs.webkit.org/show_bug.cgi?id=197654
<rdar://problem/50547664>
Added: trunk/LayoutTests/compositing/shared-backing/sharing-bounds-clip-expected.txt (0 => 245208)
--- trunk/LayoutTests/compositing/shared-backing/sharing-bounds-clip-expected.txt (rev 0)
+++ trunk/LayoutTests/compositing/shared-backing/sharing-bounds-clip-expected.txt 2019-05-11 22:22:34 UTC (rev 245208)
@@ -0,0 +1,23 @@
+(GraphicsLayer
+ (anchor 0.00 0.00)
+ (bounds 800.00 600.00)
+ (children 1
+ (GraphicsLayer
+ (bounds 800.00 600.00)
+ (contentsOpaque 1)
+ (children 2
+ (GraphicsLayer
+ (position 8.00 8.00)
+ (bounds 50.00 50.00)
+ (contentsOpaque 1)
+ )
+ (GraphicsLayer
+ (position 30.00 30.00)
+ (bounds 500.00 302.00)
+ (drawsContent 1)
+ )
+ )
+ )
+ )
+)
+
Added: trunk/LayoutTests/compositing/shared-backing/sharing-bounds-clip.html (0 => 245208)
--- trunk/LayoutTests/compositing/shared-backing/sharing-bounds-clip.html (rev 0)
+++ trunk/LayoutTests/compositing/shared-backing/sharing-bounds-clip.html 2019-05-11 22:22:34 UTC (rev 245208)
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Tests the backing provider layer bounds with a transformed sharing layer</title>
+ <style>
+ .relative {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ height: 300px;
+ width: 300px;
+ margin: 10px;
+ border: 1px solid black;
+ background-color: silver;
+ clip: rect(10px, 500px, 300px, 10px); /* larger than the bounds */
+ }
+
+ .sharing {
+ position: relative;
+ top: 50px;
+ left: 50px;
+ width: 200px;
+ height: 200px;
+ background-color: green;
+ }
+
+ .inner {
+ position: absolute;
+ left: 200px;
+ top: 200px;
+ width: 100px;
+ height: 100px;
+ background-color: blue;
+ }
+
+ .trigger {
+ transform: translateZ(0);
+ width: 50px;
+ height: 50px;
+ background-color: silver;
+ }
+ </style>
+ <script>
+ if (window.testRunner)
+ testRunner.dumpAsText();
+
+ window.addEventListener('load', () => {
+ if (window.internals)
+ document.getElementById('layers').textContent = internals.layerTreeAsText(document);
+ }, false);
+ </script>
+</head>
+<body>
+ <div class="trigger"></div>
+ <div class="relative">
+ <div class="sharing">
+ <div class="inner">
+ </div>
+ </div>
+ </div>
+<pre id="layers"></pre>
+</body>
+</html>
Added: trunk/LayoutTests/compositing/shared-backing/sharing-bounds-expected.txt (0 => 245208)
--- trunk/LayoutTests/compositing/shared-backing/sharing-bounds-expected.txt (rev 0)
+++ trunk/LayoutTests/compositing/shared-backing/sharing-bounds-expected.txt 2019-05-11 22:22:34 UTC (rev 245208)
@@ -0,0 +1,23 @@
+(GraphicsLayer
+ (anchor 0.00 0.00)
+ (bounds 800.00 600.00)
+ (children 1
+ (GraphicsLayer
+ (bounds 800.00 600.00)
+ (contentsOpaque 1)
+ (children 2
+ (GraphicsLayer
+ (position 8.00 8.00)
+ (bounds 50.00 50.00)
+ (contentsOpaque 1)
+ )
+ (GraphicsLayer
+ (position 30.00 30.00)
+ (bounds 302.00 302.00)
+ (drawsContent 1)
+ )
+ )
+ )
+ )
+)
+
Added: trunk/LayoutTests/compositing/shared-backing/sharing-bounds-non-clipping-shared-layer-expected.txt (0 => 245208)
--- trunk/LayoutTests/compositing/shared-backing/sharing-bounds-non-clipping-shared-layer-expected.txt (rev 0)
+++ trunk/LayoutTests/compositing/shared-backing/sharing-bounds-non-clipping-shared-layer-expected.txt 2019-05-11 22:22:34 UTC (rev 245208)
@@ -0,0 +1,23 @@
+(GraphicsLayer
+ (anchor 0.00 0.00)
+ (bounds 800.00 600.00)
+ (children 1
+ (GraphicsLayer
+ (bounds 800.00 600.00)
+ (contentsOpaque 1)
+ (children 2
+ (GraphicsLayer
+ (position 8.00 8.00)
+ (bounds 50.00 50.00)
+ (contentsOpaque 1)
+ )
+ (GraphicsLayer
+ (position 30.00 30.00)
+ (bounds 501.00 501.00)
+ (drawsContent 1)
+ )
+ )
+ )
+ )
+)
+
Added: trunk/LayoutTests/compositing/shared-backing/sharing-bounds-non-clipping-shared-layer.html (0 => 245208)
--- trunk/LayoutTests/compositing/shared-backing/sharing-bounds-non-clipping-shared-layer.html (rev 0)
+++ trunk/LayoutTests/compositing/shared-backing/sharing-bounds-non-clipping-shared-layer.html 2019-05-11 22:22:34 UTC (rev 245208)
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Tests the backing provider layer bounds with a transformed sharing layer</title>
+ <style>
+ .relative {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ height: 300px;
+ width: 300px;
+ margin: 10px;
+ border: 1px solid black;
+ }
+
+ .sharing {
+ position: relative;
+ top: 50px;
+ left: 50px;
+ width: 200px;
+ height: 200px;
+ background-color: green;
+ transform: scale(1.5);
+ transform-origin: top left;
+ }
+
+ .inner {
+ position: absolute;
+ left: 200px;
+ top: 200px;
+ width: 100px;
+ height: 100px;
+ background-color: blue;
+ }
+
+ .trigger {
+ transform: translateZ(0);
+ width: 50px;
+ height: 50px;
+ background-color: silver;
+ }
+ </style>
+ <script>
+ if (window.testRunner)
+ testRunner.dumpAsText();
+
+ window.addEventListener('load', () => {
+ if (window.internals)
+ document.getElementById('layers').textContent = internals.layerTreeAsText(document);
+ }, false);
+ </script>
+</head>
+<body>
+ <div class="trigger"></div>
+ <div class="relative">
+ <div class="sharing">
+ <div class="inner">
+ </div>
+ </div>
+ </div>
+<pre id="layers"></pre>
+</body>
+</html>
Added: trunk/LayoutTests/compositing/shared-backing/sharing-bounds-transformed-sharing-layer-expected.txt (0 => 245208)
--- trunk/LayoutTests/compositing/shared-backing/sharing-bounds-transformed-sharing-layer-expected.txt (rev 0)
+++ trunk/LayoutTests/compositing/shared-backing/sharing-bounds-transformed-sharing-layer-expected.txt 2019-05-11 22:22:34 UTC (rev 245208)
@@ -0,0 +1,23 @@
+(GraphicsLayer
+ (anchor 0.00 0.00)
+ (bounds 800.00 600.00)
+ (children 1
+ (GraphicsLayer
+ (bounds 800.00 600.00)
+ (contentsOpaque 1)
+ (children 2
+ (GraphicsLayer
+ (position 8.00 8.00)
+ (bounds 50.00 50.00)
+ (contentsOpaque 1)
+ )
+ (GraphicsLayer
+ (position 30.00 30.00)
+ (bounds 302.00 302.00)
+ (drawsContent 1)
+ )
+ )
+ )
+ )
+)
+
Added: trunk/LayoutTests/compositing/shared-backing/sharing-bounds-transformed-sharing-layer.html (0 => 245208)
--- trunk/LayoutTests/compositing/shared-backing/sharing-bounds-transformed-sharing-layer.html (rev 0)
+++ trunk/LayoutTests/compositing/shared-backing/sharing-bounds-transformed-sharing-layer.html 2019-05-11 22:22:34 UTC (rev 245208)
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Tests bounds computation for a transformed layer painting into shared backing</title>
+ <style>
+ .clipping {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ overflow: hidden;
+ height: 300px;
+ width: 300px;
+ margin: 10px;
+ border: 1px solid black;
+ }
+
+ .transformed {
+ width: 400px;
+ height: 100px;
+ background-color: green;
+ transform: scale(2);
+ transform-origin: top left;
+ }
+
+ .trigger {
+ transform: translateZ(0);
+ width: 50px;
+ height: 50px;
+ background-color: silver;
+ }
+ </style>
+ <script>
+ if (window.testRunner)
+ testRunner.dumpAsText();
+
+ window.addEventListener('load', () => {
+ if (window.internals)
+ document.getElementById('layers').textContent = internals.layerTreeAsText(document);
+ }, false);
+ </script>
+</head>
+<body>
+ <div class="trigger"></div>
+ <div class="clipping">
+ <div class="transformed">
+ </div>
+ </div>
+<pre id="layers"></pre>
+</body>
+</html>
Added: trunk/LayoutTests/compositing/shared-backing/sharing-bounds.html (0 => 245208)
--- trunk/LayoutTests/compositing/shared-backing/sharing-bounds.html (rev 0)
+++ trunk/LayoutTests/compositing/shared-backing/sharing-bounds.html 2019-05-11 22:22:34 UTC (rev 245208)
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Tests the backing provider layer bounds with a positioned child</title>
+ <style>
+ .clipping {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ overflow: hidden;
+ height: 300px;
+ width: 300px;
+ margin: 10px;
+ border: 1px solid black;
+ }
+
+ .sharing {
+ position: relative;
+ top: 50px;
+ left: 50px;
+ width: 200px;
+ height: 200px;
+ background-color: green;
+ }
+
+ .inner {
+ position: absolute;
+ left: 200px;
+ top: 200px;
+ width: 100px;
+ height: 100px;
+ background-color: blue;
+ }
+
+ .trigger {
+ transform: translateZ(0);
+ width: 50px;
+ height: 50px;
+ background-color: silver;
+ }
+
+ </style>
+ <script>
+ if (window.testRunner)
+ testRunner.dumpAsText();
+
+ window.addEventListener('load', () => {
+ if (window.internals)
+ document.getElementById('layers').textContent = internals.layerTreeAsText(document);
+ }, false);
+ </script>
+</head>
+<body>
+ <div class="composited trigger"></div>
+ <div class="clipping">
+ <div class="sharing">
+ <div class="inner">
+ </div>
+ </div>
+ </div>
+<pre id="layers"></pre>
+</body>
+</html>
Modified: trunk/Source/WebCore/ChangeLog (245207 => 245208)
--- trunk/Source/WebCore/ChangeLog 2019-05-11 22:05:37 UTC (rev 245207)
+++ trunk/Source/WebCore/ChangeLog 2019-05-11 22:22:34 UTC (rev 245208)
@@ -1,5 +1,27 @@
2019-05-11 Simon Fraser <[email protected]>
+ Layer bounds are incorrect for sharing layers that paint with transforms
+ https://bugs.webkit.org/show_bug.cgi?id=197768
+ <rdar://problem/50695493>
+
+ Reviewed by Zalan Bujtas.
+
+ We don't need to traverse shared layers if the backing-provider has overflow clip,
+ because we know they are containing-block descendants and therefore clipped.
+
+ Note tha the CSS "clip" property doesn't guarantee this, because the clip rect
+ can be larger than the element, so in that case we just traverse shared layers.
+
+ Tests: compositing/shared-backing/sharing-bounds-clip.html
+ compositing/shared-backing/sharing-bounds-non-clipping-shared-layer.html
+ compositing/shared-backing/sharing-bounds-transformed-sharing-layer.html
+ compositing/shared-backing/sharing-bounds.html
+
+ * rendering/RenderLayerBacking.cpp:
+ (WebCore::RenderLayerBacking::updateCompositedBounds):
+
+2019-05-11 Simon Fraser <[email protected]>
+
Translucent gradient rendering bug due to will-change transform
https://bugs.webkit.org/show_bug.cgi?id=197654
<rdar://problem/50547664>
Modified: trunk/Source/WebCore/rendering/RenderLayerBacking.cpp (245207 => 245208)
--- trunk/Source/WebCore/rendering/RenderLayerBacking.cpp 2019-05-11 22:05:37 UTC (rev 245207)
+++ trunk/Source/WebCore/rendering/RenderLayerBacking.cpp 2019-05-11 22:22:34 UTC (rev 245208)
@@ -671,12 +671,15 @@
layerBounds.intersect(clippingBounds);
}
- for (auto& layerWeakPtr : m_backingSharingLayers) {
- auto* boundsRootLayer = &m_owningLayer;
- ASSERT(layerWeakPtr->isDescendantOf(m_owningLayer));
- auto offset = layerWeakPtr->offsetFromAncestor(&m_owningLayer);
- auto bounds = layerWeakPtr->calculateLayerBounds(boundsRootLayer, offset, RenderLayer::defaultCalculateLayerBoundsFlags() | RenderLayer::ExcludeHiddenDescendants | RenderLayer::DontConstrainForMask);
- layerBounds.unite(bounds);
+ // If the backing provider has overflow:clip, we know all sharing layers are affected by the clip because they are containing-block descendants.
+ if (!renderer().hasOverflowClip()) {
+ for (auto& layerWeakPtr : m_backingSharingLayers) {
+ auto* boundsRootLayer = &m_owningLayer;
+ ASSERT(layerWeakPtr->isDescendantOf(m_owningLayer));
+ auto offset = layerWeakPtr->offsetFromAncestor(&m_owningLayer);
+ auto bounds = layerWeakPtr->calculateLayerBounds(boundsRootLayer, offset, RenderLayer::defaultCalculateLayerBoundsFlags() | RenderLayer::ExcludeHiddenDescendants | RenderLayer::DontConstrainForMask);
+ layerBounds.unite(bounds);
+ }
}
// If the element has a transform-origin that has fixed lengths, and the renderer has zero size,
