New issue
Advanced search Search tips

Issue 855882 link

Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Closed: Dec 15
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Mac
Pri: 2
Type: Bug



Sign in to add a comment

Background cover with SVG image-as-background doesn't always cover

Reported by bamigore...@gmail.com, Jun 23 2018

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.87 Safari/537.36

Steps to reproduce the problem:
1. Check this URL: https://plnkr.co/edit/9RlpdCCO5GaKZ7A6GQ17?p=preview
2. Resize the window some times and check the strange border at bottom of header.

What is the expected behavior?
I expect that the browser dont try to find a way to show half pixels. All the other browsers dont do it to. My plunker work fine in other browsers.

What went wrong?
Check my Screenshot

Did this work before? No 

Does this work in other browsers? N/A

Chrome version: 67.0.3396.87  Channel: stable
OS Version: 10.0
Flash Version: 

I know this "bug" sience years. maybe time to fix it :)
 
Screenshot_2.png
29.8 KB View Download
Labels: Needs-Triage-M67
Components: Blink>Paint
Labels: Triaged-ET M-69 Target-69 FoundIn-69 OS-Linux OS-Mac
Status: Untriaged (was: Unconfirmed)
Able to reproduce the issue on chrome reported version 67.0.3396.87 and on latest chrome 69.0.3396.3 using Mac 10.13.1, Ubuntu 17.10 and Windows-10 with URL mentioned in comment# 0. As this issue is seen from M-60(60.0.3112.0), hence considering this issue as Non-Regression and marking it as Untriaged.

Thanks!
Because of this bug I have not used certain techniques for years. So me and some co-workers hampered this bug already massively at work. But if you think it is unimportant ... O.K. ;)
Owner: schenney@chromium.org
Status: Assigned (was: Untriaged)
I will try to figure out what's happening here.
Thanks alot @schenney
Labels: -M-69 -Target-69 Target-70 M-70
If you set the background on the ::after to be contain instead of cover the problem goes away but everything looks the same (although I know that's not guaranteed).

So this does seem to be yet another background sizing problem. Odd though.
cr855882.html
186 KB View Download
Summary: Background cover doesn't always cover (was: Elements get half pixel margins after resizing window)
Status: Started (was: Assigned)
Summary: Background cover for SVG image doesn't always cover (was: Background cover doesn't always cover)
Summary: Background cover with SVG image-as-background doesn't always cover (was: Background cover for SVG image doesn't always cover)
Project Member

Comment 10 by bugdroid1@chromium.org, Dec 12

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

commit aed99d7e12bd036ab3ebb4fe522ce8faf347a32f
Author: Stephen Chenney <schenney@chromium.org>
Date: Wed Dec 12 02:53:56 2018

Fix SVG-As-Background sizing

Addresses a TODO where we were snapping the intrinsic size of an SVG image,
even when that is no longer useful. This was posing issues with operations
using aspect ratio, because the computed aspect ratio on the snapped value
was wrong when then used on un-snapped values.

R=fs@opera.com
BUG= 855882 

