Index: LayoutTests/inspector/elements/animation-timeline.html |
diff --git a/LayoutTests/inspector/elements/animation-timeline.html b/LayoutTests/inspector/elements/animation-timeline.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..a314a29aca2b7a81c514256f7c4ae3c5e8b1630b |
--- /dev/null |
+++ b/LayoutTests/inspector/elements/animation-timeline.html |
@@ -0,0 +1,45 @@ |
+<html> |
+<head> |
+<script src="../../http/tests/inspector/inspector-test.js"></script> |
+<script src="../../http/tests/inspector/elements-test.js"></script> |
+<script> |
+function documentClickHandler(event) { console.log("click - document - attribute"); } |
+ |
+function test() |
+{ |
+ InspectorTest.selectNodeWithId("node", animationStartDelay); |
+ var sidebarPane = WebInspector.panels.elements.sidebarPanes.animations; |
+ // Override timeline width for testing |
+ WebInspector.AnimationTimeline.prototype.width = function() { return 500; } |
+ |
+ function animationStartDelay() |
+ { |
+ var animation = {"id":"9","pausedState":false,"playState":"running","playbackRate":1,"startTime":1013.51700001396,"currentTime":16.6666667209938,"source":{"delay":250,"endDelay":0,"playbackRate":1,"iterationStart":0,"iterations":1,"duration":1000,"direction":"normal","fill":"none","name":"","backendNodeId":1,"easing":"linear","keyframesRule":{"keyframes":[{"offset":"0%","style":{"cssProperties":[{"name":"transform","value":"translateX(0px)"}],"shorthandEntries":[]},"easing":"linear"},{"offset":"100%","style":{"cssProperties":[{"name":"transform","value":"translateX(100px)"}],"shorthandEntries":[]},"easing":"linear"}]}},"type":"WebAnimation"}; |
pfeldman
2015/03/03 12:44:15
Why is this information not coming from the backen
samli
2015/03/03 21:13:32
I couldn't figure a way to reliably trigger an ani
pfeldman
2015/03/04 12:54:03
I am sure you can kick the animation programmatica
|
+ var player = WebInspector.AnimationModel.AnimationPlayer.parsePayload(WebInspector.targetManager.mainTarget(), animation); |
+ player.source().nodeId = sidebarPane.node().id; |
+ sidebarPane._timeline.addAnimation(player, true); |
+ InspectorTest.dumpAnimationTimeline(animationBothDelay); |
+ } |
+ |
+ function animationBothDelay() |
+ { |
+ var animation = {"id":"2","pausedState":false,"playState":"running","playbackRate":1,"startTime":1167.00433334336,"currentTime":0,"source":{"delay":300,"endDelay":100,"playbackRate":1,"iterationStart":0,"iterations":1,"duration":250,"direction":"normal","fill":"none","name":"","backendNodeId":8,"easing":"linear","keyframesRule":{"keyframes":[{"offset":"0%","style":{"cssProperties":[{"name":"width","value":"100px"}],"shorthandEntries":[]},"easing":"linear"},{"offset":"100%","style":{"cssProperties":[{"name":"width","value":"700px"}],"shorthandEntries":[]},"easing":"linear"}]}},"type":"WebAnimation"}; |
+ var player = WebInspector.AnimationModel.AnimationPlayer.parsePayload(WebInspector.targetManager.mainTarget(), animation); |
+ player.source().nodeId = sidebarPane.node().id; |
+ sidebarPane._timeline.addAnimation(player, true); |
+ InspectorTest.dumpAnimationTimeline(InspectorTest.completeTest); |
+ } |
+} |
+ |
+</script> |
+</head> |
+ |
+<body onload="runtest()"> |
+<p> |
+Tests the display of animations on the animation timeline. |
+</p> |
+ |
+<div id="node"></div> |
+ |
+</body> |
+</html> |