Bug 116146 - REGRESSION (r121296): Handling of background-size auto may lead to no background-image being displayed
Summary: REGRESSION (r121296): Handling of background-size auto may lead to no backgro...
Status: RESOLVED CONFIGURATION CHANGED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: Regression
Depends on:
Blocks:
 
Reported: 2013-05-15 04:29 PDT by Daniel Trebbien
Modified: 2022-06-17 07:23 PDT (History)
9 users (show)

See Also:


Attachments
Test case (913 bytes, text/html)
2013-05-15 04:29 PDT, Daniel Trebbien
no flags Details
Safari 15.5 matches other browsers (444.58 KB, image/png)
2022-06-17 04:24 PDT, Ahmad Saleem
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Daniel Trebbien 2013-05-15 04:29:51 PDT
Created attachment 201816 [details]
Test case

Attached is a test case. In Safari 6.0.4, Firefox 21.0, and Opera 12.15, all four boxes have a gradient background. In Chrome 26.0.1410.65, Chromium 29.0.1507.0 (199664), and WebKit r150098 built on 15 May 2013, the first two boxes have a gray background.

The problem is that the gradient image is 1x40 and because background-size is set to auto for the width (which causes the intrinsic ratio to be preserved along the width), the width is scaled to less than 1px logically in order to fit the height to 20px and 39px. Later versions of WebKit must be truncating the scaled width so that WebKit resolves the width to 0 and the background image is not displayed.

Alexey Proskuryakov determined that the change in behavior was introduced in r121296:  https://lists.webkit.org/pipermail/webkit-help/2013-May/003504.html

As mentioned in the commit message for r121296, the spec http://www.w3.org/TR/css3-background/#background-size says: "If the background image's width or height resolves to zero, this causes the image not to be displayed. (The effect is the same as if it had been a transparent image.)" This does not say, though, how dimensions are to be resolved if a dimension needs to be rounded.

If a dimension must be rounded, I think that it makes sense to truncate the value, but ensure that the truncated value is greater than or equal to 1 so that something is always displayed. My reasoning is that if I wanted not to display a background image, I could have set the background-size for one of the dimensions to 0. If WebKit has to err because of the inability to tile images of non-integral dimensions, I think that it should err on the side of displaying something rather than nothing.
Comment 1 Ahmad Saleem 2022-06-17 04:24:54 PDT
Created attachment 460294 [details]
Safari 15.5 matches other browsers

I am unable to reproduce this bug in Safari 15.5 on macOS 12.4 using attached test case and it matches all other browsers in behavior as well. Please refer to attached screenshots to see how other browsers (Chrome and Firefox) renders attached test case.

I think this got fixed along the lines and can be marked as "RESOLVED CONFIGURATION CHANGED". If I am testing incorrectly, please retest accordingly. Thanks!
Comment 2 zalan 2022-06-17 07:23:42 PDT
(In reply to Ahmad Saleem from comment #1)
> Created attachment 460294 [details]
> Safari 15.5 matches other browsers
> 
> I am unable to reproduce this bug in Safari 15.5 on macOS 12.4 using
> attached test case and it matches all other browsers in behavior as well.
> Please refer to attached screenshots to see how other browsers (Chrome and
> Firefox) renders attached test case.
> 
> I think this got fixed along the lines and can be marked as "RESOLVED
> CONFIGURATION CHANGED". If I am testing incorrectly, please retest
> accordingly. Thanks!
Thank you!