What causes "SHADER ERROR" + (typeof message === "string" ? "\n" + message : "")" in BabylonJS/Babylon.js?

Read the appended compiler message in the thrown error and fix the shader source at the reported line.

SHADER ERROR" + (typeof message === "string" ? "\n" + messag

Error message

SHADER ERROR" + (typeof message === "string" ? "\n" + message : "")

What it means

NativePipelineContext.isReady rethrows a recorded shader compilation failure: if compilationError was set during shader compilation, accessing isReady throws 'SHADER ERROR' plus the compiler's message. It surfaces GLSL/WGSL compile/link problems at the point where the engine checks pipeline readiness.

Source

Thrown at packages/dev/core/src/Engines/Native/nativePipelineContext.ts:24

import { type AbstractEngine } from "../abstractEngine";
import { type NativeShaderProcessingContext } from "./nativeShaderProcessingContext";
import { type ThinNativeEngine } from "../thinNativeEngine";

export class NativePipelineContext implements IPipelineContext {
    public isCompiled: boolean = false;
    public compilationError?: Error;

    public readonly isAsync: boolean;

    public program: NativeProgram;

    public vertexBufferKindToType: { [kind: string]: number } = {};
    public shaderProcessingContext: Nullable<NativeShaderProcessingContext>;

    public get isReady(): boolean {
        if (this.compilationError) {
            const message = this.compilationError.message;
            throw new Error("SHADER ERROR" + (typeof message === "string" ? "\n" + message : ""));
        }
        return this.isCompiled;
    }

    public onCompiled?: () => void;

    public _getVertexShaderCode(): string | null {
        return null;
    }

    public _getFragmentShaderCode(): string | null {
        return null;
    }

    private _engine: ThinNativeEngine;
    private _valueCache: { [key: string]: any } = {};
    private _uniforms: { [key: string]: Nullable<WebGLUniformLocation> };

View on GitHub (pinned to 0592b347b8)

Solutions

Read the appended compiler message in the thrown error and fix the shader source at the reported line.
Check that the shader name/path resolves in ShaderStore (effect.assets/shaders include) and the shader actually compiled.
Test the shader with the same code path on the WebGL engine to isolate native-specific incompatibilities.

Example fix

// before
const shader = "myShders"; // misspelled path -> invalid shader
new ShaderMaterial("m", scene, shader, {});
// after
const shader = "myShaders/myShader";
new ShaderMaterial("m", scene, shader, {});

Defensive patterns

Strategy: try-catch

Try / catch

try {
  if (!pipelineContext.isReady) { /* wait */ }
} catch (e) {
  if (String(e.message).startsWith('SHADER ERROR')) {
    console.error('Shader compilation failed:\n' + e.message); // includes compiler output
    // fix shader source / path, or fall back to a known-good shader
  } else throw e;
}

Prevention

Validate custom shader code on the WebGL engine before running on NativeEngine.
Ensure shader names/paths exist in ShaderStore so the compiler receives real source.
Log compilationError early (effect.onCompiled / onError) instead of polling isReady blindly.
Keep uniform/varying usage within what the native backend supports.

When it happens

Trigger: Accessing pipelineContext.isReady (directly or via effect readiness checks) after a shader failed to compile in Babylon Native, e.g. due to shader code syntax errors, unsupported uniforms, or a bad ShaderStore/shader path.

Common situations: Typos in custom ShaderMaterial GLSL; referencing uniforms/varyings unsupported by the native backend; shader name misspelled so empty/invalid source is compiled; custom shader code ported from WebGL that the native compiler rejects.

Related errors

AI-assisted analysis of BabylonJS/Babylon.js@0592b347b8 (2026-08-30). Data as JSON: /api/errors/e83abf092cf2eac6. Report an issue: GitHub.