`FastModelPicker#renderPickPass` bug

[ShaMan123]

Describe the bug 📝

#737 #747
I think I managed to isolate the bug to FastModelPicker#renderPickPass
My initial triage suggested the background was rendering over existing content masking the hit target suggesting it was also related to multiple loaded models.
It seems that rendering the entire scene it wrong.

engine_components/packages/core/src/core/FastModelPicker/src/fast-model-picker.ts

Line 674 in 12db5a6

renderer.render(scene, camera);

Also iterating all frags list is wrong/redundant because the consumer may have not added the frag.object to the scene.

Reproduction ▶️

No response

Steps to reproduce 🔢

On main open the Outliner example

Edit the example:

- world.scene.three.background = null;
+ world.scene.three.background = new THREE.Color("red");

const fragPaths = [
 "https://thatopen.github.io/engine_components/resources/frags/school_arq.frag",
+ "https://thatopen.github.io/engine_components/resources/frags/small_road.frag",
];

Outlining (on any raycasting) will not work.
Additionally the first frag (school_arq) will not show up, probably covered by the red background.

Toggle the background color to null:
Outlining works but school_arq still is not visible

Debug mode

Running in debug mode shows the canvas as black always even when the outliner works (another bug).

const pickers = components.get(OBC.FastModelPickers);
const picker = pickers.get(world);

/* MD
 ### 🎨 Enabling Debug Mode
 Debug mode shows a small canvas in the top-right corner displaying the color-coded render. This is useful for understanding how the component works:
*/

picker.setDebugMode(true);

System Info 💻

System:
 OS: macOS 26.5.2
 CPU: (12) arm64 Apple M2 Max
 Memory: 668.80 MB / 32.00 GB
 Shell: 5.9 - /bin/zsh
 Binaries:
 Node: 24.12.0 - /Users/shaman123/.nvm/versions/node/v24.12.0/bin/node
 Yarn: 3.2.1 - /opt/homebrew/bin/yarn
 npm: 11.12.0 - /Users/shaman123/.nvm/versions/node/v24.12.0/bin/npm
 Browsers:
 Chrome: 150.0.7871.182
 Safari: 26.5.2

Used Package Manager 📦

npm

Error Trace/Logs 📃

I have patched the caller of renderPickPass to workaround this issue (works on 3.4.6, but doesn't seem to work on 3.4.7 unless I didn't start the dev server or build the repo properly)

 private renderIdPass(byteToModel: Map<number, string>, _ndc: THREE.Vector2) {
 const renderer = this.world.renderer!.three;
 const camera = this.world.camera.three;
 const material = this._idMaterial;
 const fragments = this.components.get(FragmentsManager);
 const planes = renderer.clippingPlanes ?? [];
 material.clippingPlanes = planes;
 material.clipping = planes.length > 0;
 const prevTarget = renderer.getRenderTarget();
 const prevAutoClear = renderer.autoClear;
 const prevClearColor = renderer.getClearColor(new THREE.Color());
 const prevClearAlpha = renderer.getClearAlpha();
 const prevScissorTest = renderer.getScissorTest();
 renderer.setRenderTarget(this._renderTarget!);
 renderer.setClearColor(0, 0);
 renderer.autoClear = false;
 renderer.setScissorTest(false);
 renderer.clear(true, true, false);
 for (const [byte, modelId] of byteToModel) {
 const model = fragments.list.get(modelId);
 if (!model) continue;
 material.uniforms.modelByte.value = byte;
 renderer.render(model.object, camera);
 }
 renderer.setScissorTest(prevScissorTest);
 renderer.setRenderTarget(prevTarget);
 renderer.autoClear = prevAutoClear;
 renderer.setClearColor(prevClearColor, prevClearAlpha);
 }

Validations ✅

• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a repository issue and not a framework-specific issue. For example, if it's a THREE.js related bug, it should likely be reported to mrdoob/threejs instead.
• Check that this is a concrete bug. For Q&A join our Community.
• The provided reproduction is a minimal reproducible example of the bug.

[ShaMan123]

there are 2 separate bugs - submitting first PR

[ShaMan123]

updated bug report

[ShaMan123]

I am also wondering:
Why is the default scene being used instead of an offscreen scene? Then visibility checks could be dropped?
Or is it needed to mask object with other visuals to respect layering?

[ShaMan123]

Is it true that changing visibility kicks in the LOD logic? Could this be interfering here?

[ShaMan123]

@agviegas I can confirm the bug is fixed but I am interested about the topics I raised

[ShaMan123]

There seems to be another bug involved when setting up both Outliner and Hoverer - they interfere each other's hit testing

[agviegas]

Thanks for confirming. Answers below.

Why the world scene instead of an offscreen one: picks have to agree with what you see, so the pass inherits the same camera, the renderer's clipping planes, and the app's parenting. That last one matters because delta models are parented under other models, so a model's meshes aren't just its subtree. Hence the non-BIM hiding and per-model visibility toggling instead of a separate scene. Nothing is masked for layering; non-BIM meshes are hidden so they can't write into the id buffer.

Rendering each model.object directly, or a dedicated offscreen scene with the fragment roots, is a legitimate lighter design. The tradeoffs are keeping clipping and camera in sync and either reparenting per pick or maintaining a parallel graph. Worth considering, not a correctness issue.

Visibility and LOD: toggling mesh.visible doesn't kick in the LOD logic. LOD is per-item state computed in the virtual model and applied on core.update(); nothing observes the tile meshes' visible flag. The picker toggles and restores within one synchronous pass without calling update(), and only rasterizes tiles fragments already has visible.

Outliner and Hoverer interfering: couldn't reproduce. On 3.4.8 I ran the Outliner example with the Highlighter and Hoverer all on the same world, and hover and click both resolved correctly. Can you share your setup, and whether it shows as wrong-item picks or dead clicks? A repro on top of an example would help.

Closing the bug for now, feel free to open a new one with reproductions of anything you find. THanks!