Title: [240941] trunk
Revision
240941
Author
simon.fra...@apple.com
Date
2019-02-04 13:51:32 -0800 (Mon, 04 Feb 2019)

Log Message

Async overflow scroll with border-radius renders incorrectly
https://bugs.webkit.org/show_bug.cgi?id=194205
<rdar://problem/47771668>

Reviewed by Zalan Bujtas.

Source/WebCore:

When an element has composited overflow:scroll and border-radius, we need to make a layer
to clip to the inside of the border radius if necessary.

Existing code simply turned off needsDescendantsClippingLayer for composited scrolling
layers, but now we check to see if the inner border is rounded. If we have both a m_childContainmentLayer
and scrolling layers, we need to adjust the location of the scrolling layers (which are parented
in m_childContainmentLayer).

Also fix offsetFromRenderer for these layers; it's positive for layers inset from the top left
of the border box.

Tests: compositing/clipping/border-radius-async-overflow-clipping-layer.html
       compositing/clipping/border-radius-async-overflow-non-stacking.html
       compositing/clipping/border-radius-async-overflow-stacking.html

* rendering/RenderLayerBacking.cpp:
(WebCore::RenderLayerBacking::updateConfiguration):
(WebCore::RenderLayerBacking::updateGeometry):
(WebCore::RenderLayerBacking::updateChildClippingStrategy): Layout is always up-to-date now, so remove the comment.

LayoutTests:

New baselines, mostly correcting offsetFromRenderer.

* compositing/clipping/border-radius-async-overflow-clipping-layer-expected.txt: Added.
* compositing/clipping/border-radius-async-overflow-clipping-layer.html: Added.
* compositing/clipping/border-radius-async-overflow-non-stacking-expected.html: Added.
* compositing/clipping/border-radius-async-overflow-non-stacking.html: Added.
* compositing/clipping/border-radius-async-overflow-stacking-expected.html: Added.
* compositing/clipping/border-radius-async-overflow-stacking.html: Added.
* compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt:
* platform/ios/compositing/overflow/scrolling-without-painting-expected.txt:
* platform/ios/compositing/overflow/textarea-scroll-touch-expected.txt: html.css specifies a border-radius on <textarea> for iOS, so we make additional
clipping layers.
* platform/ios/compositing/rtl/rtl-scrolling-with-transformed-descendants-expected.txt:
* platform/ios/compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt:

Modified Paths

Added Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (240940 => 240941)


--- trunk/LayoutTests/ChangeLog	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/ChangeLog	2019-02-04 21:51:32 UTC (rev 240941)
@@ -1,5 +1,28 @@
 2019-02-04  Simon Fraser  <simon.fra...@apple.com>
 
+        Async overflow scroll with border-radius renders incorrectly
+        https://bugs.webkit.org/show_bug.cgi?id=194205
+        <rdar://problem/47771668>
+
+        Reviewed by Zalan Bujtas.
+
+        New baselines, mostly correcting offsetFromRenderer.
+
+        * compositing/clipping/border-radius-async-overflow-clipping-layer-expected.txt: Added.
+        * compositing/clipping/border-radius-async-overflow-clipping-layer.html: Added.
+        * compositing/clipping/border-radius-async-overflow-non-stacking-expected.html: Added.
+        * compositing/clipping/border-radius-async-overflow-non-stacking.html: Added.
+        * compositing/clipping/border-radius-async-overflow-stacking-expected.html: Added.
+        * compositing/clipping/border-radius-async-overflow-stacking.html: Added.
+        * compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt:
+        * platform/ios/compositing/overflow/scrolling-without-painting-expected.txt:
+        * platform/ios/compositing/overflow/textarea-scroll-touch-expected.txt: html.css specifies a border-radius on <textarea> for iOS, so we make additional
+        clipping layers.
+        * platform/ios/compositing/rtl/rtl-scrolling-with-transformed-descendants-expected.txt:
+        * platform/ios/compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt:
+
+2019-02-04  Simon Fraser  <simon.fra...@apple.com>
+
         PageOverlayController's layers should be created lazily
         https://bugs.webkit.org/show_bug.cgi?id=194199
         rdar://problem/46571593

