Location of variable glFragColor conflicts with another variable

When launching my game on my laptop, I get errors, and the GLSL shaders do not work. However, it works fine on my desktop PC. Both devices are running Fedora 40.

I’ve verified this isn’t a problem with any code- I copied the working code from the desktop to the laptop and verified that everything is the same (using diff). This problem occurs regardless of which core and loader versions I use. It appears to occur both for my shader code as well as built-in shader code.

I’ve included the BJS logs here:
bjs.zip (2.6 KB)

Note there are some nul characters, and Gnome Text Editor opened the file with the wrong encoding. VS Code opened it fine.

I have no idea what is causing this problem or how to fix it. I would appreciate insight from someone more experienced.

If you want to attempt a reproduction, the code is here

The error is “Location of variable glFragColor conflicts with another variable.”, but I don’t understand it, because for all shaders that are dumped in the console log, glFragColor is defined as layout(location = 0) out vec4 glFragColor; and there’s no other variables which are defined at location 0…

Can you test the simple scene from the Playground? Your log shows that it fails for all shaders of the scene (or so it seems).

Have you tried in different browsers? Also, can you try in WebGPU?

Can you test the simple scene from the Playground? Your log shows that it fails for all shaders of the scene (or so it seems).

Here is a PG with the minimal amount of code needed to reproduce the bug in my environment. I’m not sure the issue is with my code, however.

Have you tried in different browsers?

Unfortunately, Electron is only available with Chromium.

Also, can you try in WebGPU?

I’m not entirely sure how to do this.

The interesting thing is that this problem occurs only on my laptop, not my PC. Both have the exact same code. I feel like this problem could be with the underlying graphics API used by Chromium, but I have no idea.

Your PG does not work, there’s a 404 on “skybox.png”.

But as I said above, I don’t understand the error message, because there’s only a single variable declared at location 0 in the shaders…

What you could try is to change the graphics backend used by Chrome/Chromium, if possible in Electron? In Chrome, it’s under chrome://flags/:

If you can, try to change the value of Angle graphics backend (OpenGL, for eg).

[…] Regarding WebGPU, you will have to create a WebGPUEngine instead of an Engine:

const engine = new BABYLON.WebGPUEngine(canvas);
await engine.initAsync();

I’m going through a commit log of around 700 changes in order to make a changelog for my game, and found this:

Updated electron, which fixed shader compilation issue

I will give this a go and let you know if that fixes the problem.

1 Like

Success! This is really strange, I think it was most likely a problem with Chromium or Electron. Sorry for bothering you.