WebXR: Objects rendered transparent when in immersive-ar on Android

Tested versions

Reproducible in Godot 4.3 (stable) and Godot 4.4.dev3

System information

Sony Experia 10 III - Andorid 13 - Compatibility - Google Chrome Version 129.0.6668.100 (latest as of time of writing)

Issue description

I try to create a minimal WebXR AR application that shows 3D models to the user, blended with the real world environment. To do so, I followed the instructions on the tutorial in the docs especially the AR / Passthrough, as well as David Snopke's tutorials.

However, when I run the app and enter AR, objects are rendered transparent, the closer their color is to black. (Reading the WebXR standard and checking the environment blend modes, it looks like the rendering behaves as "additive" used for see-through devices (like the Holo Lens). However, it should behave like environment blend mode "alpha-blend", i.e. use the alpha channel to determine transparency). The blend mode reported by WebXR, however, in fact is "alpha-blend" which to my knowledge is correct.

Actual outcome:

godot_webxr_transparent_1

Expected outcome (hacked together in Gimp):

godot_webxr_transparent_1_expected

Since I'm fairly new to WebXR in Godot it may also me doing something wrong :upside_down_face: However, I tried many different things, settings, renders, configuration suggested at different places and always get the same result. I also talked to @dsnopek at GodotCon 24 (shamelessly tagging you here, hope you have had / will have a safe trip back home :) ) about this and he mentioned it could be a regression. Searched the closed issues and this sounds kinda related to me: https://github.com/godotengine/godot/issues/75581

Steps to reproduce

I have hosted the MRP at github pages on https://www.simonkerler.de/godot-webxr-mrp/dist/ :

Open the link with Chrome on your smartphone
Hit the "Enter AR" button
Wait for the scene being blended on the camera pass-through
See that the boxes are not opaque but transparent

If you run the MRP from within the editor, don't forget to expose the web server to 0.0.0.0 and turn on HTTPS to make it accessible from your smartphone.

Minimal reproduction project (MRP)

I created an MRP here: https://github.com/namelessvoid/godot-webxr-mrp

Just open it in the editor. There is a single scene, containing four boxes of different color, world environment, lighting and WebXROrigin with an WebXRCamera.

godotengine / godot