Added: trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-clipping-layer-expected.txt (0 => 240941)


--- trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-clipping-layer-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-clipping-layer-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -0,0 +1,87 @@
+This is the scrolled contents
+This is the scrolled contents
+(GraphicsLayer
+  (anchor 0.00 0.00)
+  (bounds 800.00 600.00)
+  (children 1
+    (GraphicsLayer
+      (bounds 800.00 600.00)
+      (contentsOpaque 1)
+      (children 2
+        (GraphicsLayer
+          (offsetFromRenderer width=-14 height=-14)
+          (position 14.00 6.00)
+          (bounds 408.00 288.00)
+          (drawsContent 1)
+          (children 2
+            (GraphicsLayer
+              (offsetFromRenderer width=30 height=30)
+              (position 44.00 44.00)
+              (bounds 320.00 200.00)
+              (children 1
+                (GraphicsLayer
+                  (offsetFromRenderer width=30 height=30)
+                  (anchor 0.00 0.00)
+                  (bounds 320.00 1020.00)
+                  (children 1
+                    (GraphicsLayer
+                      (position 10.00 10.00)
+                      (bounds 300.00 1000.00)
+                      (contentsOpaque 1)
+                      (drawsContent 1)
+                    )
+                  )
+                )
+              )
+            )
+            (GraphicsLayer
+              (position 349.00 44.00)
+              (bounds 15.00 200.00)
+              (drawsContent 1)
+            )
+          )
+        )
+        (GraphicsLayer
+          (offsetFromRenderer width=-14 height=-14)
+          (position 14.00 286.00)
+          (bounds 408.00 288.00)
+          (drawsContent 1)
+          (children 2
+            (GraphicsLayer
+              (offsetFromRenderer width=30 height=30)
+              (position 44.00 44.00)
+              (bounds 320.00 200.00)
+              (children 1
+                (GraphicsLayer
+                  (offsetFromRenderer width=30 height=30)
+                  (bounds 320.00 200.00)
+                  (children 1
+                    (GraphicsLayer
+                      (offsetFromRenderer width=30 height=30)
+                      (anchor 0.00 0.00)
+                      (bounds 320.00 1020.00)
+                      (children 1
+                        (GraphicsLayer
+                          (position 10.00 10.00)
+                          (bounds 300.00 1000.00)
+                          (contentsOpaque 1)
+                          (drawsContent 1)
+                        )
+                      )
+                    )
+                  )
+                )
+              )
+            )
+            (GraphicsLayer
+              (position 349.00 44.00)
+              (bounds 15.00 200.00)
+              (drawsContent 1)
+            )
+          )
+        )
+      )
+    )
+  )
+)
+

Added: trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-clipping-layer.html (0 => 240941)


--- trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-clipping-layer.html	                        (rev 0)
+++ trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-clipping-layer.html	2019-02-04 21:51:32 UTC (rev 240941)
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <title>Tests layer tree for radius-clips that do and do not affect the padding box</title>
+    <style>
+        .scroller {
+            margin: 20px;
+            width: 300px;
+            height: 180px;
+            overflow-y: scroll;
+            border: 30px solid green;
+            padding: 10px;
+            line-height: 1.5em;
+            border-radius: 30px;
+            box-shadow: 0 0 10px black;
+        }
+
+        .stacking-context {
+            position: relative;
+            z-index: 0;
+        }
+
+        .contents {
+            width: 100%;
+            background-color: silver;
+            height: 1000px;
+        }
+
+        .composited {
+            transform: translateZ(0);
+        }
+    </style>
+    <script>
+        if (window.testRunner)
+          testRunner.dumpAsText();
+
+        if (window.internals) {
+            internals.settings.setAsyncOverflowScrollingEnabled(true);
+            internals.setUsesOverlayScrollbars(true);
+        }
+
+        window.addEventListener('load', () => {
+            if (window.testRunner)
+                document.getElementById('layers').innerText = window.internals.layerTreeAsText(document);
+        }, false);
+    </script>
+
+</head>
+<body>
+    <div class="stacking-context scroller" style="border-radius: 30px">
+        <div class="composited contents">This is the scrolled contents</div>
+    </div>
+    <div class="stacking-context scroller" style="border-radius: 25%">
+        <div class="composited contents">This is the scrolled contents</div>
+    </div>
+<pre id="layers"></pre>
+</body>
+</html>

