1714484 - Drop-shadow on parent div affects text in children when width of parent div plus width of drop-shadow is greater than screen width

Status: UNCONFIRMED

(Core :: Graphics: WebRender, defect)

Description

[Savvy Raghuvanshi]

Attachment: TailwindPlay FF Bug Report.png

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:90.0) Gecko/20100101 Firefox/90.0

Steps to reproduce:

Go to the following link: https://play.tailwindcss.com/zHSGmJnwdo

The code body of this playground link is exactly that of the default play.tailwindcss.com code, except there is a filter drop-shadow-md added on line 12.

Resize the preview pane (right-hand side) to a width of between 655-ish and 715 (exact) pixels (the width shows up in the top right of the preview pane when you resize). At 716 pixels or higher, the text is clear. However, in the [655, 715] range the text is blurry, as if the drop-shadow effect were erroneously being applied to the text as well.

Actual results:

You'll note that the text is blurry in that width range, since it appears that the drop-shadow is also being applied to the text inside the div. However, when wider than 715 pixels the text is crystal-clear (as expected).

I observed this bug on both Firefox Developer Editions 89 and 90 on Windows 10.

Expected results:

If you repeat this experiment on MS Edge, for instance, the text is clear (i.e. no drop shadow shows up on the text) at all preview pane widths. This is the expected behavior.

I was going to file a TailwindCSS bug, but since the correct behavior appears on MS Edge I suspect this is actually a bug in Firefox.

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Core::Audio/Video: Playback' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Comment 2

[Savvy Raghuvanshi]

@bugbot that didn’t look right, so I took a guess for a better category.

Comment 3

[Emilio Cobos Álvarez (:emilio)]

I couldn't reproduce this, but graphics is a better component for this. Can you repro this on Nightly Savvy?

Comment 4

[Savvy Raghuvanshi]

I'm not able to reproduce this using 91.0b9 on macos anymore, but it'll be a while before I can test this on Windows again. I will update back here once I can try it.