New issue
Advanced search Search tips

Issue 899342 link

Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Closed: Nov 16
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Windows
Pri: 2
Type: Bug



Sign in to add a comment

box-shadow differs on <body> with background vs without

Reported by leeon...@gmail.com, Oct 26

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:65.0) Gecko/20100101 Firefox/65.0

Steps to reproduce the problem:
See attached file or https://codepen.io/anon/pen/MPLPGW

What is the expected behavior?
box shadow rendering is consistent with other html elements, regardless of explicit background

What went wrong?
box-shadow on <body> is several pixels wider with background than without

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 70.0.3538.77  Channel: stable
OS Version: 10.0
Flash Version:
 
body-box-shadow-chrome-bug.html
698 bytes View Download
Bisected to 684bc59f2853cb2b182cd8087280f3d7042a70c1
"Remove CTM-dependent paintBoxShadow() heuristic"
Landed in 44.0.2386.0 via r327368.
Components: -Blink>CSS Blink>Paint
Owner: fmalita@chromium.org
Status: Assigned (was: Unconfirmed)
Any idea when this might get fixed?

Bootstrap sets a default #fff background color on <body> [1], so I imagine this issue is not a super isolated edge case. I filed an issue for this, but it looks like they intend to keep this in the framework [2].

thanks!

[1] https://github.com/twbs/bootstrap/blob/38e9e2b82cc023ab25a13395885719c17cb10b19/scss/_reboot.scss#L64

[2] https://github.com/twbs/bootstrap/issues/27535
Cc: schenney@chromium.org
Status: Started (was: Assigned)
Yeah, I see what's going on - we rely on the background overdrawing the inset shadow, but in the case of <body> the background fill is transferred to the view and painted in a different context.

FWIW, this was problematic before my change also, but harder to trigger - it required a transform w/ rotation.

Should not be hard to avoid, on it.
Project Member

Comment 5 by bugdroid1@chromium.org, Nov 16

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

commit ef097e0420ba201ee6e31c52481551594c50b655
Author: Florin Malita <fmalita@chromium.org>
Date: Fri Nov 16 23:05:47 2018

Fix box-shadow clipping for opaque-background <body>

In the presence of an opaque background,
BoxPainterBase::PaintNormalBoxShadow() insets the shadow clip by one
unit (in order to mitigate seaming artifacs), effectively expanding the
shadow inwards, and relies on the opaque background overdrawing this
inset.

But <body> doesn't paint its own background -- it gets transferred to
the view and painted in a different context => the shadow inset remains
visible.

To address this, pass background-skip information to
PaintNormalBoxShadow(), and disable the inset logic when the background
is not being drawn.

Bug:  899342 
Change-Id: I5e04a1c17c2be324bf4c6767d2159372f546cc24
Reviewed-on: https://chromium-review.googlesource.com/c/1336495
Commit-Queue: Florin Malita <fmalita@chromium.org>
Reviewed-by: Fredrik Söderquist <fs@opera.com>
Cr-Commit-Position: refs/heads/master@{#609014}
[add] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/WebKit/LayoutTests/external/wpt/css/css-backgrounds/box-shadow-body.html
[add] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/WebKit/LayoutTests/external/wpt/css/css-backgrounds/reference/box-shadow-body-ref.html
[modify] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/WebKit/LayoutTests/fast/table/row-box-shadow-expected.png
[modify] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/WebKit/LayoutTests/fast/table/section-box-shadow-expected.png
[modify] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/WebKit/LayoutTests/fast/table/self-painting-row-box-shadow-expected.png
[modify] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/WebKit/LayoutTests/paint/background/fieldset-legend-background-shadow-border-radius-expected.png
[modify] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/blink/renderer/core/paint/box_painter.cc
[modify] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/blink/renderer/core/paint/box_painter_base.cc
[modify] https://crrev.com/ef097e0420ba201ee6e31c52481551594c50b655/third_party/blink/renderer/core/paint/box_painter_base.h

Status: Fixed (was: Started)

Sign in to add a comment