<style>
div#test { position: absolute; top: 0; left: 0; color: green; border: 50px solid; width: 0; transition-duration: 1ms; }
div#test.orange { border-color: orange; }
</style>
<div style="position: relative; background-color: red; width: 100px; height: 100px;">
<div id="test" class="orange"></div>
</div>
<script>
if (window.testRunner)
testRunner.waitUntilDone();
// Force a layout so that changing the classname below causes an animation.
document.body.offsetHeight;
document.getElementById("test").addEventListener('transitionend', function() {
if (window.testRunner)
setTimeout("testRunner.notifyDone()", 0);
}, false);
document.getElementById("test").className = "";
</script>