have mixinUpdate wait for entity to load first

src/core/a-entity.js

@@ -599,6 +599,14 @@ var proto = Object.create(ANode.prototype, {
         var mixinEl;
         var mixinIds;
         var i;
+        var self = this;
+
+        if (!this.hasLoaded) {
+          this.addEventListener('loaded', function () {
+            self.mixinUpdate(newMixins, oldMixins);
+          });
+          return;
+        }
 
         oldMixins = oldMixins || this.getAttribute('mixin');
         mixinIds = this.updateMixins(newMixins, oldMixins);
@@ -627,7 +635,7 @@ var proto = Object.create(ANode.prototype, {
           for (component in mixinEl.componentCache) {
             if (componentsUpdated.indexOf(component) === -1) {
               if (this.components[component]) {
-                // Compoennt removed. Rebuild data if not yet rebuilt.
+                // Component removed. Rebuild data if not yet rebuilt.
                 this.components[component].handleMixinUpdate();
               }
             }

tests/core/a-entity.test.js

@@ -1290,6 +1290,40 @@ suite('a-entity', function () {
       assert.shallowDeepEqual(el.getAttribute('position'), {x: 0, y: 0, z: 0});
       assert.equal(el.mixinEls.length, 0);
     });
+
+    /**
+     * Fixed a weird case where attributeChangedCallback on mixin was fired during scene init.
+     * That fired mixinUpdate before the entity was loaded (and el.sceneEl was undefined).
+     * And tried to update components before the entity was ready.
+     * This test mimics that state where mixinUpdate called when entity not fully loaded but
+     * component is still initializing.
+     */
+    test('wait for entity to load on mixin update', function (done) {
+      const TestComponent = AFRAME.registerComponent('test', {
+        update: function () {
+          assert.ok(this.el.sceneEl);
+          done();
+        }
+      });
+
+      elFactory().then(someEl => {
+        const sceneEl = someEl.sceneEl;
+
+        const mixin = document.createElement('a-mixin');
+        mixin.setAttribute('id', 'foo');
+        mixin.setAttribute('test', '');
+        sceneEl.appendChild(mixin);
+
+        setTimeout(() => {
+          const el = document.createElement('a-entity');
+          el.setAttribute('mixin', 'foo');
+          el.components.test = new TestComponent(el, {}, '');
+          el.components.test.oldData = 'foo';
+          el.mixinUpdate('foo');
+          sceneEl.appendChild(el);
+        });
+      });
+    });
   });
 });