WebGPU: incorrect rendering with transmission or when animated or when resizing the window

[marwie]

Description

Hello, I have a model with KHR_animation_pointer physical material animations. Once the animation starts the rendered dragon looks like transmission is not displayed correctly(?). The same animation works fine in the WebGL renderer

Reproduction steps

1. Open WebGPU example
2. Click Toggle Animation button to start the animation

Code

https://github.com/needle-tools/three.js/blob/a51be2d54b7dd5c45cfff2002e3d77c6ec0943a3/examples/webgpu_loader_gltf_animation_pointer.html

Live example

Expected

Live: https://three.needle.tools/examples/?q=pointer#webgl_loader_gltf_animation_pointer

20250828-100814_three.js_examples_-_Google_Chrome-logo.mp4

WebGPU - Animation

Live: https://three.needle.tools/examples/?q=pointer#webgpu_loader_gltf_animation_pointer

20250828-100715_three.js_examples_-_Google_Chrome-logo.mp4

WebGPU - Resizing the window

20250828-100409_three.js_examples_-_Google_Chrome-logo.mp4

Screenshots

No response

Version

latest dev

Device

Desktop

Browser

Chrome

OS

Windows

[Mugen87]

Can you first make sure to resolve below warnings by using the renderer correctly?

You can do that by adding the following code after you have created the renderer:

await renderer.init();

[Mugen87]

I can reproduce the flickering when resizing the browser window. It seems it only happens with the WebGPU but not with the WebGL backend.