ocornut/imgui

Fork 0

mirror of https://github.com/ocornut/imgui.git synced 2026-11-10 19:03:30 +00:00

example_emscripten_wgpu not rendering / black screen #4650

New issue

Closed

opened 2021-10-13 23:05:33 +00:00 by eliam · 8 comments

eliam commented

2021-10-13 23:05:33 +00:00

(Migrated from github.com)

Hi,

I was really excited to find imgui and emscripten however I seem to be falling at the first hurdle. I'm trying the example (example_emscripten_wgpu) as is and everything compiles and runs but all I get in the browser is a black screen.

successful build:

git log (current version from gitlab)

FYI, emscripten environment seems sane / working:

Here's what I see in the browser:

Any hints / tips appreciated!

Hi, I was really excited to find imgui and emscripten however I seem to be falling at the first hurdle. I'm trying the example (example_emscripten_wgpu) as is and everything compiles and runs but all I get in the browser is a black screen. successful build: ![image](https://user-images.githubusercontent.com/1518180/137223885-924cfd45-6f51-4417-83f5-3a260de2f911.png) git log (current version from gitlab) ![image](https://user-images.githubusercontent.com/1518180/137223541-4bb48cc4-c7a5-4fad-930e-ba6ac9a2607d.png) FYI, emscripten environment seems sane / working: ![image](https://user-images.githubusercontent.com/1518180/137224167-3d3a649c-91fa-4bae-a7ab-98965acb77d0.png) Here's what I see in the browser: ![image](https://user-images.githubusercontent.com/1518180/137224394-f29971d6-8a12-44c1-8232-7805300f9cda.png) Any hints / tips appreciated!

ocornut commented

2021-10-14 04:37:24 +00:00

(Migrated from github.com)

Are you using a browser that supports wgpu and which has it enabled?

eliam commented

2021-10-14 07:36:53 +00:00

(Migrated from github.com)

@ocornut Good point! I'd somewhat naively assumed this was 'out of the box' technology, currently supported by modern browsers. D'oh!

FYI, I'm using a stock firefox (v93.0), not nightly. It wasn't enabled in config but when I enabled it, it didn't seem to make a difference.

To try something else, I've switched to the opengl3 example (example_emscripten_opengl3). This appears to work succesfully in edge (Yey!) so I now have something awesome to play with. Firefox still isn't working (same blank screen with the opengl example) so there is likely something funky with firefox. If I work out what, I'll post back here but please feel free to close this, as I doubt it's a bug in imgui.

@ocornut Good point! I'd somewhat naively assumed this was 'out of the box' technology, currently supported by modern browsers. D'oh! FYI, I'm using a stock firefox (v93.0), not nightly. It wasn't enabled in config but when I enabled it, it didn't seem to make a difference. To try something else, I've switched to the opengl3 example (example_emscripten_opengl3). This appears to work succesfully in edge (Yey!) so I now have something awesome to play with. Firefox still isn't working (same blank screen with the opengl example) so there is likely something funky with firefox. If I work out what, I'll post back here but please feel free to close this, as I doubt it's a bug in imgui.

ocornut commented

2021-10-14 07:44:32 +00:00

(Migrated from github.com)

WGPU has been such a moving api lately (with recent patches by contributors to catch up) that I would presume you need nightly.

eliam commented

2021-10-14 07:52:52 +00:00

(Migrated from github.com)

Any idea why the opengl example might work in edge but not firefox? It's the same blank screen and no hints / errors in the browser console window. Looks like everything 'should' be working so I'm still puzzled.

Hi, thanks. :) I'd googled this based on your earlier reply and found this page: https://hacks.mozilla.org/2020/04/experimental-webgpu-in-firefox/. The config items were available in my FF but I'm going to assume nightly too. I'm looking for something which would work in the browser for others, without needing to get custom versions to set config items so it seemed sensible to switch to the other example and start trying to understand that instead. Any idea why the opengl example might work in edge but not firefox? It's the same blank screen and no hints / errors in the browser console window. Looks like everything 'should' be working so I'm still puzzled.

ocornut commented

2021-10-14 08:18:10 +00:00

(Migrated from github.com)

Look at the debug console of the browser and make sure you are hosting the files via a web server rather than directly from file system (as specified in readme). There are various restrictions when hosting from file system.

👍 1

eliam commented

2021-10-15 20:47:29 +00:00

(Migrated from github.com)

Yey, I've tracked it down. Turns out, firefox doesn't support gamepads over untrusted connections (http).

Starting with Firefox 81, the Gamepad API will be restricted to what are known as “ secure contexts ” (bug 1591329). Basically, this means that Gamepad API will only work on sites served as “https://”. But don’t worry, it also works on http://localhost too while you are debugging!

I'm using v93.0 and that seems to die during the load. You can see it in the console as "Error: Gamepads not supported".

Using https instead of http worked fine in Firefox.

A simple and dirty (python2) way of bringing up a https endpoint instead of http is in this gist: https://gist.github.com/dergachev/7028596

Yey, I've tracked it down. Turns out, firefox doesn't support gamepads over untrusted connections (http). ----------- Starting with Firefox 81, the Gamepad API will be restricted to what are known as “ secure contexts ” (bug 1591329). Basically, this means that Gamepad API will only work on sites served as “https://”. But don’t worry, it also works on http://localhost too while you are debugging! ----------- I'm using v93.0 and that seems to die during the load. You can see it in the console as "Error: Gamepads not supported". Using https instead of http worked fine in Firefox. A simple and dirty (python2) way of bringing up a https endpoint instead of http is in this gist: https://gist.github.com/dergachev/7028596

👍 1

eliam commented

2021-10-18 19:45:01 +00:00

(Migrated from github.com)

https://github.com/ocornut/imgui/pull/4662