readPixels() with format RGB outputs zero

[UlyssesZh]

const width = 4;
const height = 4;
const gl = require('gl')(width, height, {preserveDrawingBuffer: true});
gl.clearColor(1, 0, 0, 1);
gl.clear(gl.COLOR_BUFFER_BIT);

const pixelsRgba = new Uint8Array(width * height * 4);
gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixelsRgba);
console.log(pixelsRgba);

const pixelsRgb = new Uint8Array(width * height * 3);
gl.readPixels(0, 0, width, height, gl.RGB, gl.UNSIGNED_BYTE, pixelsRgb);
console.log(pixelsRgb);

Output:

Uint8Array(64) [
  255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255,
  255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255,
  255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255,
  255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255,
  255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255,
  255, 0, 0, 255
]
Uint8Array(48) [
  0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  0, 0, 0, 0
]

The RGBA output is correct, but the RGB output is incorrect.

[maximilianmachnik]

Im facing the same issue. Any updates on this?

[trevorparscal]

I also bumped into this. Looking briefly at the code, 4-channel color seems to be baked-into the readPixels function. I don't know the code very well, but I might take a crack at it if no one more familiar with the code can. I'm piping data between GL and a video encoder, so 25% overhead is a significant issue.

[UlyssesZh]

Please react this issue with a thumb up emoji to make the contributors more aware of this issue if this issue is important to you.

I opened the issue long time ago, and it is still relevant to me. For now, I have to use RGBA output and convert it to RGB format in JS before piping it to video encoder.

[ankushlohiya001]

Because of this, doesn't modify the array,
and is marked as invalid operation.

https:/stackgl/headless-gl/blob/254da5180eb123dd410313c66d581a98bb4266a0/src/javascript/webgl-rendering-context.js#L2890C1-L2896C8