| OLD | NEW |
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <script src="../../http/tests/inspector/inspector-test.js"></script> | 3 <script src="../../http/tests/inspector/inspector-test.js"></script> |
| 4 <script src="../../http/tests/inspector/elements-test.js"></script> | 4 <script src="../../http/tests/inspector/elements-test.js"></script> |
| 5 <script> | 5 <script> |
| 6 | 6 |
| 7 var player; | 7 var player; |
| 8 | 8 |
| 9 function startAnimationWithDelay() | 9 function startAnimationWithDelay() |
| 10 { | 10 { |
| 11 player = node.animate([{ width: "100px" }, { width: "200px" }], { duration:
200, delay: 100 }); | 11 player = node.animate([{ width: "100px" }, { width: "200px" }], { duration:
200, delay: 100 }); |
| 12 } | 12 } |
| 13 | 13 |
| 14 function startAnimationWithEndDelay() | 14 function startAnimationWithEndDelay() |
| 15 { | 15 { |
| 16 player = node.animate([{ width: "100px" }, { width: "200px" }], { duration:
20000, delay: 100, endDelay: 200 }); | 16 player = node.animate([{ width: "100px" }, { width: "200px" }], { duration:
20000, delay: 100, endDelay: 200 }); |
| 17 } | 17 } |
| 18 | 18 |
| 19 function cancelAnimation() | 19 function cancelAnimation() |
| 20 { | 20 { |
| 21 player.cancel(); | 21 player.cancel(); |
| 22 } | 22 } |
| 23 | 23 |
| 24 function startAnimationWithStepTiming() | 24 function startAnimationWithStepTiming() |
| 25 { | 25 { |
| 26 player = node.animate([{ width: "100px", easing: "step(5, end)" }, { width:
"200px", easing: "step-start" }], 200); | 26 player = node.animate([{ width: "100px", easing: "step(5, end)" }, { width:
"200px", easing: "step-start" }], 200); |
| 27 } | 27 } |
| 28 | 28 |
| 29 var initialize_Animations = function() { |
| 30 |
| 31 InspectorTest.preloadModule("animation"); |
| 32 } |
| 33 |
| 29 function test() | 34 function test() |
| 30 { | 35 { |
| 31 InspectorTest.selectNodeWithId("node", step1); | 36 InspectorTest.selectNodeWithId("node", step1); |
| 32 var timeline = new WebInspector.AnimationTimeline(); | 37 var timeline = new WebInspector.AnimationTimeline(); |
| 33 var elementsPanel = WebInspector.ElementsPanel.instance(); | 38 var elementsPanel = WebInspector.ElementsPanel.instance(); |
| 34 elementsPanel.setWidgetBelowDOM(timeline); | 39 elementsPanel.setWidgetBelowDOM(timeline); |
| 35 // Override timeline width for testing | 40 // Override timeline width for testing |
| 36 WebInspector.AnimationTimeline.prototype.width = function() { return 1000; } | 41 WebInspector.AnimationTimeline.prototype.width = function() { return 1000; } |
| 37 // Override animation color for testing | 42 // Override animation color for testing |
| 38 // FIXME: Set animation name of Web Animation instead; not supported yet | 43 // FIXME: Set animation name of Web Animation instead; not supported yet |
| (...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 85 | 90 |
| 86 <body onload="runTest()"> | 91 <body onload="runTest()"> |
| 87 <p> | 92 <p> |
| 88 Tests the display of animations on the animation timeline. | 93 Tests the display of animations on the animation timeline. |
| 89 </p> | 94 </p> |
| 90 | 95 |
| 91 <div id="node" style="background-color: red; height: 100px"></div> | 96 <div id="node" style="background-color: red; height: 100px"></div> |
| 92 | 97 |
| 93 </body> | 98 </body> |
| 94 </html> | 99 </html> |
| OLD | NEW |