Change-Id: I0c14c0109da4c5ca5e52aebf408e9b702eda799c
Reviewed-on: https://chromium-review.googlesource.com/c/1370486
Commit-Queue: Stephen Chenney <schenney@chromium.org>
Reviewed-by: Fredrik Söderquist <fs@opera.com>
Cr-Commit-Position: refs/heads/master@{#615798}
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/renderer/core/style/style_image.cc
[add] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/background-size-cover-svg.html
[add] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/reference/background-size-cover-svg-ref.html
[add] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/support/rectangle-2560x208.svg
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/fast/backgrounds/size/contain-and-cover-zoomed-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/linux/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/linux/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/linux/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/linux/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/linux/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/mac/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/mac/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/mac/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/mac/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/mac/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/mac/svg/zoom/page/zoom-background-images-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/win/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/win/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/win/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/win/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/win/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/win/svg/zoom/page/zoom-background-images-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/platform/win7/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/aed99d7e12bd036ab3ebb4fe522ce8faf347a32f/third_party/blink/web_tests/svg/zoom/page/zoom-svg-as-background-with-relative-size-expected.png

Project Member

Comment 11 by bugdroid1@chromium.org, Dec 12

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

commit a7cca76254697b10c20b48401ff332b9991b9cc7
Author: Shuotao Gao <stgao@chromium.org>
Date: Wed Dec 12 08:29:04 2018

Revert "Fix SVG-As-Background sizing"

This reverts commit aed99d7e12bd036ab3ebb4fe522ce8faf347a32f.

Reason for revert: Speculative revert for the compile failure on Android and ChromeOS, because this CL is the single CL that shows up in the blamelist of both failed builds.

https://ci.chromium.org/p/chromium/builders/luci.chromium.ci/android-rel/5507
https://ci.chromium.org/buildbot/chromium.chrome/Google%20Chrome%20ChromeOS/59554

Original change's description:
> Fix SVG-As-Background sizing
> 
> Addresses a TODO where we were snapping the intrinsic size of an SVG image,
> even when that is no longer useful. This was posing issues with operations
> using aspect ratio, because the computed aspect ratio on the snapped value
> was wrong when then used on un-snapped values.
> 
> R=​fs@opera.com
> BUG= 855882 
> 
> Change-Id: I0c14c0109da4c5ca5e52aebf408e9b702eda799c
> Reviewed-on: https://chromium-review.googlesource.com/c/1370486
> Commit-Queue: Stephen Chenney <schenney@chromium.org>
> Reviewed-by: Fredrik Söderquist <fs@opera.com>
> Cr-Commit-Position: refs/heads/master@{#615798}

TBR=fs@opera.com,schenney@chromium.org

Change-Id: I6bd43ac3ad23393be353249657566e9080cd69c0
No-Presubmit: true
No-Tree-Checks: true
No-Try: true
Bug:  855882 
Reviewed-on: https://chromium-review.googlesource.com/c/1373285
Reviewed-by: Shuotao Gao <stgao@chromium.org>
Commit-Queue: Shuotao Gao <stgao@chromium.org>
Cr-Commit-Position: refs/heads/master@{#615831}
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/renderer/core/style/style_image.cc
[delete] https://crrev.com/0874a6de059391b1a39d3889ea6381e29bbe441f/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/background-size-cover-svg.html
[delete] https://crrev.com/0874a6de059391b1a39d3889ea6381e29bbe441f/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/reference/background-size-cover-svg-ref.html
[delete] https://crrev.com/0874a6de059391b1a39d3889ea6381e29bbe441f/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/support/rectangle-2560x208.svg
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/fast/backgrounds/size/contain-and-cover-zoomed-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/linux/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/linux/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/linux/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/linux/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/linux/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/mac/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/mac/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/mac/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/mac/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/mac/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/mac/svg/zoom/page/zoom-background-images-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/win/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/win/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/win/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/win/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/win/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/win/svg/zoom/page/zoom-background-images-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/platform/win7/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/a7cca76254697b10c20b48401ff332b9991b9cc7/third_party/blink/web_tests/svg/zoom/page/zoom-svg-as-background-with-relative-size-expected.png

Project Member

Comment 12 by bugdroid1@chromium.org, Dec 12

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

commit 6e2a70e45903307f9e938a8a2f6e08a93b337384
Author: Stephen Chenney <schenney@chromium.org>
Date: Wed Dec 12 10:09:44 2018

Reland "Fix SVG-As-Background sizing"

This is a reland of aed99d7e12bd036ab3ebb4fe522ce8faf347a32f
It was reverted in https://chromium-review.googlesource.com/c/chromium/src/+/1373285
But the real culprit is a recipe change which is being reverted in https://chromium-review.googlesource.com/c/chromium/tools/build/+/1373509

Original change's description:
> Fix SVG-As-Background sizing
>
> Addresses a TODO where we were snapping the intrinsic size of an SVG image,
> even when that is no longer useful. This was posing issues with operations
> using aspect ratio, because the computed aspect ratio on the snapped value
> was wrong when then used on un-snapped values.
>
> R=fs@opera.com
> BUG= 855882 
>
> Change-Id: I0c14c0109da4c5ca5e52aebf408e9b702eda799c
> Reviewed-on: https://chromium-review.googlesource.com/c/1370486
> Commit-Queue: Stephen Chenney <schenney@chromium.org>
> Reviewed-by: Fredrik Söderquist <fs@opera.com>
> Cr-Commit-Position: refs/heads/master@{#615798}

Bug:  855882 
Change-Id: Icdd1ad0af2aaae6f633b8940522115e9742d1d7f
Reviewed-on: https://chromium-review.googlesource.com/c/1373286
Reviewed-by: Shuotao Gao <stgao@chromium.org>
Reviewed-by: Fredrik Söderquist <fs@opera.com>
Commit-Queue: Fredrik Söderquist <fs@opera.com>
Cr-Commit-Position: refs/heads/master@{#615840}
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/renderer/core/style/style_image.cc
[add] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/background-size-cover-svg.html
[add] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/reference/background-size-cover-svg-ref.html
[add] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/external/wpt/css/css-backgrounds/background-size/support/rectangle-2560x208.svg
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/fast/backgrounds/size/contain-and-cover-zoomed-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/linux/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/linux/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/linux/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/linux/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/linux/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/mac/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/mac/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/mac/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/mac/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/mac/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/mac/svg/zoom/page/zoom-background-images-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/win/css2.1/20110323/background-intrinsic-004-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/win/css2.1/20110323/background-intrinsic-005-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/win/svg/as-background-image/background-image-preserveaspectRatio-support-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/win/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/win/svg/wicd/test-scalable-background-image1-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/win/svg/zoom/page/zoom-background-images-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/platform/win7/svg/as-background-image/svg-as-background-5-expected.png
[modify] https://crrev.com/6e2a70e45903307f9e938a8a2f6e08a93b337384/third_party/blink/web_tests/svg/zoom/page/zoom-svg-as-background-with-relative-size-expected.png

Labels: Merge-Request-72
Verified in Canary 73.0.3639.0. This is a simple, safe fix. Requesting M-72 merge.
Project Member

Comment 14 by sheriffbot@chromium.org, Dec 13

Labels: -Merge-Request-72 Merge-Review-72 Hotlist-Merge-Review
This bug requires manual review: Reverts referenced in bugdroid comments after merge request.
Please contact the milestone owner if you have questions.
Owners: govind@(Android), kariahda@(iOS), djmm@(ChromeOS), abdulsyed@(Desktop)

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Note that the reverts were speculative and the patch was immediately re-landed.
schenney@ this issue has been open for a while , What is the criticality of the fix to go in M72? Can this wait until M73?
Labels: -Hotlist-Merge-Review -Merge-Review-72 Merge-Rejected-72
Status: Fixed (was: Started)
It isn't super critical, but then the fix is super simple. Given this only fixed one reported bug, I think it can wait.

Sign in to add a comment