Bisect info: 423836 (good) - 423842 (bad)
https://chromium.googlesource.com/chromium/src/+log/ac874de1..b25a9d3a?pretty=fuller
Suspecting r423839 = da340247a837f07594b3fcfb59a4e4493dc0fd45 = https://crrev.com/2398043002 by rego@igalia.com
"[css-grid] Stretch should grow and shrink items to fit its grid area"
Landed in 56.0.2884.0

Note, the regression occurred before CSS Grid was shipped in r433853 (57.0.2929.0) so in order to bisect the bug it was required to force-enable the feature via the following command line:

chrome --enable-blink-features=CSSGridLayout

Able to reproduce the issue on reported chrome version 63.0.3239.132 and on the latest canary 65.0.3315.0 using Windows 10, Mac 10.13.1 and Ubuntu 14.04.

As per comment#1 suspecting the same
Change log: https://chromium.googlesource.com/chromium/src/+log/ac874de1..b25a9d3a?pretty=fuller
Suspecting: r423839 = da340247a837f07594b3fcfb59a4e4493dc0fd45 
Review URL: https://codereview.chromium.org/2398043002

@rego@igalia.com: Please help in re-assigning it to others if not related to your change.

Thanks!

Thanks for the bug report.

The issue is related with the painting optimizations of CSS Grid Layout
that are only present in Chromiun (and not in WebKit).
I've verified that if we use regular painting from BlockPainter
instead of the optimizations in GridPainter the item is properly painted on scroll.

The grid container in my example has 2 rows: 200px 0px.
And only one huge item on the first row.
For some reason, the painting code at some moment during scrolling consider that
it shouldn't paint the item somehow.
Note that having only one 200px row fixes the problem.

I don't believe that specific commit has anything to do with the issue,
but of course we need to investigate and fix it.

Deleted: chrome-painting-bug.html 6.8 KB

chrome-painting-bug.html 6.8 KB View Download

After debugging a little bit the issue, the problem is that the item's size is 100x200,
so it doesn't overflow the grid area.
But the contents of the item overflow the grid area and we're not taking that into account,
which makes that we don't paint the item when the local_visual_rect (cull rect) is moved down.

The related code is in GridPainter::PaintChildren():
https://chromium.googlesource.com/chromium/src/+/9fc9bd0a46cdaf404da5f6a6bf7818721c554e2d/third_party/WebKit/Source/core/paint/GridPainter.cpp#47

Not a P1 regression for tracking purposes if nobody caught it in 7 releases.

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/f52219fdc7968529a0e9530c8da04fe7d4f46b3e

commit f52219fdc7968529a0e9530c8da04fe7d4f46b3e
Author: Manuel Rego Casasnovas <rego@igalia.com>
Date: Thu Jan 18 06:09:52 2018

[css-grid] Fix painting of grid items with overflowing contents

On Grid Layout we've an optimization on the painting code,
to avoid painting the whole grid. We look for the dirtied grid areas
and paint only the items on those areas.
At the same time we keep a list of the items overflowing its area,
and we paint them too.

The problem found on the bug is that the item is not overflowing
the grid area, but the contents of the item are overflowing it.
We were using FrameRect() to check this, which returns
the size of the item, but we need to check also
the overflowing contents, so the patch uses FrameRect()
for the position (which takes into account the margins)
and VisualOverflowRect() for the size.
That way the items with overflowing contents are always painted.

On the test we need 2 tracks, because of how
GridPainter::DirtiedGridAreas() is implemented.
It's using std::upper_bound() which returns the last element
if none of them is greater than the one passed.
This makes that the items on the last cell are painted
even in the cases fixed by this patch,
as the last cell is considered to be dirty in those situations.

BUG= 800386 
TEST=fast/css-grid-layout/grid-painting-item-overflow.html

Cq-Include-Trybots: master.tryserver.blink:linux_trusty_blink_rel;master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2
Change-Id: I59521880207b75a5541a0e0c25e214d309e90661
Reviewed-on: https://chromium-review.googlesource.com/860660
Commit-Queue: Manuel Rego Casasnovas <rego@igalia.com>
Reviewed-by: Christian Biesinger <cbiesinger@chromium.org>
Cr-Commit-Position: refs/heads/master@{#530068}
[add] https://crrev.com/f52219fdc7968529a0e9530c8da04fe7d4f46b3e/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-painting-item-overflow-expected.html
[add] https://crrev.com/f52219fdc7968529a0e9530c8da04fe7d4f46b3e/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-painting-item-overflow.html
[modify] https://crrev.com/f52219fdc7968529a0e9530c8da04fe7d4f46b3e/third_party/WebKit/Source/core/layout/LayoutGrid.cpp
[modify] https://crrev.com/f52219fdc7968529a0e9530c8da04fe7d4f46b3e/third_party/WebKit/Source/core/paint/GridPainter.cpp

Thank you! Tested it in Canary and it all works.