OLD | NEW |
(Empty) | |
| 1 <html> |
| 2 <head> |
| 3 <script src="../../http/tests/inspector/inspector-test.js"></script> |
| 4 <script src="../../http/tests/inspector/elements-test.js"></script> |
| 5 <script> |
| 6 |
| 7 function startAnimationWithDelay() |
| 8 { |
| 9 var player = node.animate([{ width: "100px" }, { width: "200px" }], { durati
on: 200, delay: 100 }); |
| 10 } |
| 11 |
| 12 function startAnimationWithEndDelay() |
| 13 { |
| 14 node.animate([{ width: "100px" }, { width: "200px" }], { duration: 200, dela
y: 100, endDelay: 200 }); |
| 15 } |
| 16 |
| 17 function test() |
| 18 { |
| 19 InspectorTest.selectNodeWithId("node", step1); |
| 20 // Ensure the timeline is set up |
| 21 var sidebarPane = WebInspector.panels.elements.sidebarPanes.animations; |
| 22 sidebarPane.expand(); |
| 23 InspectorTest.animationModel.ensureEnabled(); |
| 24 // Override timeline width for testing |
| 25 WebInspector.AnimationTimeline.prototype.width = function() { return 500; } |
| 26 |
| 27 function step1() |
| 28 { |
| 29 InspectorTest.waitForAnimationAdded(step2); |
| 30 InspectorTest.evaluateInPage("startAnimationWithDelay()"); |
| 31 } |
| 32 |
| 33 function step2() |
| 34 { |
| 35 InspectorTest.addResult(">>>> Animation with start delay only"); |
| 36 InspectorTest.dumpAnimationTimeline(); |
| 37 sidebarPane._timeline._reset(); |
| 38 InspectorTest.waitForAnimationAdded(step3); |
| 39 InspectorTest.evaluateInPage("startAnimationWithEndDelay()"); |
| 40 } |
| 41 |
| 42 function step3() |
| 43 { |
| 44 InspectorTest.addResult(">>>> Animation with start and end delay"); |
| 45 InspectorTest.dumpAnimationTimeline(); |
| 46 InspectorTest.completeTest(); |
| 47 } |
| 48 } |
| 49 |
| 50 </script> |
| 51 </head> |
| 52 |
| 53 <body onload="runTest()"> |
| 54 <p> |
| 55 Tests the display of animations on the animation timeline. |
| 56 </p> |
| 57 |
| 58 <div id="node" style="background-color: red; height: 100px"></div> |
| 59 |
| 60 </body> |
| 61 </html> |
OLD | NEW |