<html>
<head>
  <title>Testing repeated firing of background-color transition</title>
  <style type="text/css" media="screen">
    div {
        -webkit-transition: background-color .15s linear;
    }
    div.trans {
        background-color: hsla(0, 50%, 50%, 1);
    }
  </style>
  <script type="text/javascript" charset="utf-8">
    function checkRunning()
    {
      var current = layoutTestController.numberOfActiveAnimations();
      if (current == 0)
        document.getElementById('result').innerHTML = "Number of active transitions is (0) as expected";
      else
        document.getElementById('result').innerHTML = "Number of active transitions is (" + current + ") but was expecting (0)";
      layoutTestController.notifyDone();
    }
    
    if (window.layoutTestController) {
        layoutTestController.dumpAsText();
        layoutTestController.waitUntilDone();
        window.setTimeout(checkRunning, 300);            
    }
  </script>
</head>
<body>

<div id="foo">This should not be continually firing transitions</span>

<script type="text/javascript" charset="utf-8">
    document.getElementById("foo").className="trans";
</script>

<div id="result">
</div>
</body>
</html>