Multi-column layout shifts upon click, regression
Reported by
apapirov...@undone.me,
May 8 2017
|
|||||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3088.3 Safari/537.36 Steps to reproduce the problem: 1. Go to https://www.undone.me/men 2. Click on an image in the 2nd or 3rd columns (don't even have to release the click, just hold it) — hover doesn't trigger the bug, has to be a mousedown What is the expected behavior? Image should stay in place within the multi-column layout What went wrong? Image disappears but in reality it's just shifting into the bottom of the neighbouring column. There's no reason a click should produce such behaviour since no layout change is applied. The only change happens on hover and even then it doesn't affect the layout box of the item itself, just the insides. Did this work before? Yes 57 Does this work in other browsers? Yes Chrome version: 60.0.3088.3 Channel: dev OS Version: OS X 10.12.4 Flash Version: Shockwave Flash 26.0 r0 I can produce a reduced test-case potentially but pretty busy right now and this should be pretty straightforward to replicate. It's a bit of a high-priority bug for us since the site is in production and used by a decent number of users. Wouldn't want this to make it into production and I know this has been an issue since at least v59 dev or so.
,
May 9 2017
Able to reproduce this issue on windows 7, Mac 10.12.4,Linux Ubuntu 14.04 with Chrome stable version-58.0.3029.96 and Canary-60.0.3091.0. Manual Bisect: ------------- Good-59.0.3037.0-Revision-455955 Bad-59.0.3038.0-Revision-456244 Per Revision Bisect Tool Info: ----------------- You are probably looking for a change made after 455981 (known good), but no later than 455982 (first known bad). CHANGELOG URL: The script might not always return single CL as suspect as some perf builds might get missing due to failure. https://chromium.googlesource.com/chromium/src/+log/a958e2950a29ba6f293d95e3a93c3c0235db2b94..a1277dcaaae26865cc6591bda0d6d696b5a0f073 chrishtr@ Kindly take a look and please help us to reassign this issue to a right owner if not with respect to this change. Thanks.!
,
May 10 2017
,
May 10 2017
Sounds like a weird layout thing if the images is shifting around. I'll cc eae so he can take a look too.
,
May 10 2017
Reduced testcase attached. adding outline: -webkit-focus-ring-color auto 5px; causes the second-column div to move position.
,
May 15 2017
The bug appears to be that outline is not considered part of the column bounds. Thus the edge of the outline for the blue rectangle is actually within the first column, not the second. When that point is mapped from flow thread to visual space, we then end up with a point in the first column, which is why the rectangle jumps around columns.
,
May 19 2017
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/f4166640f3a4119cdb4b33e2f16ebdd28ef6ff7f commit f4166640f3a4119cdb4b33e2f16ebdd28ef6ff7f Author: chrishtr <chrishtr@chromium.org> Date: Fri May 19 05:03:13 2017 Only adjust composited pagination position to account for lines offset of inlines. BUG= 719561 CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2 Review-Url: https://codereview.chromium.org/2883083004 Cr-Commit-Position: refs/heads/master@{#473092} [modify] https://crrev.com/f4166640f3a4119cdb4b33e2f16ebdd28ef6ff7f/third_party/WebKit/LayoutTests/FlagExpectations/enable-slimming-paint-v2 [modify] https://crrev.com/f4166640f3a4119cdb4b33e2f16ebdd28ef6ff7f/third_party/WebKit/LayoutTests/paint/pagination/composited-paginated-inline-expected.html [modify] https://crrev.com/f4166640f3a4119cdb4b33e2f16ebdd28ef6ff7f/third_party/WebKit/LayoutTests/paint/pagination/composited-paginated-inline.html [add] https://crrev.com/f4166640f3a4119cdb4b33e2f16ebdd28ef6ff7f/third_party/WebKit/LayoutTests/paint/pagination/composited-paginated-outlined-box-expected.html [add] https://crrev.com/f4166640f3a4119cdb4b33e2f16ebdd28ef6ff7f/third_party/WebKit/LayoutTests/paint/pagination/composited-paginated-outlined-box.html [modify] https://crrev.com/f4166640f3a4119cdb4b33e2f16ebdd28ef6ff7f/third_party/WebKit/Source/core/layout/compositing/CompositedLayerMapping.cpp
,
May 19 2017
,
May 23 2017
Tested the issue on windows 7, Mac 10.12.4, Linux Ubuntu 14.04 using chrome version#60.0.3107.4 with the steps mentioned in comment #0.Observed Image is not getting disappeared when user click on 2nd & 3rd column images.Hence adding TE-Verified labels. Please find the attached screen cast for the same. Thanks!! |
|||||||
►
Sign in to add a comment |
|||||||
Comment 1 by ajha@chromium.org
, May 9 2017