New issue
Advanced search Search tips

Issue 919297 link

Starred by 5 users

Issue metadata

Status: Fixed
Owner:
Closed: Today
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Mac
Pri: 1
Type: Bug



Sign in to add a comment

[LayoutNG] small thumbnail images not showing properly (stretched out)

Reported by josh.lin...@gmail.com, Jan 5

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3662.0 Safari/537.36

Example URL:
http://www.espn.com/mens-college-basketball/scoreboard/_/group/2/date/20190105

Steps to reproduce the problem:
1. go to the page (either regular or PRIVATE browsing)
2. CONFIRM with Safari - works fine
3. CONFIRM with OLDER chrome - works fine

What is the expected behavior?
images show properly

What went wrong?
images are stretched and not showing

Does it occur on multiple sites: No

Is it a problem with a plugin? No 

Did this work before? Yes v72 or v73, not sure

Does this work in other browsers? Yes

Chrome version: 73.0.3662.0  Channel: canary
OS Version: OS X 10.14.2
Flash Version:
 
chrome-73-images-broken.png
408 KB View Download
Labels: Needs-Triage-M73 Needs-Bisect
Cc: phanindra.mandapaka@chromium.org
Components: Blink>Image
Labels: Triaged-ET Needs-Feedback
Tanks for filing the issue...

Unable to reproduce the issue on reported chrome version 73.0.3662.0 using Mac 10.14.0. Attaching screenshot for reference.
Steps: 
------
1. Launched reported chrome 
2. Navigated the URL "http://www.espn.com/mens-college-basketball/scoreboard/_/group/2/date/20190105"
As we have observed that thumbnail images loading properly

@Reporter: Request you to retry this issue with fresh profile without any extensions & apps or reset all the flags and let us know if issue still persists.

Thanks.!
919297.png
302 KB View Download
NextAction: 2019-01-21
Components: -Blink>Image Blink>Paint
Labels: -Pri-2 -Needs-Feedback RegressedIn-73 Target-73 FoundIn-73 Pri-1
NextAction: ----
Owner: schenney@chromium.org
Status: Assigned (was: Unconfirmed)
Fallout from background image changes, I suspect. Maybe only on Retina displays. I'll bisect.
Retried the issue on reported chrome 73.0.3662.0 using Mac 10.14.1(Retina with touch bar), 10.13.6(Retina),10.14.0 and 10.13.6. As the issue is not reproducible from our end, hence unable to provide bisect from TE end. Requesting Dev (schenney@chromium.org) to provide further inputs on it.

Thanks..!
Components: -Blink>Paint Blink>Layout
Labels: ReleaseBlock-Beta
Owner: ----
Status: Untriaged (was: Assigned)
This is specific to LayoutNG. Verified by enabling/disabling the flag in Canary. Layout team, let me know if you want me to try to fix it.
The issue is with a max-width specified on an img tag, with no max-height. The image is 70x70, the max-width is 35, and the resulting box is sized 35x70, instead of maintaining it's intrinsic dimensions and being 35x35.
Project Member

Comment 8 by sheriffbot@chromium.org, Jan 8

Cc: schenney@chromium.org
This issue is marked as a release blocker with no milestone associated. Please add an appropriate milestone.

All release blocking issues should have milestones associated to it, so that the issue can tracked and the fixes can be pushed promptly.

Thanks for your time! To disable nags, add the Disable-Nags label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Labels: -Type-Compat -Needs-Bisect M-73 FoundIn-71 FoundIn-72 OS-Linux OS-Windows Type-Bug-Security
As per comment #6, able to reproduce the issue on reported chrome 73.0.3662.0 and latest chrome 73.0.3665.0 using Mac 10.14.0, Windows 10 and Ubuntu 17.10.
Steps:
1. Launched chrome 
2. Enabled LayoutNG flag by navigating chrome://flags 
3. Opened given url in comment #0 and observed that the images are stretched
Same behavior is seen from M-69(New-UI) hence considering it as non-regression and adding appropriate labels to it. Removing Needs-Bisect label to it if required feel free to add.

