ThreeJS get uniform values for running material - three.js

Question

I added an object with a MeshPhongMaterial to my scene. I want to spy on the uniforms that Three is setting on the object. I thought it would be as simple as obj.uniforms.uniformName, but that doesn't actually exist. Is there a simple way to get the runtime uniforms Three is setting?
What I'm after is the uniform names and their values.
The method I came up with requires a double loop. The only thing I can see on a running material that's useful is material.uniformsList which is a list of WebGLUniformLocations and values, but no names. There is also material.program.uniforms which is a key value store of names to WebGLUniformLocations. It seems like you can zip the two together to get a uniform list, but is there a better way?
let builtUniforms = {};
// For every uniform in the array, look for its location in the program
// uniforms to get the name
for( x = 0; uniform = object.material.uniformsList[ x++ ]; ) {
// uniform is [ { type, value }, WebGLUniformLocation ] but no name :(
for( uniformName in object.material.program.uniforms ) {
// If the WebGLUniformLocations match up, we've found the name
if( object.material.program.uniforms[ uniformName ] === uniform[ 1 ] ) {
builtUniforms[ uniformName ] = {
value: uniform[ 0 ].value,
name: uniformName
};
break;
}
}
}
Is there a more straightforward way to get the uniform names and values from a Three.Material?
Will the uniformsList or program.uniforms ever change? Do I need to build this object once per render loop, or can I build it once and resuse it?

Answer 1

Three stores the key value store you're looking for in material.__webglShader.uniforms
Also look in THREE.UniformsLib
and also THREE.ShaderLib - e.g. THREE.ShaderLib.phong
these contain the templates for built-in uniforms and also the shaders, like MeshPhongMaterial, which use them.