background-repeat: round does not preserve aspect ratio
Reported by
markus.s...@gmail.com,
May 16 2016
|
||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:49.0) Gecko/20100101 Firefox/49.0 Example URL: Steps to reproduce the problem: https://drafts.csswg.org/css-backgrounds-3/#the-background-size says: "If ‘background-repeat’ is ‘round’ for one dimension only and if ‘background-size’ is ‘auto’ for the other dimension, then there is a third step: that other dimension is scaled so that the original aspect ratio is restored." Safari supports this. I have not tested Edge. We are currently implementing this in Gecko. Steps to reproduce: 1. Open the attached testcase. 2. Count the number of horizontal repetitions of the background image. What is the expected behavior? The image should be repeated four times horizontally. What went wrong? The individual images are wider than they are high, and they are only repeated three times horizontally. The image size is 256x256, and the container is sized to 768x384. The background-repeat value is "repeat round". The height of the image is correctly set to 384/2 = 192. Since the background-size is left at the default "auto", the quoted section from the spec applies, and the *width* of the image should also be set to 192. Consequently, it should be repeated four times horizontally (768/192 = 4). Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? No Does this work in other browsers? Yes Chrome version: 52.0.2738.0 (Official Build) canary (64-bit) Channel: n/a OS Version: OS X 10.11 Flash Version: Shockwave Flash 21.0 r0
,
May 16 2016
,
May 17 2016
,
May 17 2016
,
May 17 2016
,
May 17 2016
markus.stange@ Thanks for the issue. Able to reproduce the issue on windows 7,Linux Ubuntu 14.04 and Mac 10.11.4 using chrome version 50.0.2661.102 and canary 52.0.2738.0.Observed the image height and width are not same. This is regression issue broken in M42.Please find the bisect information as below Narrow Bisect:: Good:42.0.2282.0 --- (official build 312179) Bad: 42.0.2285.0 -- (official build 312817) CHANGELOG URL: https://chromium.googlesource.com/chromium/src/+log/2189837d9abff9e19a206755791e1c5e7ef602ae..b63fc148c253d8096141d8ebadffae5fe98e598e Blink CL: https://chromium.googlesource.com/chromium/blink/+log/5843a38..372d1bd Possible suspect from the Blink CL https://chromium.googlesource.com/chromium/blink/+/372d1bd9cba66a42e14770de2a32e5d2d0398471 schenney@ could you please look into this issue if it is related to your change,else please help us in finding the appropriate owner for this issue. Thnaks,
,
May 17 2016
,
May 18 2016
I'll fix this. We probably always did this - I just changed the way we round things. Maybe we'll hit m52, but I'm removing the label as we shouldn't block release on it. We don't mark bugs as regressions if we changed the behavior more than a few releases ago. We can't revert earlier patches.
,
Jul 1 2016
,
Jul 7 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/60855ad5ed67add982bf86c34cb14b44e7b85b75 commit 60855ad5ed67add982bf86c34cb14b44e7b85b75 Author: schenney <schenney@chromium.org> Date: Thu Jul 07 14:09:48 2016 Fix aspect ratio for rounded background image size The previous calculation to maintain aspect size when one background image dimension is round and the other is auto was using the new tile size for the rounded dimension for the aspect ratio calculation, which is wrong. This change switches to using the original aspect ratio. New tests for both horizontal and vertical cases. R=fmalita@chromium.org BUG= 612278 Review-Url: https://codereview.chromium.org/2130523002 Cr-Commit-Position: refs/heads/master@{#404154} [modify] https://crrev.com/60855ad5ed67add982bf86c34cb14b44e7b85b75/third_party/WebKit/LayoutTests/TestExpectations [modify] https://crrev.com/60855ad5ed67add982bf86c34cb14b44e7b85b75/third_party/WebKit/LayoutTests/css3/background/background-repeat-round-auto1-expected.html [modify] https://crrev.com/60855ad5ed67add982bf86c34cb14b44e7b85b75/third_party/WebKit/LayoutTests/css3/background/background-repeat-round-auto2-expected.html [modify] https://crrev.com/60855ad5ed67add982bf86c34cb14b44e7b85b75/third_party/WebKit/LayoutTests/css3/masking/mask-repeat-round-auto1-expected.html [modify] https://crrev.com/60855ad5ed67add982bf86c34cb14b44e7b85b75/third_party/WebKit/LayoutTests/css3/masking/mask-repeat-round-auto2-expected.html [modify] https://crrev.com/60855ad5ed67add982bf86c34cb14b44e7b85b75/third_party/WebKit/LayoutTests/fast/backgrounds/background-repeat-with-background-color.html [modify] https://crrev.com/60855ad5ed67add982bf86c34cb14b44e7b85b75/third_party/WebKit/Source/core/paint/BackgroundImageGeometry.cpp
,
Jul 7 2016
,
Jul 12 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/daae6428267a56c5bfbbaddfd899af6fc23b0528 commit daae6428267a56c5bfbbaddfd899af6fc23b0528 Author: Rebaseline Bot <blink-rebaseline-bot@chromium.org> Date: Tue Jul 12 00:41:02 2016 Auto-rebaseline for r404154 https://chromium.googlesource.com/chromium/src/+/60855ad5e BUG= 612278 TBR=schenney@chromium.org Review URL: https://codereview.chromium.org/2132323003 . Cr-Commit-Position: refs/heads/master@{#404754} [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/TestExpectations [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/fast/backgrounds/background-repeat-with-background-color-expected.png [add] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/android/fast/backgrounds/background-repeat-with-background-color-expected.txt [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/linux/fast/backgrounds/background-repeat-with-background-color-expected.png [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/linux/fast/backgrounds/background-repeat-with-background-color-expected.txt [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/linux/ietestcenter/css3/bordersbackgrounds/background-size-aspect-ratio-expected.png [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/linux/svg/as-background-image/background-repeat-expected.png [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/mac-mac10.9/ietestcenter/css3/bordersbackgrounds/background-size-aspect-ratio-expected.png [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/mac/fast/backgrounds/background-repeat-with-background-color-expected.txt [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/mac/ietestcenter/css3/bordersbackgrounds/background-size-aspect-ratio-expected.png [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/win/fast/backgrounds/background-repeat-with-background-color-expected.txt [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/platform/win/ietestcenter/css3/bordersbackgrounds/background-size-aspect-ratio-expected.png [modify] https://crrev.com/daae6428267a56c5bfbbaddfd899af6fc23b0528/third_party/WebKit/LayoutTests/svg/as-background-image/background-repeat-expected.png |
||||||||||
►
Sign in to add a comment |
||||||||||
Comment 1 by markus.s...@gmail.com
, May 16 20162.3 KB
2.3 KB View Download