Thanks..! 
Labels: -Type-Bug-Security Type-Bug
Labels: LayoutNG
Owner: mstensho@chromium.org
Status: Assigned (was: Untriaged)
Summary: [LayoutNG] small thumbnail images not showing properly (stretched out) (was: small thumbnail images not showing properly (stretched out))
Cc: atotic@chromium.org
Out-of-flow size calculation issue.
tc.html
354 bytes View Download
Status: Started (was: Assigned)
Owner: atotic@chromium.org
ComputeReplacedSize does not take min/max-width/height into account. Need to implement overconstrained resolution from;
https://www.w3.org/TR/CSS2/visudet.html#min-max-widths
Cc: mstensho@chromium.org
I analyzed this on Friday. As far as I could see (which I hadn't posted here yet), this isn't really related to out-of-flow positioning after all. It's just that in-flow layout lets the legacy engine calculate the size (and legacy does it correctly), while out-of-flow positioning uses NG ComputeReplacedSize(), which has issues with retaining the aspect ratio, when {min,max}-{width,height} is involved. If we switch over to always using ComputeReplacedSize(), regardless of out-of-flow or not, I suspect we'd observe the same problems for regular in-flow replaced content.
Cc: eaeltsin@chromium.org ikilpatrick@chromium.org
 Issue 922056  has been merged into this issue.

Comment 17 by mstensho@chromium.org, Jan 16 (6 days ago)

Cc: -eaeltsin@chromium.org e...@chromium.org

Comment 18 by jmukthavaram@chromium.org, Jan 17 (5 days ago)

Friendly ping to get an update as it is marked as RBB.
Thanks..!

Comment 20 by mstensho@chromium.org, Jan 17 (5 days ago)

Labels: -ReleaseBlock-Beta
Doesn't need to be RBB, though. LayoutNG isn't shipping in the next beta.

Comment 21 by mstensho@chromium.org, Jan 18 (4 days ago)

Issue 922276 has been merged into this issue.
Project Member

Comment 22 by bugdroid, Today (9 hours ago)

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

commit 20defaa46c2c7581b85044d00dc7afa82eac6b18
Author: Aleks Totic <atotic@chromium.org>
Date: Tue Jan 22 21:32:18 2019

[LayoutNG] ComputeReplacedSize min/max width/height fix

This fix introduces a difference between how Legacy and
NG handle an edge case.
When replaced element:
- has no intrinsic size, has no aspect ratio,
- has border+padding.

The spec specifies that element's inline size should be computed
as stretch-width, filling the container.

Legacy violates the spec by overflowing the container by
width of border+padding.
NG implements spec behavior.

Bug:  919297 
Change-Id: I7839b94b2be86bbce30adeea6942ac5235ebacdc
Reviewed-on: https://chromium-review.googlesource.com/c/1414872
Commit-Queue: Aleks Totic <atotic@chromium.org>
Reviewed-by: Morten Stenshorne <mstensho@chromium.org>
Cr-Commit-Position: refs/heads/master@{#624928}
[modify] https://crrev.com/20defaa46c2c7581b85044d00dc7afa82eac6b18/third_party/blink/renderer/core/layout/ng/ng_length_utils.cc
[add] https://crrev.com/20defaa46c2c7581b85044d00dc7afa82eac6b18/third_party/blink/web_tests/external/wpt/css/css-position/position-absolute-replaced-minmax-expected.txt
[add] https://crrev.com/20defaa46c2c7581b85044d00dc7afa82eac6b18/third_party/blink/web_tests/external/wpt/css/css-position/position-absolute-replaced-minmax.html
[add] https://crrev.com/20defaa46c2c7581b85044d00dc7afa82eac6b18/third_party/blink/web_tests/flag-specific/enable-blink-features=LayoutNG/external/wpt/css/css-position/position-absolute-replaced-minmax-expected.txt

Comment 23 by atotic@chromium.org, Today (8 hours ago)

Status: Fixed (was: Started)

Sign in to add a comment