Description

The Probe Lighting type (e.g., <a-light type="probe"></a-light>) fails to properly load necessary cubemaps and (silently) errors out resulting in no lighting contribution to the seen. This issue affects A-Frame versions 1.6.0 and higher.

Images

Probe Lighting in A-Frame 1.5.0 (Expected)

Probe Lighting in A-Frame 1.60-1.7.1 (Bug)

Glitch Code Examples

• Glitch | Code

• Glitch | Live Site

Errors

Code Example Console Error

GET https://silicon-periwinkle-eggplant.glitch.me/[object%20HTMLImageElement] 404 (Not Found) [object%20HTMLImageElement]:1

Three.js Loading Manager Error

Three.js loading manager reports the following console error when setup to provide verbose file loading information. The error seems to occur when the THREE.LightProbeGenerator() attempts to load the requisite cubemaps.

Error loading: [object HTMLImageElement].

One might expect instead of returning [object HTMLImageElement] that it returns the image URL instead.

Analysis

I believe this breaking change may have been introduced in A-Frame 1.6.0 with this commit:

Move envMap loading into material utils and system

Prior to 1.6.0 the A-Frame cubemap loader could only return image URLS. From 1.6.0 forward it can return image URLs and HTMLImageElements.

I believe the core issue is that passing the object type HTMLImageElement is incompatible with the Three.js LightProbeGenerator (it expects image URLs) and so the lightprobe silently errors out and never contributes to the scene lighting.

It's also possible that the HTMLImageElement is incompatible with the Three.js FileLoader and/or CubeTextureLoader so it's worth considering if the issue is occuring at that level.