Added: trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-non-stacking-expected.html (0 => 240941)


--- trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-non-stacking-expected.html	                        (rev 0)
+++ trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-non-stacking-expected.html	2019-02-04 21:51:32 UTC (rev 240941)
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <style>
+        .scroller {
+            margin: 10px;
+            width: 300px;
+            height: 200px;
+            overflow: hidden;
+            border: 30px solid green;
+            padding: 20px;
+            line-height: 1.5em;
+            border-top-right-radius: 150px 267px;
+            border-bottom-left-radius: 150px 267px;
+        }
+
+        .contents {
+            width: 100%;
+            background-color: silver;
+            height: 1000px;
+        }
+
+        .composited {
+            transform: translateZ(0);
+        }
+
+        .scrollbar-hider {
+            position: absolute;
+            width: 17px;
+            height: 240px;
+            left: 372px;
+            top: 40px;
+            background-color: gray;
+        }
+    </style>
+</head>
+<body>
+    <div class="scroller">
+        <div class="composited contents">This is the scrolled contents</div>
+    </div>
+    <div class="scrollbar-hider"></div>
+</body>
+</html>

Added: trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-non-stacking.html (0 => 240941)


--- trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-non-stacking.html	                        (rev 0)
+++ trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-non-stacking.html	2019-02-04 21:51:32 UTC (rev 240941)
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <style>
+        .scroller {
+            margin: 10px;
+            width: 300px;
+            height: 200px;
+            overflow-y: scroll;
+            border: 30px solid green;
+            padding: 20px;
+            line-height: 1.5em;
+            border-top-right-radius: 150px 267px;
+            border-bottom-left-radius: 150px 267px;
+        }
+
+        .contents {
+            width: 100%;
+            background-color: silver;
+            height: 1000px;
+        }
+
+        .composited {
+            transform: translateZ(0);
+        }
+
+        .scrollbar-hider {
+            position: absolute;
+            width: 17px;
+            height: 240px;
+            left: 372px;
+            top: 40px;
+            background-color: gray;
+        }
+    </style>
+    <script>
+        if (window.internals) {
+            internals.settings.setAsyncOverflowScrollingEnabled(true);
+            internals.setUsesOverlayScrollbars(true);
+        }
+    </script>
+</head>
+<body>
+    <div class="scroller">
+        <div class="composited contents">This is the scrolled contents</div>
+    </div>
+    <div class="scrollbar-hider"></div>
+</body>
+</html>

Added: trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-stacking-expected.html (0 => 240941)


--- trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-stacking-expected.html	                        (rev 0)
+++ trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-stacking-expected.html	2019-02-04 21:51:32 UTC (rev 240941)
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <style>
+        .scroller {
+            margin: 10px;
+            width: 300px;
+            height: 200px;
+            overflow: hidden;
+            border: 30px solid green;
+            padding: 20px;
+            line-height: 1.5em;
+            border-top-right-radius: 150px 267px;
+            border-bottom-left-radius: 150px 267px;
+        }
+        
+        .stacking-context {
+            position: relative;
+            z-index: 0;
+        }
+        
+        .contents {
+            width: 100%;
+            background-color: silver;
+            height: 1000px;
+        }
+
+        .composited {
+            transform: translateZ(0);
+        }
+
+        .scrollbar-hider {
+            position: absolute;
+            width: 17px;
+            height: 240px;
+            left: 372px;
+            top: 40px;
+            background-color: gray;
+        }
+    </style>
+</head>
+<body>
+    <div class="scroller stacking-context">
+        <div class="composited contents">This is the scrolled contents</div>
+    </div>
+    <div class="scrollbar-hider"></div>
+</body>
+</html>

