Open
Description
Library Version
I use React 18.
├─┬ gl-react-dom@5.2.1
│ └── gl-react@5.2.0 deduped
└── gl-react@5.2.0Expected Behavior
const shaders = Shaders.create({
helloGL: {
frag: GLSL`
precision highp float;
varying vec2 uv;
uniform float blue;
void main() {
gl_FragColor = vec4(uv.x, uv.y, 0.5, 1.0);
}`
}
});
class Example extends Component {
render() {
return (
<Surface width={300} height={300}>
<ShaderCanvas shader={shaders.helloGL} />
</Surface>
);
}
}
function App() {
return (
<div style={{ width: "100vw", height: "100vh" }}>
<Example />
</div>
);
}This code to render.
Actual behavior
I get the following error:
createSurface.js:498 TypeError: Failed to execute 'shaderSource' on 'WebGL2RenderingContext': parameter 1 is not of type 'WebGLShader'.
at compileShader (shader-cache.js:55:1)
at ContextCache.proto.getShaderReference (shader-cache.js:75:1)
at Object.getShaderReference [as shader] (shader-cache.js:131:1)
at Shader.proto.update (index.js:109:1)
at createShader (index.js:255:1)
at Surface._makeShader (createSurface.js:538:1)
at Surface._getShader (createSurface.js:547:1)
at Node._getShader (Node.js:764:1)
at Node._draw (Node.js:828:1)
at Surface._draw (createSurface.js:590:1)From my limited debugging, in the compileShader
function compileShader(gl, type, src) {
var shader = gl.createShader(type)
...
}The shader variable is null. Whic gives the error I think.
type is 35633 and src is
"attribute vec2 _p;
varying vec2 uv;
void main() {
gl_Position = vec4(_p,0.0,1.0);
uv = vec2(0.5, 0.5) * (_p+vec2(1.0, 1.0));
}
#define SHADER_NAME helloGL"Steps to reproduce the behavior
I tried to implement the first example in the docs. I get this error in Opera, Firefox and Chrome.
Metadata
Metadata
Assignees
Labels
No labels