2011747 - content with 'backdrop-filter' fails to render if ancestor has a 'drop-shadow' or 'blur' filter applied

Status: RESOLVED FIXED

(Core :: Graphics: WebRender, defect)

Description

[Daniel Holbert [:dholbert]]

Attachment: testcase 1 (pairwise comparisons of various 'filter' and 'backdrop-filter' values)

STR:

1. Load attached testcase.

EXPECTED RESULTS:
Every piece of the testcase should show the word "Hi" and two overlapping boxes.

ACTUAL RESULTS:
The last two rows (the rows with filter: drop-shadow(...) and filter: blur(...) respectively) only show the orange outer-box (except for their very first column which is where the child doesn't have any backdrop-filter applied).

This is the root cause of webcompat bug 2004730.

Comment 1

[Daniel Holbert [:dholbert]]

The testcase here is just doing pairwise comparisons of filter on an outer element with backdrop-filter on an inner element, with each of those properties set to:

• no value at all
• grayscale(...)
• invert(...)
• drop-shadow(...)
• blur(...)

drop-shadow and blur in particular (for filter on the outer element) cause trouble here, when backdrop-filter is set to anything at all on the inner element.

Comment 2

[Daniel Holbert [:dholbert]]

tl;dr this may have been a case that was missed in bug 1769682, "Add support for filters on backdrop-filter elements".

Here a bit of a more detailed history (running with "layout.css.backdrop-filter.enabled:true" and "layout.css.backdrop-filter.force-enabled:true"):

(1) When Bug 1764005 landed ("Add backdrop-filter primitive support"), that's when backdrop-filter starts doing anything at all, on my machine; and it's when the last two rows here start rendering the same way that they do in current Nightly (with the backdrop-filter content missing entirely). However, builds from that point also render the second and third row in a differently-broken way, with the backdrop-filter's parent missing entirely.

(2) When bug Bug 1766710 landed ("Temporarily disable backdrop-filter again"), backdrop-filter unsurprisingly stops doing anything (we disabled it by commenting out the relevant bit of code, not via a pref-flip)

(3) While it was disabled, we landed bug 1769682 ( "Add support for filters on backdrop-filter elements"), which I suspect is what fixed the second and third row (though I can't test that directly). And/or bug 1769855 ("Fix backdrop-filter with stacking context isolation") might have made a difference here too.

(4) Then we reenabled backdrop-filters in bug 1749625 comment 26, making them testable again. From that point onwards (i.e. Nightly 2022-05-18 and newer), the rendering matches current Nightly (with the last two rows missing the content that has backdrop-filter applied).

Comment 3

[Daniel Holbert [:dholbert]]

glenn, maybe you could take a look if/when you've got cycles? This is impacting a pretty high-scoring WebCompat site-report bug.

Comment 4

[Daniel Holbert [:dholbert]]

Attachment: testcase 2 (just one of the broken cases, 'blur' / 'grayscale')

Comment 5

[Glenn Watson [:gw]]

Unlikely to have any time in the next couple weeks, but will take bug to look at some point.

Comment 6

[Daniel Holbert [:dholbert]]

Thanks! longsonr noticed that ahale has done some work on WR backdrop-filter as well, so CC'ing Ashley as well.

Comment 7

[Daniel Holbert [:dholbert]]

Attachment: screenshot of bug

Here's a screenshot of the bug (for me on Ubuntu 25.04, Nightly 149.0a1 (2026-01-16) (64-bit)), just to remove ambiguity in case there's any OS/hardware-dependency here (not sure if there is any, but you never know)

Comment 8

[BugBot [:suhaib / :marco]]

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

For more information, please visit BugBot documentation.

Comment 9

[Ashley Hale [:ahale]]

While I haven't worked on backdrop-filter, I did implement the whole WRSVGFE code path (controlled by gfx.webrender.svg-filter-effects.* prefs) so I am a bit familiar with the points of code path diversion, this is probably related to Bug 1975275 as well.

Comment 10

[Glenn Watson [:gw]]

Attachment: Bug 2011747 - Order backdrop-filter sub-graph content before the tasks that sample it

When a backdrop-filter sub-graph is popped, pop_surface adds a replacement
picture task that draws the content following the capture into the parent
surface's texture. For a chained parent (a CSS blur, drop-shadow or SVG filter)
only the chain root was made to depend on that task, but the tasks that sample
the texture are at the start of the chain, not the output end. Pass assignment
could therefore schedule the blur to read the texture before the replacement
task had drawn into it, and since nothing else samples that texture the content
was dropped entirely - a child with any backdrop-filter disappeared under an
ancestor blur.

Make every task in the chain that samples the old parent task depend on the
replacement task as well.

Comment 12

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/865c925ec742
https://hg.mozilla.org/integration/autoland/rev/4a03614ba69d
Order backdrop-filter sub-graph content before the tasks that sample it r=gfx-reviewers,nical

Comment 13

[Norisz Fay [:noriszfay]]

https://hg.mozilla.org/mozilla-central/rev/4a03614ba69d

Comment 14

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/905b38110188
https://hg.mozilla.org/releases/mozilla-release/rev/1ef570518eb2
Revert "Bug 2011747 - Order backdrop-filter sub-graph content before the tasks that sample it r=gfx-reviewers,nical" for causing browser freezes.

Comment 15

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/e52e37b73ba1
https://hg.mozilla.org/releases/mozilla-beta/rev/acfdc839c920
Revert "Bug 2011747 - Order backdrop-filter sub-graph content before the tasks that sample it r=gfx-reviewers,nical" for causing browser freezes.

Comment 16

[Ryan VanderMeulen [:RyanVM]]

This was reverted from Beta for 156.0b3 and Release for 155.0.1 due to the browser freeze regression bugs it caused.