Fix painting of composited overflow controls with visibility:hidden
We can have a composited scroller with visibility:hidden if it has
visibility:visible descendants. We should skip painting of overflow
controls in the case. Ideally we should not create composited
overflow control layers, but I would not touch the
pre-CompositeAfterPaint code for the rare case.
Bug: 1187818, 1185968
Change-Id: If59049a685fa153b6538f8ca2424792904096000
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2761470
Reviewed-by: Philip Rogers <pdr@chromium.org>
Commit-Queue: Xianzhu Wang <wangxianzhu@chromium.org>
Cr-Commit-Position: refs/heads/master@{#863011}
diff --git a/css/css-overflow/overflow-scroll-resize-visibility-hidden-ref.html b/css/css-overflow/overflow-scroll-resize-visibility-hidden-ref.html
new file mode 100644
index 0000000..571ba34
--- /dev/null
+++ b/css/css-overflow/overflow-scroll-resize-visibility-hidden-ref.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<style>
+.scroller {
+ width: 100px;
+ height: 100px;
+ overflow: scroll;
+ /* to make the scroller a white mask over the content */
+ filter: brightness(0) invert(1);
+ position: relative;
+ top: -200px;
+}
+.content {
+ width: 100px;
+ height: 100px;
+ background: green;
+}
+</style>
+<div class="content"></div>
+<div class="content"></div>
+<div class="scroller"></div>
+<div class="scroller"></div>
diff --git a/css/css-overflow/overflow-scroll-resize-visibility-hidden.html b/css/css-overflow/overflow-scroll-resize-visibility-hidden.html
new file mode 100644
index 0000000..e8d0bc9
--- /dev/null
+++ b/css/css-overflow/overflow-scroll-resize-visibility-hidden.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<title>CSS Overflow: overflow: scroll with resize: both and visibility: hidden</title>
+<link rel="help" href="https://drafts.csswg.org/css-overflow-3#propdef-overflow">
+<link rel="match" href="overflow-scroll-resize-visibility-hidden-ref.html">
+<style>
+.scroller {
+ overflow: scroll;
+ width: 100px;
+ height: 100px;
+ resize: both;
+ visibility: hidden;
+}
+.content {
+ width: 1000px;
+ height: 1000px;
+ background: green;
+ visibility: visible;
+}
+</style>
+<div class="scroller">
+ <div class="content"></div>
+</div>
+<div class="scroller" style="will-change: transform">
+ <div class="content"></div>
+</div>
