1859506 - incorrect operation of the filter property together with position: fixed

Status: UNCONFIRMED

(Core :: Graphics, defect)

Description

[nemoking1210]

Attachment: video.avi

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/116.0.5845.888 YaBrowser/23.9.2.888 Yowser/2.5 Safari/537.36

Steps to reproduce:

To reproduce the bug, you must: set filter: invert for the parent, specify the position: fixed property for the nested element.
<div class="parent" style="filter: invert(1); height: 4000px;">
<div class="child" style="position: fixed; left: 0; top: 0; height: 100vh; width: 400px; background-color: red;">
</div>
</div>

Actual results:

If the parent element has a filter property with any value, for example: invert, blur, etc., then the nested element with the position: fixed property will no longer be displayed correctly on the page, positioning relative to the user's screen stops working.

Expected results:

The filter property should not affect the positioning of the element, as it is responsible for graphic effects.

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

[Timothy Nikkel (:tnikkel)]

Chrome and Firefox seem to have the same behaviour on that testcase.

Comment 3

[Timothy Nikkel (:tnikkel)]

I'm not sure if this is incorrect behaviour by Firefox. It seems like this issue is probably in layout or web painting.