phaserjs/phaser · error · Error

Invalid buffer type for ARRAY_BUFFER

Error message

Invalid buffer type for ARRAY_BUFFER

What it means

Thrown by WebGLGlobalWrapper.updateBindingsArrayBuffer when the buffer object bound as ARRAY_BUFFER has a bufferType that is not gl.ARRAY_BUFFER. The global state wrapper type-checks buffer bindings to catch the classic mistake of binding an index/element buffer to a vertex slot (and vice versa), which would otherwise corrupt GPU state silently.

Source

Thrown at src/renderer/webgl/wrappers/WebGLGlobalWrapper.js:213

    /**
     * Updates the array buffer (ARRAY_BUFFER) binding state. This binds the
     * vertex buffer object used to supply vertex attribute data to the GPU.
     *
     * @method Phaser.Renderer.WebGL.Wrappers.WebGLGlobalWrapper#updateBindingsArrayBuffer
     * @since 4.0.0
     * @param {Phaser.Types.Renderer.WebGL.WebGLGlobalParameters} state - The state to set.
     * @param {boolean} [force=false] - If `true`, the state will be set regardless of the current state.
     */
    updateBindingsArrayBuffer: function (state, force)
    {
        var arrayBuffer = state.bindings.arrayBuffer;
        var gl = this.renderer.gl;
        if (
            arrayBuffer !== null &&
            arrayBuffer.bufferType !== gl.ARRAY_BUFFER
        )
        {
            throw new Error('Invalid buffer type for ARRAY_BUFFER');
        }

        var different = arrayBuffer !== this.state.bindings.arrayBuffer;

        if (different)
        {
            this.state.bindings.arrayBuffer = arrayBuffer;
        }
        if (different || force)
        {
            var webGLBuffer = arrayBuffer ? arrayBuffer.webGLBuffer : null;
            gl.bindBuffer(gl.ARRAY_BUFFER, webGLBuffer);
        }
    },

    /**
     * Updates the index array buffer state.
     *

View on GitHub (pinned to 41be1e462b)

Solutions

  1. Use renderer.createVertexBuffer (bufferType = ARRAY_BUFFER) for vertex data and bind it to arrayBuffer.
  2. Inspect the wrapper's bufferType before binding: if (buf.bufferType === gl.ARRAY_BUFFER).
  3. Do not reuse an index buffer as a vertex buffer; allocate a correctly-typed buffer.
  4. Trace where the buffer object was created and confirm the intended usage.

Example fix

// before
const buf = renderer.createIndexBuffer(new Uint16Array(verts));
glWrapper.updateBindingsArrayBuffer({ bindings: { arrayBuffer: buf } }); // throws

// after
const buf = renderer.createVertexBuffer(new Float32Array(verts));
glWrapper.updateBindingsArrayBuffer({ bindings: { arrayBuffer: buf } });
Defensive patterns

Strategy: type-guard

Validate before calling

function bindArrayBuffer(glWrapper, gl, buf) {
  if (buf && buf.bufferType !== gl.ARRAY_BUFFER) {
    throw new TypeError('Expected ARRAY_BUFFER-typed wrapper');
  }
  glWrapper.updateBindingsArrayBuffer({ bindings: { arrayBuffer: buf } });
}

Type guard

function isArrayBufferWrapper(buf, gl) { return buf == null || buf.bufferType === gl.ARRAY_BUFFER; }

Prevention

When it happens

Trigger: Passing a WebGLBufferWrapper whose bufferType is gl.ELEMENT_ARRAY_BUFFER (or anything other than ARRAY_BUFFER) into the arrayBuffer slot of a state update; creating a buffer with createIndexBuffer and binding it as a vertex buffer.

Common situations: Misusing renderer.createIndexBuffer output as a vertex buffer; hand-rolling buffer binding code that swaps array/element buffers; a bug in a custom render node that binds the wrong wrapper object.

Related errors


AI-assisted analysis of phaserjs/phaser@41be1e462b (2026-08-13). Data as JSON: /api/errors/3d5fd878fb46d4a5. Report an issue: GitHub.