Contents of a scrollable flexbox container are sized wrong when container width changes
Reported by
jimmyma...@gmail.com,
Nov 9
|
||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.77 Safari/537.36 Steps to reproduce the problem: 1. Go to: https://jsfiddle.net/jmabey/jnv83a70/ 2. This test case contains two scrollable containers: one with a flexbox layout and the other without flexbox. Hovering over the red boxes changes the height of those boxes. Both containers should function the same initially. 3. Click the "Toggle width" button multiple times to change the width of the scrollable containers. Notice the flexbox version has a flickering horizontal scrollbar as it animates and the width of the red box is sometimes slightly too wide (watch the right side of it). Also notice hovering over the red box will "fix" the width if the width is off. The non-flexbox version has none of these issues. The attached GIF demonstrates this test case. What is the expected behavior? Both flexbox and non-flexbox containers in the test case should look and animate identically when their widths change. What went wrong? When a flexbox container has a scrollbar and its width changes, the width of its contents are not updated correctly. If the change in width is animated, a horizontal scrollbar flickers during the animation. Did this work before? No Does this work in other browsers? Yes Chrome version: 70.0.3538.77 Channel: stable OS Version: 10.0 Flash Version: No issues with Firefox 63, Edge 17, or IE11 on Windows 10.
,
Nov 12
Tried testing the issue on chrome reported version# 70.0.3538.77 using Windows-10 with steps mentioned below: 1) Launched chrome reported version and navigated to URL: https://jsfiddle.net/jmabey/jnv83a70/ provided in comment# 0 2) Hovered mouse over red boxes in scrollable containers(one with 'Flexbox' layout and 'No Flexbox' layout), on hovering observing height of red boxes changes vertically 3) Clicked on "Toggle width" button multiple times to change the width of the scrollable containers, observed the horizontal red box in 'Flexbox' is slightly too wide when compared to red box in 'No Flexbox', hovering the mouse on it width of the two red boxes is same, but height is getting changed vertically in both containers. @Reporter: Please find the attached screencast for your reference and let us know if we missed anything in reproducing the issue, provide your feedback on it which help in further triaging it in better way. Thanks!
,
Nov 12
I can reproduce both problems with Chrome 72.0.3595.2 dev (Linux). Not reproducible with LayoutNG; works fine there.
,
Nov 12
@viswa.karala: Screencast looks good. I don't see anything missing.
,
Nov 21
Able to reproduce the issue on chrome reported version# 70.0.3538.77, 70.0.3538.110 and on latest chrome# 72.0.3616.0 with URL provided in comment# 0 using Windows-10 and Ubuntu 14.04(with default chrome settings). As this issue is seen from M-60(60.0.3112.0), hence considering this issue as Non-Regression. Note: Issue is not seen on Mac OS and leaving this status in Available for further inputs from Dev team. Thanks! |
||||
►
Sign in to add a comment |
||||
Comment 1 by phanindra.mandapaka@chromium.org
, Nov 10