MicrosoftEdge
Some CSS styles can't be set using ExecuteScriptAsync?
Description
I can't seem to set any of the scrollbar CSS properties using ExecuteScriptAsync. This call works and sets the text colour to red:
await webview.ExecuteScriptAsync("document.body.style.color='#f00';");
But this call does nothing and no CSS styles are added to the body tag:
await webview.ExecuteScriptAsync("document.body.style.scrollbarFaceColor='#f00';");
These used to work with the old webview. My goal here is that our application has a light and a dark theme and if the user selects the dark theme we want to make the scrollbars dark in the WebView2 control as well.
Version SDK: 1.0.1210.39 Runtime: Public channel v101.0.1210.53 (Official build) (64-bit) Framework: .NET 6 Desktop OS: Windows 11
Repro Steps In the NavigationCompleted event handler just try using the 2 code examples above. The first one works and the second one does nothing.
Thanks for your help, keep up the great work!
Searching for scrollbarFaceColor on Bing, I'm seeing that the particular property you've used is a non-standard IE extension property and that probably is why your code no longer works on the new Chromium-based WebView2.
There appears to be another non-standard pseudo-element for WebKit based browsers though: https://developer.mozilla.org/en-US/docs/Web/CSS/::-webkit-scrollbar
You're right, thanks for the info! I also found CoreWebView2.Profile.PreferredColorScheme as well (I want to set the scrollbars to dark colours for a dark theme) but it doesn't seem to have any effect on the scrollbars. It changes the devtools window and the context menu to dark but not the scrollbars. Is it supposed to change the scrollbars or should I keep plugging away at overriding the colours manually? Thanks!
Hi, I have noted that PreferredColorScheme is not updating the WebView2 scrollbar color, we will look into this. In the meantime, please let us know if the webkit CSS property doesn't work for you as a workaround.
I can confirm that the -webkit-* CSS styles are working for customizing the scrollbar. Thanks for looking into the PreferredColorScheme issue too, very much appreciated! :)
-webkit-* CSS is great as a workaround, but can you let us know if you plan on actually fixing the scrollbar coloring from PreferredColorScheme?
