[Bug] WebBrowserComponent WebView2 backend ignores DPI change

Hi all,

there is a problem with the WebView2 backend of the WebBrowserComponent:
Having an instance of it shown within a window on a screen with DPI scaling A (e.g. 125%), when moving the window to a screen with DPI scaling B (e.g. 100%), the bounds of the WebBrowserComponent do not update in contrast to the parent component. This leads to ugly artifacts up to unreadable content.

However, the bounds get updated as soon as the user resizes the window - but not automatically on the DPI change. Also calling the WebBrowserComponents repaint on the parents component paint did not help. And the resize method is not called on DPI change - still though, the bounds would be the same…

To reproduce:

  • Launch Projucer (tested with JUCE 7.0.8 and 7.0.9)
  • Open Example > GUI > WebBrowserDemo and save the project
  • Click on Modules → juce_gui_extra and set JUCE_USE_WIN_WEBVIEW2 to “Enabled” and export the VS2022 project
  • modify the Constructor of DemoBrowserComponent in WebBrowserDemo.h to the following:
DemoBrowserComponent (TextEditor& addressBox)
    : WebBrowserComponent(juce::WebBrowserComponent::Options().withBackend(juce::WebBrowserComponent::Options::Backend::webview2))
    , addressTextBox (addressBox)
{}
  • build and run the project
  • move the window from one screen to another screen that has different DPI scaling

Starting on 100% screen and moving it to the screen with 125%:

Do you have any idea how to fix this?

Cheers
Berni

2 Likes

Thank you for reporting. We have a fix for this issue on develop

Hi Attila,

thank you for the fix. Works like a charm :slight_smile:
Do you already have a plan when this fix will be included in the next release?

Best Regards
Berni