Shader does not work on android devices

[arinayarina]

I wrote a small example for love.js:

local shader = love.graphics.newShader([[
varying vec4 v_pos;
#ifdef VERTEX
      vec4 position(mat4 transform_projection, vec4 vertex_position) {
            v_pos = vertex_position;
            return transform_projection * vertex_position;
      }
#endif
#ifdef PIXEL
      vec4 effect(vec4 color, Image t, vec2 texture_coords, vec2 screen_coords) {
            return color * (200.0 / v_pos);
      }
#endif
]])

function love.draw()
      love.graphics.setShader(shader)
      love.graphics.rectangle('fill', 0, 0, 800, 600)
      love.graphics.setShader()
end

Everything works fine in the browser on my computer. But in browsers on android devices, I get the error:

Cannot compile vertex shader code: love.js:9 ERROR: 0:19: 'webgl_8649e44eab8dfa6' : undeclared identifier love.js:9 ERROR: 0:19: 'assign' : cannot convert from 'const 4-component vector of float' to 'float' love.js:9 ERROR: 2 compilation errors. No code generated.

I found out that the problem lies in the line "varying vec4 v_pos;". If I don't use this it works. Any ideas on how to fix this?

[Davidobot]

Huh, that's a new one. Try splitting the shaders into two files perhaps.

Make sure it conforms with the OpenGL ES 1.0 spec.

[arinayarina]

Huh, that's a new one. Try splitting the shaders into two files perhaps.

Make sure it conforms with the OpenGL ES 1.0 spec.

I've tried splitting, but the error is the same. I haven't found any inconsistencies with the specification.

[rameshvarun]

Encountering this issue on macOS Chrome/Firefox/Safari, but was able to fix it.

The cause of this issue is that, when constructing the final shader, createShaderStageCode in wrap_GraphicsShader.lua appends the game-provided shader code after Love2D's built-in main function.

For whatever reason, WebGL doesn't seem to like it when varying's are defined after the main. I have a patch which fixes this by flipping the order. But it might break other shaders.

[abhimonk]

Just wanted to stop by and say @rameshvarun you're my hero. I had the same error as OP on firefox on Windows (Chrome worked fine). I was going insane looking at various shader inspector extensions until I found this thread.

I tried your thermomorph-web fork with the updated wrap_GraphicsShader.lua and it seems to have resolved the issue completely for me. Hope that change makes it into the main love.js repo at some point.

Anyway, huge thanks!