1749625 - Fix up and re-enable backdrop-filter

Status: RESOLVED FIXED

(Core :: Graphics: WebRender, task)

Comment 2

[projectfallback]

Given that this has been temporarily disabled, shouldn't @supports fail? e.g. @supports (backdrop-filter: blur(0))

Example use case below, where I'm seeing the transparent color activating without the blur

.c-menu {
    background-color: hsl(0, 0%, 20%);
}

@supports (backdrop-filter: blur(0)) {
    .c-menu {
        background-color: hsl(0, 0%, 20%, 0.5);
        backdrop-filter: blur(10px);
    }
}

Comment 4

[MortCodesWeb]

I have the same issue. it confused me at first making me think that the flags were off but theyre not.

I noticed it cuz i add alot of blur effects in webpages that i create in firefox

Comment 5

[rubenwardy]

The media query lying is absolutely a bug

Comment 7

[Archie Williams]

I hope this gets fixed soon. I use this feature extensively in my websites and being unable to preview what I am developing is a right pain.

Comment 8

[Glenn Watson [:gw]]

(In reply to Archie Williams from comment #7)

I hope this gets fixed soon. I use this feature extensively in my websites and being unable to preview what I am developing is a right pain.

I intend to begin work on it as soon as the blocking bug (https://bugzilla.mozilla.org/show_bug.cgi?id=1749380) is complete and landed.

Comment 9

[Archie Williams]

(In reply to Glenn Watson [:gw] from comment #8)

(In reply to Archie Williams from comment #7)

I hope this gets fixed soon. I use this feature extensively in my websites and being unable to preview what I am developing is a right pain.

I intend to begin work on it as soon as the blocking bug (https://bugzilla.mozilla.org/show_bug.cgi?id=1749380) is complete and landed.

Great to hear! Hope it all goes well

Comment 12

[maximtsyba]

Any updates on this?

Comment 13

[Glenn Watson [:gw]]

Yes - I'm working on it now. I have it mostly working now in WR, though the patches are a mess right now and the Gecko parts still need some work. I'm planning to start landing bits and pieces of it next week.

Comment 14

[maximtsyba]

Thanks, glad to hear!

Comment 15

[cc.glows]

Thanks for all your work Glenn!

I have a simple request (or hope?), it's that this mistake of backdrop-filter in Chromium is not replicated for launch in Firefox: https://monorail-prod.appspot.com/p/chromium/issues/detail?id=978031 (see https://twitter.com/atomiksdev/status/1471983428446785537)

This use case is super common in UIs and flickering navbars while scrolling pages is not pleasant to look at.

Another is the "bleeding" of the UI into the filter due to fractional values: https://bugs.chromium.org/p/chromium/issues/detail?id=1313579&q=backdrop-filter&can=2

Thank you!

Comment 16

[Glenn Watson [:gw]]

(In reply to cc.glows from comment #15)

Thanks for all your work Glenn!

I have a simple request (or hope?), it's that this mistake of backdrop-filter in Chromium is not replicated for launch in Firefox: https://monorail-prod.appspot.com/p/chromium/issues/detail?id=978031 (see https://twitter.com/atomiksdev/status/1471983428446785537)

This use case is super common in UIs and flickering navbars while scrolling pages is not pleasant to look at.

Another is the "bleeding" of the UI into the filter due to fractional values: https://bugs.chromium.org/p/chromium/issues/detail?id=1313579&q=backdrop-filter&can=2

Thank you!

Thanks for reporting those bug cases - they will be helpful. I'll take a look at them in detail later this week and (hopefully) make sure we handle them correctly already. I'm hoping to enable it in nightly next week, which will still give us about 2 weeks to fix any bugs or regressions before it gets to beta.

Comment 17

[Glenn Watson [:gw]]

Updated the last main patch in the series [1] with:

• Support running on native compositors which can't easily write back to the same native tile >1 time per frame. This incurs a slight performance penalty (an extra blit of the dirty rect size), but makes it usable for now. In future, we can improve the performance here with some additions to the compositor trait.
• Fix up an issue with blurs when only a one tile is invalidated but the backdrop-filter crosses multiple tiles.
• Added several new wrench tests to cover failures I encountered during try runs.
• Updated gecko expected test results.

There are two remaining issues that I'm aware of:

• An existing gecko bug where the image display items may have a local clip rect that incorrectly results in blur filters missing a few pixels.
• A render task dependency bug where border segments on backdrop-filters with blur chains sometimes don't draw.

In both cases, I think we can get this landed once it's reviewed next week and then work on those as follow ups, along with any other bugs or regressions that show up.

[1] https://phabricator.services.mozilla.com/D143334

Comment 18

[Glenn Watson [:gw]]

Fixed up the bug with border segments sometimes disappearing on backdrop-filter blur chains

Comment 19

[davidebriano]

Thanks for your work, Glenn!

If you had to make a prediction about when the backdrop-filter property will be enabled by default on FF, what would you estimate? 1-2 months?

Comment 20

[Glenn Watson [:gw]]

(In reply to davidebriano from comment #19)

Thanks for your work, Glenn!

If you had to make a prediction about when the backdrop-filter property will be enabled by default on FF, what would you estimate? 1-2 months?

That seems like a good estimate for when it should be available by default in release builds (it should be enabled by default in nightly within the next 1-2 weeks). There are a couple of known bug reports I need to investigate and fix, and (I'm sure) some number of unknown bugs that will be found.

If I can find and fix those within the next two weeks, we can try enable it on beta and then it would get to release in ~6 weeks. If we still have bugs after the next two weeks, it will be the following release, ~10 weeks from now.

Comment 21

[Archie Williams]

it seems to be enabled in the latest nightly release (yay!) but is extremely broken? on my device atleast, it's having a lot of visual artifacts on osekai.net, apple.com, hubza.co.uk, and really just any other site which uses backdrop filter. i'm hoping this is a known issue? https://imgur.com/a/tDqnRTe

Comment 22

[Archie Williams]

(In reply to Archie Williams from comment #21)

it seems to be enabled in the latest nightly release (yay!) but is extremely broken? on my device atleast, it's having a lot of visual artifacts on osekai.net, apple.com, hubza.co.uk, and really just any other site which uses backdrop filter. i'm hoping this is a known issue? https://imgur.com/a/tDqnRTe

oop, my bad, just saw the bug link right above my comment which seems to be about the same thing, sorry!

Comment 23

[Glenn Watson [:gw]]

(In reply to Archie Williams from comment #21)

it seems to be enabled in the latest nightly release (yay!) but is extremely broken? on my device atleast, it's having a lot of visual artifacts on osekai.net, apple.com, hubza.co.uk, and really just any other site which uses backdrop filter. i'm hoping this is a known issue? https://imgur.com/a/tDqnRTe

It should only be enabled if you've manually set layout.css.backdrop-filter.enabled to true as there's still a number of bugs to fix before enabling it by default, but yes, it's present in nightly. There is a Windows specific bug which will break it on most pages - https://bugzilla.mozilla.org/show_bug.cgi?id=1765684 has a fix for this one, which I'm hoping to land today.

Comment 24

[Archie Williams]

(In reply to Glenn Watson [:gw] from comment #23)

(In reply to Archie Williams from comment #21)

it seems to be enabled in the latest nightly release (yay!) but is extremely broken? on my device atleast, it's having a lot of visual artifacts on osekai.net, apple.com, hubza.co.uk, and really just any other site which uses backdrop filter. i'm hoping this is a known issue? https://imgur.com/a/tDqnRTe

It should only be enabled if you've manually set layout.css.backdrop-filter.enabled to true as there's still a number of bugs to fix before enabling it by default, but yes, it's present in nightly. There is a Windows specific bug which will break it on most pages - https://bugzilla.mozilla.org/show_bug.cgi?id=1765684 has a fix for this one, which I'm hoping to land today.

i probably still have it enabled from long ago when it used to be enabled! luckily i don't use nightly so it's not an issue for me, can't wait to see a more functioning version of it!

Comment 25

[Glenn Watson [:gw]]

Attachment: Bug 1749625 - Fix up and re-enable backdrop-filter

Comment 26

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/79f4180c783b
Fix up and re-enable backdrop-filter r=gfx-reviewers,lsalzman

Comment 27

[Cristian Tuns]

https://hg.mozilla.org/mozilla-central/rev/79f4180c783b