title: <a-animation> not working in aframe 0.9.2
body: <p>I try to change the radius of a nested child element with animation. My code looks like this:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;a-sphere id="outer-sphere" radius="0.6" material="color:white;opacity: 0.6"&gt;
      &lt;a-sphere id="inner-sphere" radius="0.1" material="color:red; opacity: 0.6"&gt;
          &lt;a-animation property="radius" from="0.1" to="0.6" begin="fillSphere"&gt;&lt;/a-animation&gt;
      &lt;/a-sphere&gt;
  &lt;/a-sphere&gt;
  </code></pre>
  
  <p>in my react code I catch the mouseOver event from the parent</p>
  
  <pre class="lang-js prettyprint-override"><code>const onMouseEnter = (e) =&gt; {
     const innerSphere = e.target.querySelector('#inner-sphere');
     innerSphere.emit("fillSphere");
  }
  </code></pre>
  
  <p>but nothing happens. Or is there another way to animate a child entity. For example with the Aframe animation attribute. I could not find anything in the A-Frame documentation.</p>
  
  <p>I use A-Frame in Version 0.9.2</p>