New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 854783 link

Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Closed: Jul 3
Cc:
Components:
EstimatedDays: ----
NextAction: 2018-07-10
OS: Windows
Pri: 2
Type: Bug



Sign in to add a comment

CSS columns not rendering some css properties(like background-color or border) properly

Reported by banoushi...@gmail.com, Jun 20 2018

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3463.0 Safari/537.36

Steps to reproduce the problem:
1. set container with a columns property to any value
2. put childs in the container with a background-color 

What is the expected behavior?
Background color display fine when resizing the window

What went wrong?
Background color on the first column doesn't render right when resizing the window

Did this work before? No 

Does this work in other browsers? Yes

Chrome version: 69.0.3463.0  Channel: n/a
OS Version: 10.0
Flash Version: 

Example of the bug here https://codesandbox.io/s/7ky8ovrrm1
Just resize the live result page and you'll see that the first column background's get glitchy sometimes.
I also found a fix for the issue, setting 'transform: translateZ(0);' on the childs make them render right
 
Labels: Needs-Triage-M69
Cc: krajshree@chromium.org
Labels: Triaged-ET Needs-Feedback
Unable to reproduce the issue on Win-10 using chrome reported version #69.0.3463.0 and latest canary #69.0.3466.0.

Attached a screen cast for reference.

Following are the steps followed to reproduce the issue.
------------
1. Navigated to url: https://codesandbox.io/s/7ky8ovrrm1.
2. Resized the window.
3. Observed that background color displayed fine when resizing the window as expected.

banoushirosaki@ - Could you please check this issue on latest canary #69.0.3466.0 by creating a new profile without any apps and extensions and please let us know if the issue still persist or not. Also please help us by providing a screen cast if possible for better understanding of the issue.

Thanks...!!
854783.mp4
3.7 MB View Download
You have to resize the result element of codesandbox, but it'd do the same with the window resize if you used columns on a website instead of a sandbox,
in my video you can see the background color of the items on the first column stops at a certain width, while the text still moves
2018-06-21_21-40-59.mp4
460 KB View Download
Project Member

Comment 4 by sheriffbot@chromium.org, Jun 21 2018

Labels: -Needs-Feedback
Thank you for providing more feedback. Adding the requester to the cc list.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

Comment 5 by e...@chromium.org, Jun 28 2018

Components: -Blink>Layout Blink>Layout>MultiCol
Labels: Needs-Feedback
NextAction: 2018-07-10
Unable to reproduce. Do you have any experimental features turned on?
The bug happen on both normal and canary, i'm not using any experimental features.
Project Member

Comment 7 by sheriffbot@chromium.org, Jun 30 2018

Cc: e...@chromium.org
Labels: -Needs-Feedback
Thank you for providing more feedback. Adding the requester to the cc list.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Owner: mstensho@chromium.org
Status: Assigned (was: Unconfirmed)
Any idea what might be going on here mstensho?
I can reproduce this (Mac). Attaching non-interactive test.

Some sort of invalidation issue.
tc.html
459 bytes View Download
Cc: chrishtr@chromium.org wangxianzhu@chromium.org
I'd like some input from the paint team (before I spend too much time on my own in code I'm unfamiliar with). I observe that the box is repainted, but we seem to be stuck with and old clip rectangle or something. Maybe it's the flow thread (anonymous parent of the two DIVs) that doesn't get properly updated, but I don't know where to look.
I think the direct reason is the incorrect FragmentClip of the first fragment. The following is part of the dump of paint record with paint logging (--vmodule=*/paint/*=3,*/graphics/*=3):

            {
              "method": "clipRect",
              "params": {
                "rect": {
                  "left": -999992,
                  "top": -999950,
                  "right": 58,   <--- Should be 258
                  "bottom": 550
                },
                "SkRegion::Op": "kIntersect_Op",
                "softClipEdgeStyle": true
              }
            },
            {
              "method": "drawRect",
              "params": {
                "rect": {
                  "left": 8,
                  "top": 50,
                  "right": 258,
                  "bottom": 550
                },
                "paint": {
                  "textSize": 12,
                  "textScaleX": 1,
                  "textSkewX": 0,
                  "color": "#FF0000FF",
                  ....
                }
              }
            },
            {
              "method": "restore"
            },

The clip tree is:
 Clip tree:
root 0x1319ffc44e10 {"localTransformSpace":"0x1319ffca8650","rect":"InfiniteIntRect"}
  OverflowClip (LayoutView #document) 0x1319ffc44f10 {"parent":"0x1319ffc44e10","localTransformSpace":"0x1319ffca8b50","rect":"0,0 800x600","rectExcludingOverlayScrollbars":"0,0 800x600"}
    FragmentClip (LayoutMultiColumnFlowThread (anonymous)) 0x1319ffc45010 {"parent":"0x1319ffc44f10","localTransformSpace":"0x1319ffca8b50","rect":"-999992,-999950 1.00005e+06x1.0005e+06"}
    FragmentClip (LayoutMultiColumnFlowThread (anonymous)) 0x1319ffc45110 {"parent":"0x1319ffc44f10","changed":true,"localTransformSpace":"0x1319ffca8b50","rect":"258,50 1e+06x999500"}

Still trying to find out the reason of the incorrect FragmentClip.
Cc: mstensho@chromium.org
Components: -Blink>Layout>MultiCol Blink>Paint
Owner: wangxianzhu@chromium.org
I added SetSubtreeNeedsPaintPropertyUpdate() in LocalFrameView::PrePaint() before PrePaintTreeWalk().WalkTree(), and the bug disappeared. So the bug should be an under-invalidation of paint properties of the LayoutMultiColumnFlowThread when something that will affect FragmentClip changes (when we should call SetNeedsPaintPropertyUpdate).
Status: Fixed (was: Assigned)
The NextAction date has arrived: 2018-07-10

Sign in to add a comment