WebGL: ERROR: unsupported shader version

Questions
, ,
1

Hello,

i am creating a fragment shader that requires GLSL 3 ES functionality.
From some posts on Github it looks like Three.js supports it (WebGL 2) but my console spits out that error.

My code: https://codepen.io/lukas2005/pen/LJxxvW

2

I’ve updated your codepen so it works with a WebGL 2 context: https://codepen.io/anon/pen/jvyGyB

The problem is WebGL 2 only support GLSL ES 3.00. You are trying to use a feature from GLSL ES 3.10. Because of this, you get the following error:

THREE.WebGLShader: gl.getShaderInfoLog() fragment ERROR: 0:11: '[]' : arrays of arrays supported in GLSL ES 3.10 only

3

hmm ok.

i guess i can use a 1d array and use a formula to find the index

4

Hmm so i did some adjustments to my code and im back to the start (same error pops up again)

(https://codepen.io/lukas2005/pen/LJxxvW?editors=1000)

6

looks like canvas.getContext(“webgl2”) returns null on my laptop (browser: Safari 11.1.2)

7

same in chrome

8

hmm weird when i open the js console in chrom on any website and type ‘document.createElement(“canvas”).getContext(“webgl2”);’ i get the instance except for codepen.io

9

in chrome i get a “WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost” warning

10

I’ve update the codepen with with a complete and working example. This runs on my system (Chrome 68.0.3440.106 on macOS): https://codepen.io/anon/pen/jvyGyB