Windows option WebviewIsTransparent has undesired effects on backdrop-filter blur CSS rule

[brody192]

Description

The underlying text is visible through an element with the backdrop-filter blur rule applied. there is a blur but the text shouldn't show through too. this is only an issue with WebviewIsTransparent being set to true.

Image of issue

To Reproduce

demo.zip

reproducible code

Expected behaviour

what the blur filter should look like

now the backdrop-filter works but the background is a solid color but the mica theme doesn't show through

Screenshots

No response

Attempted Fixes

I have tried other types of blur filters but none of them work and wouldn't archive what I wanted anyway

System Details

# System

OS           | Windows 10 Pro
Version      | 2009 (Build: 22621)
ID           | 22H2
Go Version   | go1.19.4
Platform     | windows
Architecture | amd64

# Wails

Version | v2.3.1

# Dependencies

Dependency | Package Name | Status    | Version
WebView2   | N/A          | Installed | 109.0.1518.70
npm        | N/A          | Installed | 8.19.2
*upx       | N/A          | Installed | upx 3.96
*nsis      | N/A          | Available |

Additional context

No response

[lennybakkalian]

This bug also occurs when WindowIsTranslucent is set to true.

[lennybakkalian]

looks like this bug also exists in electron when the body (or element behind it) has no background(color) (in combination with transparency / translucent). https://github.com/electron/electron/issues/19765

[laeo]

Any updates on this? I also have this issue, the blur has worked, but when i dragging the window, blur could not working for few frames.

[laeo]

I would like to tell you guys, after add the css style below, the blur effect seems working properly.

* {
    will-change: auto;
}

[brody192]

I would like to tell you guys, after add the css style below, the blur effect seems working properly.

* {
    will-change: auto;
}

Unfortunately, that doesn't seem to change anything after adding that to the demo code

[ZakaryFofana]

Any update, I'm using electron 25 and it still doesn't work.

[xolyn]

any update rn?