| Index: LayoutTests/animations/negative-delay-events.html
|
| diff --git a/LayoutTests/animations/negative-delay-events.html b/LayoutTests/animations/negative-delay-events.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..f13414c34ca6ed5cf2012239c0d647eb412ac4df
|
| --- /dev/null
|
| +++ b/LayoutTests/animations/negative-delay-events.html
|
| @@ -0,0 +1,68 @@
|
| +<!DOCTYPE html>
|
| +
|
| +<html>
|
| +<head>
|
| + <style type="text/css">
|
| + .box {
|
| + position: relative;
|
| + height: 25px;
|
| + width: 25px;
|
| + background-color: blue;
|
| + margin: 10px;
|
| + }
|
| + .animation {
|
| + -webkit-animation-duration: 0.1s;
|
| + -webkit-animation-name: "animation";
|
| + }
|
| + #animation1 {
|
| + -webkit-animation-delay: 0.05s;
|
| + }
|
| + #animation2 {
|
| + -webkit-animation-delay: -0.05s;
|
| + }
|
| + #animation3 {
|
| + -webkit-animation-delay: -0.15s;
|
| + }
|
| + @-webkit-keyframes "animation" {
|
| + from { left: 0; }
|
| + to { left: 500px; }
|
| + }
|
| + </style>
|
| + <script type="text/javascript">
|
| + if (window.testRunner) {
|
| + testRunner.dumpAsText();
|
| + testRunner.waitUntilDone();
|
| + }
|
| + function log(text) {
|
| + var div = document.createElement('div');
|
| + div.innerText = text;
|
| + document.getElementById('log').appendChild(div);
|
| + }
|
| + document.addEventListener('webkitAnimationStart', function(event) {
|
| + log(event.target.id + ': Start event: elapsedTime=' + event.elapsedTime);
|
| + }, false);
|
| + var count = 0;
|
| + document.addEventListener('webkitAnimationEnd', function(event) {
|
| + log(event.target.id + ': End event: elapsedTime=' + event.elapsedTime);
|
| + switch (++count) {
|
| + case 1:
|
| + document.getElementById('animation2').classList.add('animation');
|
| + break;
|
| + case 2:
|
| + document.getElementById('animation3').classList.add('animation');
|
| + break;
|
| + case 3:
|
| + if (window.testRunner)
|
| + testRunner.notifyDone();
|
| + }
|
| + }, false);
|
| + </script>
|
| +</head>
|
| +<body>
|
| + <p>Tests animation events with a negative delay.
|
| + <div id="animation1" class="box animation"></div>
|
| + <div id="animation2" class="box"></div>
|
| + <div id="animation3" class="box"></div>
|
| + <div id="log"></div>
|
| +</body>
|
| +</html>
|
|
|