<!DOCTYPE HTML>
<html>
<script>
function runTest() {
  if (window.testRunner)
    testRunner.waitUntilDone();

  // The animation is already in a pending state, change it to another
  // pending id (newId), then make the new id valid and check that
  // the animation runs.
  var rect = document.getElementById('rect');
  var animate = document.getElementById('set');
  animate.setAttributeNS("http://www.w3.org/1999/xlink", "href", "#newId");
  rect.setAttribute('id', 'newId');

  // Defer to allow animations to run.
  setTimeout(function() {
    if (window.testRunner)
      testRunner.notifyDone();
  }, 0);
}
</script>
<body onload="runTest()">
<p id="description">Test that an animation with a pending resource can be changed to a second pending resource, then resolved correctly.</p>
<svg id="svg" width="300" height="300">
  <!-- This red square should be covered up if we pass. -->
  <rect x="0" y="0" width="100" height="100" fill="red"/>

  <!-- This green square should end up covering the red square if we pass. -->
  <rect id="rect" x="-100" y="0" width="100" height="100" fill="green"/>
  <set id="set" xlink:href="#doesNotExist" attributeName="x" to="0" />
</svg>
</body>
</html>