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
- Use renderer.createVertexBuffer (bufferType = ARRAY_BUFFER) for vertex data and bind it to arrayBuffer.
- Inspect the wrapper's bufferType before binding: if (buf.bufferType === gl.ARRAY_BUFFER).
- Do not reuse an index buffer as a vertex buffer; allocate a correctly-typed buffer.
- 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
- Always create vertex buffers with createVertexBuffer.
- Keep vertex and index buffers in separate, clearly-named variables.
- Add a debug assert on bufferType before binding.
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
- Invalid buffer type for ELEMENT_ARRAY_BUFFER
- Color attachments must have the same dimensions
- Framebuffer status:
- Buffer too small for layout
- BatchHandler must have a name
AI-assisted analysis of phaserjs/phaser@41be1e462b (2026-08-13).
Data as JSON: /api/errors/3d5fd878fb46d4a5.
Report an issue: GitHub.