How to obtain a WebGL2 context

SDL Development
1

Hi there,

is there a way to obtain a WebGL2 context when running in a browser?
I am currently using emscripten to compile for the web but the result looks wierd.

I am logging the version of the context that I am getting back and it shows the following

Compiled SDL version: 2.0.20

binocle-player.js:9327 Linked SDL version: 2.0.20

binocle-player.js:9327 OpenGL version supported by this platform (OpenGL ES 3.0 (WebGL 2.0 (OpenGL ES 3.0 Chromium))): 

binocle-player.js:9327 GLSL version supported by this platform (OpenGL ES GLSL ES 3.00 (WebGL GLSL ES 3.00 (OpenGL ES GLSL ES 3.0 Chromium))):

Then I am just loading the GLES shaders, compiling them and setting up my pipelines (I am using sokol as my backend in this case)

But by the kind of error it looks like I am using a context that is not an OpenGL ES 3.

ERROR: 0:1: '
binocle-player.html:89 ' : invalid version directive
binocle-player.html:89 ERROR: 0:4: 'layout' : syntax error
binocle-player.html:89 
binocle-player.html:89 ERROR: 0:1: '
binocle-player.html:89 ' : invalid version directive
binocle-player.html:89 ERROR: 0:3: 'in' : storage qualifier supported in GLSL ES 3.00 and above only
binocle-player.html:89 ERROR: 0:3: '' : No precision specified for (float)
binocle-player.html:89 ERROR: 0:4: 'in' : storage qualifier supported in GLSL ES 3.00 and above only
binocle-player.html:89 ERROR: 0:4: '' : No precision specified for (float)
binocle-player.html:89 ERROR: 0:5: 'out' : storage qualifier supported in GLSL ES 3.00 and above only
binocle-player.html:89 ERROR: 0:5: '' : No precision specified for (float)
binocle-player.html:89 ERROR: 0:7: 'texture' : no matching overloaded function found
binocle-player.html:89 
binocle-player.html:89 sg_pipeline_desc.shader missing or invalid
binocle-player.html:89 ^^^^  SOKOL-GFX VALIDATION FAILED, TERMINATING ^^^^

I can’t really say which one of the shader it is actually having an issue with as I don’t know how to debug this within Chrome. But it is clear that it is complaining about keywords that are from version 3300 of the GLSL spec.

Is there anybody who can help me either debugging or understanding what is going wrong there?
Thanks!

2

Do you request an OpenGL ES 3.0 context? Your code should include something like this, before the first window is created:

SDL_GL_SetAttribute(SDL_GL_CONTEXT_PROFILE_MASK, SDL_GL_CONTEXT_PROFILE_ES);
SDL_GL_SetAttribute(SDL_GL_CONTEXT_MAJOR_VERSION, 3);
SDL_GL_SetAttribute(SDL_GL_CONTEXT_MINOR_VERSION, 0);
3

Yes, I have exactly that code running.
I also do a

  SDL_SetHint(SDL_HINT_RENDER_DRIVER, "opengles3");

even though I think this is not really needed as I do not use SDL’s renderer itself.

4

And do you also have this as the first line of your shader code:

#version 330 es

If so I’m all out of ideas. :frowning_face:

5

No, I use #version 300 es

6

You said “it is complaining about keywords that are from version 3300 of the GLSL spec” so if you really need version 330 that’s probably why it doesn’t work (and I’m not even sure that’s supported in WebGL yet).

7

Yes, my bad. Those keywords are 300+