Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

WebGLRenderTarget: Inconsistent output with UnsignedByteType + sRGBEncoding

See original GitHub issue

Describe the bug

Using WebGLRenderTarget in a post-processing stack with .type=UnsignedByteType and .encoding=sRGBEncoding causes incorrect final output to canvas:

type	encoding	result
uint8	Linear-sRGB
float16	Linear-sRGB
uint8	sRGB
float16	sRGB

More interestingly, the uint8/srgb output flickers on my device — sometimes showing the expected color for a frame, but mostly showing the incorrect color. Reports in Discord suggest this issue may be specific to macOS devices with M1 chips.

To Reproduce

https://jsfiddle.net/donmccurdy/ctvasr9p/

Expected behavior

Same background color as with other render target settings.

Platform:

Device: Desktop
OS: macOS Monterey 12.3.1
GPU: Apple M1 Pro
Browser:
- ✅ Safari (OK)
- ❌ Chrome (BROKEN)
- ❌ Firefox (BROKEN)
Three.js version: r140

Issue Analytics

State:
Created a year ago
Comments:7

Top GitHub Comments

1reaction

donmccurdycommented, May 25, 2022

Reported to Chromium: https://bugs.chromium.org/p/chromium/issues/detail?id=1329199&q=&can=2

1reaction

donmccurdycommented, May 4, 2022

/cc @vanruesc FYI

Top Results From Across the Web

Non-smooth Points 'sizeAttenuation' on M1 Macbooks #23968

Describe the bug Specifically on M1-based Macbooks, in non-safari browsers (as far as testing has gone), the size attenuation of points does ...

sRGBEncoding in not working in THREE.EffectComposer

When using post processing, use a gamma correction pass at the end of your pass chain. This will ensure a sRGB encoded output:...

Color management in three.js - Don McCurdy

Hexadecimal and CSS colors are generally sRGB, and must be converted. Renderer should have .outputEncoding = sRGBEncoding when not using post- ...

WebGLRenderTarget – three.js docs

A render target is a buffer where the video card draws pixels for a scene that is being rendered in the background. It...

UNPKG - @google/model-viewer

n * @param selector A string which filters the results to elements that match\n ... LinearEncoding = 3000;\nconst sRGBEncoding = 3001;\nconst GammaEncoding ...