WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED FIXED
217476
[TextureMapper][GTK][WPE] backdrop filter rendering issues (leaking and inconsistent)
https://bugs.webkit.org/show_bug.cgi?id=217476
Summary
[TextureMapper][GTK][WPE] backdrop filter rendering issues (leaking and incon...
Haelwenn (lanodan) Monnier
Reported
2020-10-08 07:27:54 PDT
On <
https://hacktivis.me/tmp/webkit-backdrop-filter-header.xhtml
> (page that I created to show a bug that I noticed while tweaking a frontend) you have the box-shadow creating a blur, while this behaviour isn't the one you get in chromium or firefox. You can also notice that the text on the top edge is less blurred out as it becomes slightly legible. Which is also quite noticeable on <
https://webkit.org/demos/backdrop-filter/
> as I can distinguish the window on the houses while for the rest you can't even guess that they are houses. On <
https://misskey.io/@syuilo
> you can see that about 1/4 of the page is blurred out while it should only apply to under the navigation header.
Attachments
WebKitGTK wide viewport, incorrectly rendered
(606.25 KB, image/png)
2020-10-08 08:22 PDT
,
Adrian Perez
no flags
Details
WebKitGTK narrow viewport, correctly rendered
(212.26 KB, image/png)
2020-10-08 08:23 PDT
,
Adrian Perez
no flags
Details
WPE WebKit wide viewport, incorrectly rendered
(308.70 KB, image/png)
2020-10-08 08:23 PDT
,
Adrian Perez
no flags
Details
WPE WebKit narrow viewport, correctly rendered
(212.26 KB, image/png)
2020-10-08 08:24 PDT
,
Adrian Perez
no flags
Details
Chromium narrow viewport, correctly rendered
(430.67 KB, image/png)
2020-10-08 08:26 PDT
,
Adrian Perez
no flags
Details
Chromium, wide viewport, correctly rendered
(630.38 KB, image/png)
2020-10-08 08:26 PDT
,
Adrian Perez
no flags
Details
View All
Add attachment
proposed patch, testcase, etc.
Adrian Perez
Comment 1
2020-10-08 08:22:56 PDT
Created
attachment 410841
[details]
WebKitGTK wide viewport, incorrectly rendered
Adrian Perez
Comment 2
2020-10-08 08:23:13 PDT
Created
attachment 410842
[details]
WebKitGTK narrow viewport, correctly rendered
Adrian Perez
Comment 3
2020-10-08 08:23:52 PDT
Created
attachment 410843
[details]
WPE WebKit wide viewport, incorrectly rendered
Adrian Perez
Comment 4
2020-10-08 08:24:12 PDT
Created
attachment 410844
[details]
WPE WebKit narrow viewport, correctly rendered
Adrian Perez
Comment 5
2020-10-08 08:26:39 PDT
Created
attachment 410845
[details]
Chromium narrow viewport, correctly rendered
Adrian Perez
Comment 6
2020-10-08 08:26:55 PDT
Created
attachment 410846
[details]
Chromium, wide viewport, correctly rendered
Adrian Perez
Comment 7
2020-10-08 08:31:04 PDT
I have attached some screenshots which demonstrate the issue. It can be reproduced with WPE WebKit as well (which makes sense because it shares most of the code path for rendering filter effects), so I am adding the “[WPE]” tag. The problem can be reproduced in “trunk” as well, so I have removed the “[Stable]” tag. Interestingly, using a narrower viewport does not trigger the issue, so this might be related to some CSS rule being slightly different (through a media query) when the viewport is wider than a certain amount, and that is triggering the problem. Thanks for reporting this!
Adrian Perez
Comment 8
2020-10-08 08:34:46 PDT
(In reply to Haelwenn (lanodan) Monnier from
comment #0
)
> On <
https://hacktivis.me/tmp/webkit-backdrop-filter-header.xhtml
> (page that > I created to show a bug that I noticed while tweaking a frontend) you have > the box-shadow creating a blur, while this behaviour isn't the one you get > in chromium or firefox. You can also notice that the text on the top edge is > less blurred out as it becomes slightly legible.
This test case is good to demonstrate the issue, because it always triggers a wrong rendering, regardless of the width of the viewport. Thanks for sharing it :)
Fujii Hironori
Comment 9
2020-11-10 20:36:45 PST
I think there are two issues.
Bug 218785
– [TextureMapper] blur backdrop-filter makes box-shadow blurry
Bug 218645
– [TextureMapper] The edges of blur backdrop-filter look gradient tranparent
Fujii Hironori
Comment 10
2020-11-16 19:35:34 PST
Both issues were fixed.
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug