The GTK port misses support for CSS backdrop filters. This was implemented in bug 138384 for Mac/iOS. More info: https://webkit.org/blog/3632/introducing-backdrop-filters/
Status of support for the feature in other browsers: http://caniuse.com/#feat=css-backdrop-filter
On the surface it looks like the feature could be enabled by adding the following in “PlatformGTK.cmake”: WEBKIT_OPTION_DEFAULT_PORT_VALUE(ENABLE_FILTERS_LEVEL_2 PRIVATE ON) but this alone is not enough for backdrop-filter to work. After looking at how this was implemented in Cocoa, I think the crux of the matter is that we have somehow to render normally the content that falls behind the element to which backdrop filters are applied, so then the result can be used to apply them. Cocoa seems to do this using CoreAnimation, so with my (extremely) limited knowledge of the graphics stack, we would need to implement the needed bits in the texture mapper, right?
Would be nice to support this at some point. results.webkit.org relies on this feature.
Created attachment 405139 [details] Patch There are still a few tests failing (some of them due to other bugs like -webkit-box-reflect not working on compositing), but the examples I've been trying are all working (https://webkit.org/demos/backdrop-filter and https://results.webkit.org).
Comment on attachment 405139 [details] Patch Wow, this is quite a neat patch overall, somehow before starting reading it I thought it would end up being much more complicated 💪️ I made just one comment below about the isFilterProperty lambda. View in context: https://bugs.webkit.org/attachment.cgi?id=405139&action=review > Source/WebCore/platform/graphics/texmap/coordinated/CoordinatedGraphicsLayer.cpp:1358 > + auto isFilterProperty = [&]() -> bool { The lambda here only uses “valueList.property()” so I would only capture that explicitly auto isFilterProperty = [property = valueList.property()]() -> bool { /* ... */ }; Though, honestly I do not see the need to use a lambda here, as it is used only once immediately and it calculates a simple value. Why not calculate the value directly? One possible way: bool isFilterProperty; switch (valueList.property()) { #if ENABLE(FILTERS_LEVEL_2) case AnimatedPropertyWebkitBackdropFilter: #endif case AnimatedPropertyFilter: isFilterProperty = true; break; default: isFilterProperty = false; } if (isFilterProperty) { /* ... */ }
(In reply to Adrian Perez from comment #5) > Comment on attachment 405139 [details] > Patch > > Wow, this is quite a neat patch overall, somehow before starting reading > it I thought it would end up being much more complicated 💪️ > > I made just one comment below about the isFilterProperty lambda. > > View in context: > https://bugs.webkit.org/attachment.cgi?id=405139&action=review > > > Source/WebCore/platform/graphics/texmap/coordinated/CoordinatedGraphicsLayer.cpp:1358 > > + auto isFilterProperty = [&]() -> bool { > > The lambda here only uses “valueList.property()” so I would only capture > that explicitly > > auto isFilterProperty = [property = valueList.property()]() -> bool { /* > ... */ }; > > Though, honestly I do not see the need to use a lambda here, as it is used > only once immediately and it calculates a simple value. Why not calculate > the value directly? One possible way: > > bool isFilterProperty; > switch (valueList.property()) { > #if ENABLE(FILTERS_LEVEL_2) > case AnimatedPropertyWebkitBackdropFilter: > #endif > case AnimatedPropertyFilter: > isFilterProperty = true; > break; > default: > isFilterProperty = false; > } > > if (isFilterProperty) { > /* ... */ > } Ended up adding the lambda because with the if and the #ifdef it looked bad and the style checker always complained. The switch is a good idea and then we don't even need the isFilterProperty variable, I think.
Committed r264968: <https://trac.webkit.org/changeset/264968>
<rdar://problem/66207065>