Custom ShaderMaterial map issue - three.js

Question

I am trying to create a custom ShaderMaterial reusing the ShaderChunks but seem to have a problem when setting the map parameter.
In my custom shader, when I load a texture and set the materials map and uniforms.map.value value to the texture it does not get the values from the texture in my shader, though it does seem to set the USE_MAP definition.
HERE is a fiddle
In the shader, it turns green if USE_MAP is defined, but it should also get the map value.
Am I missing something simple?
Below are the important bits :)
Set up the shader
var shaderUniforms = THREE.UniformsUtils.merge([THREE.UniformsLib[ "common" ]]);
var shaderVertex = [
//THREE.ShaderChunk[ "common" ],
THREE.ShaderChunk[ "uv_pars_vertex" ],
"void main() {",
THREE.ShaderChunk[ "begin_vertex" ],
THREE.ShaderChunk[ "project_vertex" ],
"}",
].join("\n");
var shaderFragment = [
THREE.ShaderChunk[ "common" ],
THREE.ShaderChunk[ "uv_pars_fragment" ],
THREE.ShaderChunk[ "map_pars_fragment" ],
"void main() {",
"vec4 diffuseColor = vec4(1.0, 0.0, 0.0, 1.0);",
"#ifdef USE_MAP",
' diffuseColor = vec4(0.0, 1.0, 0.0, 1.0);',
'#endif',
THREE.ShaderChunk[ "map_fragment" ],
"gl_FragColor = diffuseColor;",
"}",
].join("\n");
Create the material
material = new THREE.ShaderMaterial({
uniforms: shaderUniforms,
vertexShader: shaderVertex,
fragmentShader: shaderFragment
});
Add the texture
function loadTexture() {
var loader = new THREE.TextureLoader();
loader.load(dataurl, function(texture){
console.log('texture loaded ok');
// What to do here to add texture (map) and update ShaderMaterial?
// Do I have to set needsUpdate on the texture?
texture.needsUpdate = true;
// Do I have to set needsUpdate on the material?
material.needsUpdate = true;
// Seems I have to set both the uniform map value and the material map value...
material.uniforms.map.value = texture;
material.map = texture;
// But still does not show the texture, though USE_MAP does seem to get defined in the shader (color changes to green).
// Hmmmm
});
}