depthTest functionality change with 127 three.js release

Hello, today I tryied to update from three.js 124r to 130r. I found out that since version 127 renderOrder doesnt match when material has set depthTest false. My goal is to display meshes before rest of the scene. Sadly on new version polar oposite happens.

renderOrder = 0;
depthTest = true;

three.js 126.2r
renderOrder = 1;
depthTest = false;

three.js 127r
renderOrder = 1;
depthTest = false;

Does anybody know how to reproduce original behavour? Preferably without using two scenes.

Do you mind demonstrating this issue with a live example? https://jsfiddle.net/f2Lommf5/

Preferably without a complex model but with simple meshes.

Looking at the release notes of r127 and the migration guide I can’t explain why this version introduces a different behavior.

1 Like

Here is demonstration: https://jsfiddle.net/kud8zjfy/

Seems like from 127r setting renderOrder for ancestor of deeply nested meshes is not enough. Thanks for reply. Now I know how to fix my use case.

I’ve created two fiddles based on your ones. One with r126 and another one with r127. However, I can’t figure out the difference. Do you mind providing more feedback?

r126: https://jsfiddle.net/cfjy9b2L/
r127: https://jsfiddle.net/cfjy9b2L/1/

I apologize my conclusions were wrong. I was not aware that there is different behavior of renderOrder depending if its set for Object3D or Group. Here is comparison. Group: https://jsfiddle.net/amqtbyc8/ Object3D: https://jsfiddle.net/pwhj87gt/. With this information I can say that highlighted meshes had same renderOrder as rest of the scene. So why highlighted meshes were not rendered first in 126r? Same behaviour I can only replicate with mine model. Anyway 127r has now correct behaviour in my eyes. Maybe later ill findout what happend with smaller and simpler model.

Sorry, I still don’t understand the difference between r126 and r127. If I change the versions of both fiddles to r126, the fiddles produce the same output: Group: Edit fiddle - JSFiddle - Code Playground, Object3D: Edit fiddle - JSFiddle - Code Playground.

Defining renderOrder on Group has a specific semantic. It is explained in the documentation.

When this property is set for an instance of Group, all descendants objects will be sorted and rendered together.

The idea of this logic is to use Group to easily render complex sprites which are composed of sub objects. It’s a pendant to Unity’s SortingGroup.

Sorry I am unable to figure out what causes differences between 126 and 127. Also I am unable to replicate same behaviour in JSFiddle. When is depthTest for material disabled First thing which is checked on render is renderOrder of mesh. If renderOrder od two meshes is same then render order is determined by material ID. For some reason in my model on 126r material with ID 2 is rendered on top of material with ID 15. Cant show that on exported model since material IDs are assigned on load.

Example why material ID matter: https://jsfiddle.net/shumokxv/
https://jsfiddle.net/shumokxv/1/