Set the image cache when img is loaded

Author: vincentfretin

src/core/a-assets.js

@@ -41,12 +41,15 @@ class AAssets extends ANode {
       loaded.push(new Promise(function (resolve, reject) {
         // Set in cache because we won't be needing to call three.js loader if we have.
         // a loaded media element.
-        THREE.Cache.add('image:' + imgEls[i].getAttribute('src'), imgEl);
         if (imgEl.complete) {
+          THREE.Cache.add('image:' + imgEls[i].getAttribute('src'), imgEl);
           resolve();
           return;
         }
-        imgEl.onload = resolve;
+        imgEl.onload = function () {
+          THREE.Cache.add('image:' + imgEls[i].getAttribute('src'), imgEl);
+          resolve();
+        };
         imgEl.onerror = reject;
       }));
     }

tests/components/material.test.js

@@ -176,16 +176,20 @@ suite('material', function () {
       THREE.Cache.clear();
       assetsEl.appendChild(img);
       el.sceneEl.appendChild(assetsEl);
-      // Adding the asset will add image:${IMG_SRC} in THREE.Cache
-      // without going through THREE.ImageLoader
+      // Adding the asset will add image:${IMG_SRC} in THREE.Cache when the img
+      // loading is complete with img.onload, without going through THREE.ImageLoader
+      assert.notOk(!!THREE.Cache.get(`image:${IMG_SRC}`));
       el.addEventListener('materialtextureloaded', function () {
         assert.notOk(imageLoaderSpy.called);
         assert.notOk(textureLoaderSpy.called);
-        assert.equal(THREE.Cache.get(`image:${IMG_SRC}`), img);
-        THREE.Cache.clear();
         THREE.ImageLoader.prototype.load.restore();
         THREE.TextureLoader.prototype.load.restore();
-        done();
+        // load event is triggered after this materialtextureloaded callback
+        img.addEventListener('load', function () {
+          assert.equal(THREE.Cache.get(`image:${IMG_SRC}`), img);
+          THREE.Cache.clear();
+          done();
+        }, {once: true});
       });
       el.setAttribute('material', 'src', '#foo');
     });