Added: trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-stacking.html (0 => 240941)


--- trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-stacking.html	                        (rev 0)
+++ trunk/LayoutTests/compositing/clipping/border-radius-async-overflow-stacking.html	2019-02-04 21:51:32 UTC (rev 240941)
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <style>
+        .scroller {
+            margin: 10px;
+            width: 300px;
+            height: 200px;
+            overflow-y: scroll;
+            border: 30px solid green;
+            padding: 20px;
+            line-height: 1.5em;
+            border-top-right-radius: 150px 267px;
+            border-bottom-left-radius: 150px 267px;
+        }
+        
+        .stacking-context {
+            position: relative;
+            z-index: 0;
+        }
+        
+        .contents {
+            width: 100%;
+            background-color: silver;
+            height: 1000px;
+        }
+
+        .composited {
+            transform: translateZ(0);
+        }
+        
+        .scrollbar-hider {
+            position: absolute;
+            width: 17px;
+            height: 240px;
+            left: 372px;
+            top: 40px;
+            background-color: gray;
+        }
+    </style>
+    <script>
+        if (window.internals) {
+            internals.settings.setAsyncOverflowScrollingEnabled(true);
+            internals.setUsesOverlayScrollbars(true);
+        }
+    </script>
+</head>
+<body>
+    <div class="scroller stacking-context">
+        <div class="composited contents">This is the scrolled contents</div>
+    </div>
+    <div class="scrollbar-hider"></div>
+</body>
+</html>

Modified: trunk/LayoutTests/compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt (240940 => 240941)


