WebView2 blocks UI when showing WebGL (ThreeJS) from OpenGL App

[benkuper]

Hello,
I’m working on a 3d point cloud manipulation app that hosts a webserver showing a 3d view of the manipulated point clouds using ThreeJS.
The app works well and the viewer is working just fine in a browser, but when trying to integrate the view of this webpage inside the app itself, as soon as the webgl part of the page is loaded, the app doesn’t not respond to any interaction, it’s not frozen but the UI is just “blocked”.

I’m currently using OpenGL to render the UI in JUCE, using

openGLContext.reset(new OpenGLContext());
openGLContext->setComponentPaintingEnabled(true);
openGLContext->setContinuousRepainting(false);
openGLContext->attachTo(*this);

I tried commenting out those lines, and it is working fine inside the app.
I guess there is something to do with passing the same context to the WebView2 and the main windows’ one

Does anybody know if there is a way to pass another context, or more generally have a way to use both GL rendering for JUCE components and WebView2 with ThreeJS (or other webGL stuff) ?

Thank you !

[parawave]

@benkuper

doesn’t not respond to any interaction, it’s not frozen but the UI is just “blocked”.

Sounds familar, probably related to this:

Various OpenGL Fixes (Windows)

Related to wglCreateContextAttribsARB @t0m @reuk I looked into a few more WGL extensions and discovered some interesting things. Probably information overload. But hey, feel free to implement these one at a time It looks more like it actually is, I swear If anyone has hints or ideas for other improvements, please share them here. 1. Context Release behavior Reason: If there are context switches mid frame, the command pipeline will flush and trigger parts of renderin…

If the juce OpenGLContext stalls the pipeline by claiming the context too much, it could potentially freeze/lock other GL pipelines.

Do you have a minimal working example that reproduces the error, which you can share? If so, I could check out if the listed fixes resolve the UI blocking.

[benkuper]

Sorry for the late response, I had to go forward with the project…
I think it’s pretty straightforward to just include a WebView2 component in the example OpenGL app and check that it’s pretty much broken.
I can confirm that just removing the OpenGL as renderer makes it work as expected, on 7.0.2

[davidleonalex]

Hi Ben! I’m looking at using a ThreeJS based visualiser in my Juce plugin using the WebBrowserComponent or the OpenGLAppComponent, did you get this working in the end? Just wondering how do-able this is / what issues I might run into.

[benkuper]

Hello, doesn’t seem to have been updated since. My app is actually keeping quite update on the JUCE develop branch so I’d notice if the OpenGL + WebView was working now

Anybody from JUCE has some insight here ?

[kunitoki]

You would have to wait until JUCE 8 will be released so the OpenGL/Metal/WebGL/WebGPU interoperability will be ironed out in all platforms, webviews and graphics stacks.

[benkuper]

Waw that’s a very nice surprise ^^
Any idea on an approximate release date ?
Thank you

[attila]

I’m unable to reproduce this issue with the current JUCE develop branch.

Adding either OpenGL to the WebBrowserDemo or a WebView2 instance to the OpenGL demo seems to work when opening one of the three.js demo pages in the WebBrowserComponent.

Can you share a minimal repro of your issue?