Div with fixed position and animated sibling is cropped by absolutely positioned div with z-index and overflow: auto
Reported by
alexande...@gmail.com,
Jun 7 2016
|
||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.84 Safari/537.36 Example URL: https://jsfiddle.net/AlexLukin/k61p7yg5/ Steps to reproduce the problem: See JSFiddle attached to the bug https://jsfiddle.net/AlexLukin/k61p7yg5/ Or this source code <div id="parent"> <div id="fixed"> </div> <div id="animated"> </div> </div> #parent { position: absolute; z-index: 0; overflow: auto; background-color: burlywood; width: 150px; height: 150px; } #animated { position: absolute; width: 10px; height: 10px; top: 50px; left: 50px; background: black; animation: raysFade 1.1s linear infinite; } #fixed { position: fixed; top: 30px; left: 30px; height: 200px; width: 200px; background-color: rosybrown; } @keyframes raysFade { 0% { opacity: 1; } 100% { opacity: 0; } } What is the expected behavior? Part of the #fixed div, that is outside of #parent div should be displayed on top of document body. What went wrong? If we apply non-auto value of z-index CSS property or set overflow: auto to #parent div, or set animation to any sibling of the div with fixed position, then #parent div crops child #fixed div. Part of #fixed div which is outside of #parent div isn't displayed. Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? No Does this work in other browsers? Yes Chrome version: 51.0.2704.84 Channel: stable OS Version: 6.1 (Windows 7, Windows Server 2008 R2) Flash Version: Shockwave Flash 21.0 r0
,
Jun 9 2016
,
Jun 28 2016
The conditions described in the bug are that all three of the conditions have to hold, not the "or" of them. The problem is that either the fixed-position element is not self-composited, or that it does not contribute to #parent's composited layer bounds.
,
Nov 14 2016
The reason the fixed-position descendant does not contribute to its parent's composited layer bounds is that PaintLayer::boundingBoxForCompositing assumes that all PaintLayers which are painted into the same composited layer are clipped by the localClipRect of the PaintLayer which owns that composited layer.
,
Nov 14 2016
I have a fix for this bug: https://codereview.chromium.org/2502833002
,
Nov 18 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/b33e49953078995f1cd28663a8a8b43012ac2eb0 commit b33e49953078995f1cd28663a8a8b43012ac2eb0 Author: chrishtr <chrishtr@chromium.org> Date: Fri Nov 18 17:43:08 2016 Don't early out recursion into PaintLayerChildren when computing composited bounds. PaintLayer::boundingBoxForCompositing recursively computes the union of the bounds of a root PaintLayer and its non-comositing descendants. Previously, in PaintLayer::boundingBoxForCompositing, there was code that would avoid recursing into PaintLayer children if the PaintLayer was clipped. This is incorrect if there are any PaintLayer descendants that have different clipping ancestors than the current PaintLayer. Also fixed a bug that transform-related properties were not considered containing blocks for clipping of fixed-position children. BUG= 618046 CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2 Review-Url: https://codereview.chromium.org/2502833002 Cr-Commit-Position: refs/heads/master@{#433232} [modify] https://crrev.com/b33e49953078995f1cd28663a8a8b43012ac2eb0/third_party/WebKit/LayoutTests/compositing/contents-opaque/filter-expected.txt [add] https://crrev.com/b33e49953078995f1cd28663a8a8b43012ac2eb0/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant-expected.png [add] https://crrev.com/b33e49953078995f1cd28663a8a8b43012ac2eb0/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant-expected.txt [add] https://crrev.com/b33e49953078995f1cd28663a8a8b43012ac2eb0/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant.html [modify] https://crrev.com/b33e49953078995f1cd28663a8a8b43012ac2eb0/third_party/WebKit/Source/core/paint/PaintLayer.cpp [modify] https://crrev.com/b33e49953078995f1cd28663a8a8b43012ac2eb0/third_party/WebKit/Source/core/paint/PaintLayerClipper.cpp [modify] https://crrev.com/b33e49953078995f1cd28663a8a8b43012ac2eb0/third_party/WebKit/Source/core/paint/PaintLayerClipperTest.cpp
,
Nov 18 2016
,
Nov 20 2016
,
Nov 21 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/754b0c5c59d039c70bd6fea540af4b706ea39c77 commit 754b0c5c59d039c70bd6fea540af4b706ea39c77 Author: mgiuca <mgiuca@chromium.org> Date: Mon Nov 21 02:19:08 2016 Revert of Don't early out recursion into PaintLayerChildren when computing composited bounds. (patchset #6 id:100001 of https://codereview.chromium.org/2502833002/ ) Reason for revert: Speculative revert for https://crbug.com/667144 . A checkfail in PaintController.cpp started happening reliably in between r433228 and r433235. This CL looks closely related. BUG= 667144 Original issue's description: > Don't early out recursion into PaintLayerChildren when computing composited bounds. > > PaintLayer::boundingBoxForCompositing recursively computes the union of the > bounds of a root PaintLayer and its non-comositing descendants. Previously, in PaintLayer::boundingBoxForCompositing, there was code that would avoid recursing > into PaintLayer children if the PaintLayer was clipped. This is incorrect if there > are any PaintLayer descendants that have different clipping ancestors than > the current PaintLayer. > > Also fixed a bug that transform-related properties were not considered containing > blocks for clipping of fixed-position children. > > BUG= 618046 > CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2 > > Committed: https://crrev.com/b33e49953078995f1cd28663a8a8b43012ac2eb0 > Cr-Commit-Position: refs/heads/master@{#433232} TBR=wangxianzhu@chromium.org,chrishtr@chromium.org # Not skipping CQ checks because original CL landed more than 1 days ago. BUG= 618046 Review-Url: https://codereview.chromium.org/2517863002 Cr-Commit-Position: refs/heads/master@{#433468} [modify] https://crrev.com/754b0c5c59d039c70bd6fea540af4b706ea39c77/third_party/WebKit/LayoutTests/compositing/contents-opaque/filter-expected.txt [delete] https://crrev.com/de0cc48f37dd53a19b0d14dd998b913f06c88599/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant-expected.png [delete] https://crrev.com/de0cc48f37dd53a19b0d14dd998b913f06c88599/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant-expected.txt [delete] https://crrev.com/de0cc48f37dd53a19b0d14dd998b913f06c88599/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant.html [modify] https://crrev.com/754b0c5c59d039c70bd6fea540af4b706ea39c77/third_party/WebKit/Source/core/paint/PaintLayer.cpp [modify] https://crrev.com/754b0c5c59d039c70bd6fea540af4b706ea39c77/third_party/WebKit/Source/core/paint/PaintLayerClipper.cpp [modify] https://crrev.com/754b0c5c59d039c70bd6fea540af4b706ea39c77/third_party/WebKit/Source/core/paint/PaintLayerClipperTest.cpp
,
Nov 23 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/53800170ca9baffde6cbb2d9b62d12caf40bfd79 commit 53800170ca9baffde6cbb2d9b62d12caf40bfd79 Author: chrishtr <chrishtr@chromium.org> Date: Wed Nov 23 00:59:24 2016 Reland: Don't early out recursion into PaintLayerChildren when computing composited bounds. The difference from last time is that the root ancestorLayer is passed along to PaintLayer::expandRectForStackingChildren, so that localClipRect rects are computed w.r.t the composited element, not the stacking parent. BUG= 618046 CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2 Review-Url: https://codereview.chromium.org/2521033003 Cr-Commit-Position: refs/heads/master@{#434051} [modify] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/LayoutTests/compositing/contents-opaque/filter-expected.txt [add] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant-expected.png [add] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant-expected.txt [add] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/LayoutTests/paint/overflow/non-composited-fixed-position-descendant.html [modify] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/Source/core/layout/ClipRect.h [modify] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/Source/core/paint/PaintLayer.cpp [modify] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/Source/core/paint/PaintLayer.h [modify] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/Source/core/paint/PaintLayerClipper.cpp [modify] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/Source/core/paint/PaintLayerClipperTest.cpp [modify] https://crrev.com/53800170ca9baffde6cbb2d9b62d12caf40bfd79/third_party/WebKit/Source/core/paint/PaintLayerTest.cpp |
||||||
►
Sign in to add a comment |
||||||
Comment 1 by cbiesin...@chromium.org
, Jun 7 2016