Group Sequence Not Working in Chrome

[jonahbron]

I have a very simple parallel animation group nested in a sequential animation group. This configuration works fine in Firefox. But when I test it in Chrome, it does not work correctly. Instead, the inner parallel group runs at the same time as the first animation, then runs a second time in parallel with the second animation. I've commented the sequence here:

<core-animation-group id="transition" type="seq">
  <!-- Runs in parallel with group at end -->
  <core-animation duration="500" fill="both" target="{{ $.loginForm }}">
    <core-animation-keyframe>
      <core-animation-prop name="opacity" value="1"></core-animation-prop>
    </core-animation-keyframe>
    <core-animation-keyframe>
      <core-animation-prop name="opacity" value="0"></core-animation-prop>
    </core-animation-keyframe>
  </core-animation>

  <!-- Doesn't seem to run at all -->
  <core-animation duration="500" fill="both" target="{{ $.profile }}">
    <core-animation-keyframe>
      <core-animation-prop name="opacity" value="0"></core-animation-prop>
    </core-animation-keyframe>
    <core-animation-keyframe>
      <core-animation-prop name="opacity" value="1"></core-animation-prop>
    </core-animation-keyframe>
  </core-animation>

  <!-- Runs in parallel with first animation, and then reverts and runs again a second time -->
  <core-animation-group type="par">

    <core-animation id="occupyTop" duration="500" fill="none" target="{{ $.overlay }}" easing="ease"></core-animation>

    <core-animation duration="500" fill="none" target="{{ $.overlayShadow }}" easing="ease">
      <core-animation-keyframe>
        <core-animation-prop name="marginTop" value="20"></core-animation-prop>
        <core-animation-prop name="marginLeft" value="20"></core-animation-prop>
        <core-animation-prop name="marginRight" value="20"></core-animation-prop>
      </core-animation-keyframe>
      <core-animation-keyframe>
        <core-animation-prop name="marginTop" value="0"></core-animation-prop>
        <core-animation-prop name="marginLeft" value="0"></core-animation-prop>
        <core-animation-prop name="marginRight" value="0"></core-animation-prop>
      </core-animation-keyframe>
    </core-animation>

  </core-animation-group>
</core-animation-group>