--- trunk/LayoutTests/compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -12,7 +12,7 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
               (bounds 285.00 285.00)
               (children 1

Modified: trunk/LayoutTests/fast/scrolling/ios/change-scrollability-on-content-resize-expected.txt (240940 => 240941)


--- trunk/LayoutTests/fast/scrolling/ios/change-scrollability-on-content-resize-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/fast/scrolling/ios/change-scrollability-on-content-resize-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -76,7 +76,7 @@
               (contentsScale 2.00)
               (children 1
                 (GraphicsLayer
-                  (offsetFromRenderer width=-5 height=-5)
+                  (offsetFromRenderer width=5 height=5)
                   (position 5.00 5.00)
                   (bounds 200.00 200.00)
                   (visible rect 0.00, 0.00 200.00 x 200.00)
@@ -108,7 +108,7 @@
               (contentsScale 2.00)
               (children 1
                 (GraphicsLayer
-                  (offsetFromRenderer width=-5 height=-5)
+                  (offsetFromRenderer width=5 height=5)
                   (position 5.00 5.00)
                   (bounds 200.00 200.00)
                   (visible rect 0.00, 0.00 200.00 x 200.00)

Modified: trunk/LayoutTests/fast/scrolling/ios/overflow-scroll-touch-expected.txt (240940 => 240941)


--- trunk/LayoutTests/fast/scrolling/ios/overflow-scroll-touch-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/fast/scrolling/ios/overflow-scroll-touch-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -15,7 +15,7 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
               (bounds origin 0.00 50.00)
               (bounds 200.00 200.00)
@@ -37,7 +37,7 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
               (bounds origin 0.00 50.00)
               (bounds 200.00 200.00)

Modified: trunk/LayoutTests/fast/scrolling/ios/reconcile-layer-position-recursive-expected.txt (240940 => 240941)


--- trunk/LayoutTests/fast/scrolling/ios/reconcile-layer-position-recursive-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/fast/scrolling/ios/reconcile-layer-position-recursive-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -53,7 +53,7 @@
                       (contentsScale 2.00)
                       (children 1
                         (GraphicsLayer
-                          (offsetFromRenderer width=-5 height=-5)
+                          (offsetFromRenderer width=5 height=5)
                           (position 5.00 5.00)
                           (bounds 200.00 400.00)
                           (visible rect 0.00, 0.00 200.00 x 245.00)

Modified: trunk/LayoutTests/platform/ios/compositing/overflow/scrolling-without-painting-expected.txt (240940 => 240941)


--- trunk/LayoutTests/platform/ios/compositing/overflow/scrolling-without-painting-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/platform/ios/compositing/overflow/scrolling-without-painting-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -12,7 +12,7 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
               (bounds origin 0.00 25.00)
               (bounds 200.00 200.00)

Modified: trunk/LayoutTests/platform/ios/compositing/overflow/textarea-scroll-touch-expected.txt (240940 => 240941)


--- trunk/LayoutTests/platform/ios/compositing/overflow/textarea-scroll-touch-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/platform/ios/compositing/overflow/textarea-scroll-touch-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -13,17 +13,23 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
-              (bounds origin 0.00 50.00)
               (bounds 204.00 124.00)
               (children 1
                 (GraphicsLayer
                   (offsetFromRenderer width=1 height=1)
-                  (scrollOffset (0,50))
-                  (anchor 0.00 0.00)
-                  (bounds 204.00 270.00)
-                  (drawsContent 1)
+                  (bounds origin 0.00 50.00)
+                  (bounds 204.00 124.00)
+                  (children 1
+                    (GraphicsLayer
+                      (offsetFromRenderer width=1 height=1)
+                      (scrollOffset (0,50))
+                      (anchor 0.00 0.00)
+                      (bounds 204.00 270.00)
+                      (drawsContent 1)
+                    )
+                  )
                 )
               )
             )
@@ -36,17 +42,23 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
-              (bounds origin 0.00 50.00)
               (bounds 204.00 124.00)
               (children 1
                 (GraphicsLayer
                   (offsetFromRenderer width=1 height=1)
-                  (scrollOffset (0,50))
-                  (anchor 0.00 0.00)
-                  (bounds 204.00 270.00)
-                  (drawsContent 1)
+                  (bounds origin 0.00 50.00)
+                  (bounds 204.00 124.00)
+                  (children 1
+                    (GraphicsLayer
+                      (offsetFromRenderer width=1 height=1)
+                      (scrollOffset (0,50))
+                      (anchor 0.00 0.00)
+                      (bounds 204.00 270.00)
+                      (drawsContent 1)
+                    )
+                  )
                 )
               )
             )

Modified: trunk/LayoutTests/platform/ios/compositing/rtl/rtl-scrolling-with-transformed-descendants-expected.txt (240940 => 240941)


--- trunk/LayoutTests/platform/ios/compositing/rtl/rtl-scrolling-with-transformed-descendants-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/platform/ios/compositing/rtl/rtl-scrolling-with-transformed-descendants-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -13,7 +13,7 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-2 height=-2)
+              (offsetFromRenderer width=2 height=2)
               (position 2.00 2.00)
               (bounds origin 366.00 0.00)
               (bounds 400.00 205.00)

Modified: trunk/LayoutTests/platform/ios/compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt (240940 => 240941)


--- trunk/LayoutTests/platform/ios/compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/platform/ios/compositing/scrolling/overflow-scrolling-layers-are-self-painting-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -12,7 +12,7 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
               (bounds 300.00 300.00)
               (children 1

Modified: trunk/LayoutTests/platform/ios/fast/scrolling/ios/overflow-scrolling-ancestor-clip-expected.txt (240940 => 240941)


--- trunk/LayoutTests/platform/ios/fast/scrolling/ios/overflow-scrolling-ancestor-clip-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/platform/ios/fast/scrolling/ios/overflow-scrolling-ancestor-clip-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -12,7 +12,7 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
               (bounds origin 0.00 30.00)
               (bounds 300.00 400.00)

Modified: trunk/LayoutTests/platform/ios/fast/scrolling/ios/overflow-scrolling-ancestor-clip-size-expected.txt (240940 => 240941)


--- trunk/LayoutTests/platform/ios/fast/scrolling/ios/overflow-scrolling-ancestor-clip-size-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/platform/ios/fast/scrolling/ios/overflow-scrolling-ancestor-clip-size-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -12,7 +12,7 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-11 height=-11)
+              (offsetFromRenderer width=11 height=11)
               (position 11.00 11.00)
               (bounds origin 0.00 30.00)
               (bounds 300.00 400.00)

Modified: trunk/LayoutTests/platform/ios/fast/scrolling/ios/textarea-scroll-touch-expected.txt (240940 => 240941)


--- trunk/LayoutTests/platform/ios/fast/scrolling/ios/textarea-scroll-touch-expected.txt	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/LayoutTests/platform/ios/fast/scrolling/ios/textarea-scroll-touch-expected.txt	2019-02-04 21:51:32 UTC (rev 240941)
@@ -13,17 +13,23 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
-              (bounds origin 0.00 50.00)
               (bounds 204.00 124.00)
               (children 1
                 (GraphicsLayer
                   (offsetFromRenderer width=1 height=1)
-                  (scrollOffset (0,50))
-                  (anchor 0.00 0.00)
-                  (bounds 204.00 270.00)
-                  (drawsContent 1)
+                  (bounds origin 0.00 50.00)
+                  (bounds 204.00 124.00)
+                  (children 1
+                    (GraphicsLayer
+                      (offsetFromRenderer width=1 height=1)
+                      (scrollOffset (0,50))
+                      (anchor 0.00 0.00)
+                      (bounds 204.00 270.00)
+                      (drawsContent 1)
+                    )
+                  )
                 )
               )
             )
@@ -36,17 +42,23 @@
           (drawsContent 1)
           (children 1
             (GraphicsLayer
-              (offsetFromRenderer width=-1 height=-1)
+              (offsetFromRenderer width=1 height=1)
               (position 1.00 1.00)
-              (bounds origin 0.00 50.00)
               (bounds 204.00 124.00)
               (children 1
                 (GraphicsLayer
                   (offsetFromRenderer width=1 height=1)
-                  (scrollOffset (0,50))
-                  (anchor 0.00 0.00)
-                  (bounds 204.00 270.00)
-                  (drawsContent 1)
+                  (bounds origin 0.00 50.00)
+                  (bounds 204.00 124.00)
+                  (children 1
+                    (GraphicsLayer
+                      (offsetFromRenderer width=1 height=1)
+                      (scrollOffset (0,50))
+                      (anchor 0.00 0.00)
+                      (bounds 204.00 270.00)
+                      (drawsContent 1)
+                    )
+                  )
                 )
               )
             )

Modified: trunk/Source/WebCore/ChangeLog (240940 => 240941)


--- trunk/Source/WebCore/ChangeLog	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/Source/WebCore/ChangeLog	2019-02-04 21:51:32 UTC (rev 240941)
@@ -1,5 +1,33 @@
 2019-02-04  Simon Fraser  <simon.fra...@apple.com>
 
+        Async overflow scroll with border-radius renders incorrectly
+        https://bugs.webkit.org/show_bug.cgi?id=194205
+        <rdar://problem/47771668>
+
+        Reviewed by Zalan Bujtas.
+
+        When an element has composited overflow:scroll and border-radius, we need to make a layer
+        to clip to the inside of the border radius if necessary.
+
+        Existing code simply turned off needsDescendantsClippingLayer for composited scrolling
+        layers, but now we check to see if the inner border is rounded. If we have both a m_childContainmentLayer
+        and scrolling layers, we need to adjust the location of the scrolling layers (which are parented
+        in m_childContainmentLayer).
+
+        Also fix offsetFromRenderer for these layers; it's positive for layers inset from the top left
+        of the border box.
+
+        Tests: compositing/clipping/border-radius-async-overflow-clipping-layer.html
+               compositing/clipping/border-radius-async-overflow-non-stacking.html
+               compositing/clipping/border-radius-async-overflow-stacking.html
+
+        * rendering/RenderLayerBacking.cpp:
+        (WebCore::RenderLayerBacking::updateConfiguration):
+        (WebCore::RenderLayerBacking::updateGeometry):
+        (WebCore::RenderLayerBacking::updateChildClippingStrategy): Layout is always up-to-date now, so remove the comment.
+
+2019-02-04  Simon Fraser  <simon.fra...@apple.com>
+
         PageOverlayController's layers should be created lazily
         https://bugs.webkit.org/show_bug.cgi?id=194199
 

Modified: trunk/Source/WebCore/rendering/RenderLayerBacking.cpp (240940 => 240941)


--- trunk/Source/WebCore/rendering/RenderLayerBacking.cpp	2019-02-04 21:16:22 UTC (rev 240940)
+++ trunk/Source/WebCore/rendering/RenderLayerBacking.cpp	2019-02-04 21:51:32 UTC (rev 240941)
@@ -702,22 +702,26 @@
     ASSERT(!renderer().view().needsLayout());
 
     bool layerConfigChanged = false;
+    auto& compositor = this->compositor();
 
-    setBackgroundLayerPaintsFixedRootBackground(compositor().needsFixedRootBackgroundLayer(m_owningLayer));
+    setBackgroundLayerPaintsFixedRootBackground(compositor.needsFixedRootBackgroundLayer(m_owningLayer));
 
     if (updateBackgroundLayer(m_backgroundLayerPaintsFixedRootBackground || m_requiresBackgroundLayer))
         layerConfigChanged = true;
 
-    if (updateForegroundLayer(compositor().needsContentsCompositingLayer(m_owningLayer)))
+    if (updateForegroundLayer(compositor.needsContentsCompositingLayer(m_owningLayer)))
         layerConfigChanged = true;
     
-    // This requires descendants to have been updated.
-    bool needsDescendantsClippingLayer = compositor().clipsCompositingDescendants(m_owningLayer);
+    bool needsDescendantsClippingLayer = false;
     bool usesCompositedScrolling = m_owningLayer.hasCompositedScrollableOverflow();
 
-    // Our scrolling layer will clip.
-    if (usesCompositedScrolling)
-        needsDescendantsClippingLayer = false;
+    if (usesCompositedScrolling) {
+        // If it's scrollable, it has to be a box.
+        auto& renderBox = downcast<RenderBox>(renderer());
+        FloatRoundedRect contentsClippingRect = renderer().style().getRoundedInnerBorderFor(renderBox.borderBoxRect()).pixelSnappedRoundedRectForPainting(deviceScaleFactor());
+        needsDescendantsClippingLayer = contentsClippingRect.isRounded();
+    } else
+        needsDescendantsClippingLayer = compositor.clipsCompositingDescendants(m_owningLayer);
 
     if (updateScrollingLayers(usesCompositedScrolling))
         layerConfigChanged = true;
@@ -726,7 +730,7 @@
         layerConfigChanged = true;
 
     // clippedByAncestor() does a tree walk.
-    if (updateAncestorClippingLayer(compositor().clippedByAncestor(m_owningLayer)))
+    if (updateAncestorClippingLayer(compositor.clippedByAncestor(m_owningLayer)))
         layerConfigChanged = true;
 
     if (updateOverflowControlsLayers(requiresHorizontalScrollbarLayer(), requiresVerticalScrollbarLayer(), requiresScrollCornerLayer()))
@@ -794,7 +798,7 @@
         layerConfigChanged = true;
     }
 #endif
-    if (is<RenderWidget>(renderer()) && compositor().parentFrameContentLayers(downcast<RenderWidget>(renderer()))) {
+    if (is<RenderWidget>(renderer()) && compositor.parentFrameContentLayers(downcast<RenderWidget>(renderer()))) {
         m_owningLayer.setNeedsCompositingGeometryUpdate();
         layerConfigChanged = true;
     }
@@ -1082,6 +1086,7 @@
     // If we have a layer that clips children, position it.
     LayoutRect clippingBox;
     if (auto* clipLayer = clippingLayer()) {
+        // clipLayer is the m_childContainmentLayer.
         clippingBox = clipBox(downcast<RenderBox>(renderer()));
         // Clipping layer is parented in the primary graphics layer.
         LayoutSize clipBoxOffsetFromGraphicsLayer = toLayoutSize(clippingBox.location()) + rendererOffset.fromPrimaryGraphicsLayer();
@@ -1185,12 +1190,13 @@
         ASSERT(m_scrolledContentsLayer);
         auto& renderBox = downcast<RenderBox>(renderer());
         LayoutRect paddingBoxIncludingScrollbar = renderBox.paddingBoxRectIncludingScrollbar();
-        ScrollOffset scrollOffset = m_owningLayer.scrollOffset();
+        LayoutRect parentLayerBounds = clippingLayer() ? clippingBox : compositedBounds();
 
         // FIXME: need to do some pixel snapping here.
-        m_scrollContainerLayer->setPosition(FloatPoint(paddingBoxIncludingScrollbar.location() - compositedBounds().location()));
-        m_scrollContainerLayer->setSize(roundedIntSize(LayoutSize(renderBox.clientWidth(), renderBox.clientHeight())));
+        m_scrollContainerLayer->setPosition(FloatPoint(paddingBoxIncludingScrollbar.location() - parentLayerBounds.location()));
+        m_scrollContainerLayer->setSize(roundedIntSize(LayoutSize(renderBox.paddingBoxWidth(), renderBox.paddingBoxHeight())));
 
+        ScrollOffset scrollOffset = m_owningLayer.scrollOffset();
         updateScrollOffset(scrollOffset);
 #if PLATFORM(IOS_FAMILY)
         m_scrolledContentsLayer->setPosition({ }); // FIXME: necessary?
@@ -1197,12 +1203,12 @@
 #endif
 
         FloatSize oldScrollingLayerOffset = m_scrollContainerLayer->offsetFromRenderer();
-        m_scrollContainerLayer->setOffsetFromRenderer(-toFloatSize(paddingBoxIncludingScrollbar.location()));
+        m_scrollContainerLayer->setOffsetFromRenderer(toFloatSize(paddingBoxIncludingScrollbar.location()));
 
         if (m_childClippingMaskLayer) {
             m_childClippingMaskLayer->setPosition(m_scrollContainerLayer->position());
             m_childClippingMaskLayer->setSize(m_scrollContainerLayer->size());
-            m_childClippingMaskLayer->setOffsetFromRenderer(-toFloatSize(paddingBoxIncludingScrollbar.location()));
+            m_childClippingMaskLayer->setOffsetFromRenderer(toFloatSize(paddingBoxIncludingScrollbar.location()));
         }
 
         bool paddingBoxOffsetChanged = oldScrollingLayerOffset != m_scrollContainerLayer->offsetFromRenderer();
@@ -1708,7 +1714,6 @@
 {
     if (hasClippingLayer() && needsDescendantsClippingLayer) {
         if (is<RenderBox>(renderer()) && (renderer().style().clipPath() || renderer().style().hasBorderRadius())) {
-            // FIXME: we shouldn't get geometry here as layout may not have been udpated.
             LayoutRect boxRect(LayoutPoint(), downcast<RenderBox>(renderer()).size());
             boxRect.move(contentOffsetInCompostingLayer());
             FloatRoundedRect contentsClippingRect = renderer().style().getRoundedInnerBorderFor(boxRect).pixelSnappedRoundedRectForPainting(deviceScaleFactor());
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to