1824496 - Parent with "filter: grayscale" breaks appearance of child with "backdrop-filter: blur"

Status: UNCONFIRMED

(Core :: Graphics: WebRender, defect)

Description

[anaarkei]

Attachment: Side by side comparison of "backdrop-filter: blur" with "filter: grayscale" disabled (left) and enabled (right)

Steps to reproduce:

Applying "filter: grayscale" to the parent of a child with "backdrop-filter: blur".

Actual results:

Causes the blur effect to break (see attached example).

Expected results:

Blur appearance should remain the same, only colour should change. Tested same CSS in other browsers (Safari and Chrome) and got the result that was expected.

Comment 1

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

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

Comment 2

[Mayank Bansal]

Can you attach a reduced testcase that reproduces this issue?

Comment 3

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

Redirect a needinfo that is pending on an inactive user to the triage owner.
:gw, since the bug has recent activity, could you have a look please?

For more information, please visit BugBot documentation.