Open Bug 1887572 Opened 3 months ago Updated 1 month ago

An inset box-shadow appears faintly outside element's border with radius

Categories

(Core :: Graphics: WebRender, defect, P3)

Firefox 124
defect

Tracking

()

UNCONFIRMED

People

(Reporter: chriskirknielsen, Unassigned)

Details

Attachments

(1 file)

Attached image boxshadow.jpg

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:124.0) Gecko/20100101 Firefox/124.0

Steps to reproduce:

  1. Create an element with a border (2px solid black), border-radius (100px), and inset box-shadow (inset 0 0 4px yellow).
  2. Zoom in to exaggerate the effect.

DEMO: https://codepen.io/chriskirknielsen/pen/OJGgPxK
The attached screenshot should make it easier to notice if you cannot see this on your own screen.

Actual results:

A very faint amount of box-shadow is peeking past the border, "outside" of the element. I suspect sub-pixel rendering might be at play, especially given I am on a MacBook with a Retina screen, which might make this more obvious.

Expected results:

The inset box-shadow should remain "clipped" to the inside of the element and not show outside of the element's borders.

The Bugbug bot thinks this bug should belong to the 'Core::Layout' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

Component: Untriaged → Layout
Product: Firefox → Core

Yes, I can see this (faintly) with the codepen example. Interestingly, if I change the color scheme to have a light background and dark shadow instead, I no longer see any trace of the shadow outside the element. So it feels like this may be related specifically to compositing the light shadow against the dark background.

I think this is a painting artifact rather than a layout error, so more of a Graphics than Layout issue.

Component: Layout → Graphics

The severity field is not set for this bug.
:bhood, could you have a look please?

For more information, please visit BugBot documentation.

Flags: needinfo?(bhood)
Severity: -- → S3
Component: Graphics → Graphics: WebRender
Flags: needinfo?(bhood)
Priority: -- → P3
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: