6

I am looking for a javascript which allows me to debug a WebGL shader down to the single line / variable level. So it should be possible break on every line and inspect the value of every variable.

This can be done by instrumentation (parsing the shader, generating a shader which outputs the requested variable, execute this shader against the current context and returns the ouput to the user)

It is similar to what glslDevil (http://www.vis.uni-stuttgart.de/glsldevil/) does for OpenGL.

Does anyone know if such a tool for WebGL exists ?

  • 1
    The tool I imagine would be very ambitious. 1. GLSL code would be compiled w/ GLSL debug info by library/driver. 2. GPU would relegate a single monitored thread to each shader and trap on breakpoint instructions. 3. GPU monitor would then send GPU state info back to CPU on each trap. Hmmm.. probably good reason this doesn't exist. Probably just have to simulate GLSL code on CPU to pull this off... – wcochran May 23 '14 at 15:47
  • I was thinking to do it with software instrumentation only. As long as the driver / implementation subsystem can handle the complexity of some extra ifs, you should be able to do it completely in software. – user3664955 May 27 '14 at 15:33
  • I see the latest version for [glsldevil](http://wwwvis.informatik.uni-stuttgart.de/glsldevil/index.html#downloads) is from 2010? This seems like an important gap to fill. – wcochran May 28 '14 at 18:17
  • Open source fork of glsldevil : http://glsl-debugger.github.io/ – user3664955 May 30 '14 at 15:41
  • forked version looks nice ... looks like they need someone to work in the OS X version -- hmmm... maybe I'll check it out. – wcochran May 31 '14 at 20:19
  • Not sure if its worth saying, but one of my side projects is creating this for WebGL as a chrome extension similar to the WebGL Inspector. Haven't got too far with it yet, though. – Brendan Annable Aug 11 '15 at 12:39

1 Answers1

0

Firefox, at at least v38, has a debugging panel for WebGL GLSL shaders. You are able to edit and quickly recompile them for debugging purposes. I don't believe it allows for breakpoints in individual lines though.

You can enable it through the gear panel:

Firefox Gear panel

And then use it in the Shader Editor panel

Shader Editor Panel

zero298
  • 25,467
  • 10
  • 75
  • 100