Bug 275819 - [GTK] `backdrop-filter` is applied incorrectly when element has sibling
Summary: [GTK] `backdrop-filter` is applied incorrectly when element has sibling
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: WebKitGTK (show other bugs)
Version: Other
Hardware: PC Linux
: P2 Normal
Assignee: Nobody
URL:
Keywords: Gtk
Depends on:
Blocks:
 
Reported: 2024-06-24 11:14 PDT by R. N. West
Modified: 2024-06-29 05:23 PDT (History)
1 user (show)

See Also:


Attachments
Test case reduction (959 bytes, text/html)
2024-06-24 11:14 PDT, R. N. West
no flags Details
Test case rendered by WebKit (142.15 KB, image/png)
2024-06-24 11:15 PDT, R. N. West
no flags Details
Test case rendered by Firefox and Chromium (121.40 KB, image/png)
2024-06-24 11:16 PDT, R. N. West
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description R. N. West 2024-06-24 11:14:18 PDT
Created attachment 471731 [details]
Test case reduction

See the attached test case. When the header element has only one child with a backdrop-filter applied to it, everything works fine. When the header element has two children, with the backdrop-filter applied to the younger child (which comes first in the stacking order), the resulting backdrop seems to include the older child as well. This can be seen by the light text shadow (caused by the blur and the color inversion), which should not be there. The test case is rendered correctly by Firefox and Chromium (without the light text shadow).

WebKit version: WebKitGTK 2.44.2 (Epiphany Browser on Linux)
Comment 1 R. N. West 2024-06-24 11:15:27 PDT
Created attachment 471732 [details]
Test case rendered by WebKit
Comment 2 R. N. West 2024-06-24 11:16:46 PDT
Created attachment 471733 [details]
Test case rendered by Firefox and Chromium
Comment 3 Alexey Proskuryakov 2024-06-24 15:19:48 PDT
This doesn't appear to reproduce in Safari, so seems Gtk-only.
Comment 4 R. N. West 2024-06-29 04:35:04 PDT
Thanks for testing this! I updated the report accordingly.