LayoutTests/inspector/elements/animation-timeline.html - Issue 980053006: Revert of Devtools Animations: Represent delay and end-delay on the animation timeline

Side by Side Diff

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Keyboard Shortcuts

	File
u :	up to issue
j / k :	jump to file after / before current file
J / K :	jump to next file with a comment after / before current file
	Side-by-side diff
i :	toggle intra-line diffs
e :	expand all comments
c :	collapse all comments
s :	toggle showing all comments
n / p :	next / previous diff chunk or comment
N / P :	next / previous comment
<Up> / <Down> :	next / previous line

	Issue
u :	up to list of issues
j / k :	jump to patch after / before current patch
o / <Enter> :	open current patch in side-by-side view
i :	open current patch in unified diff view

	Issue List
j / k :	jump to issue after / before current issue
o / <Enter> :	open current issue

Side by Side Diff: LayoutTests/inspector/elements/animation-timeline.html

Issue 980053006: Revert of Devtools Animations: Represent delay and end-delay on the animation timeline (Closed) Base URL: svn://svn.chromium.org/blink/trunk

Patch Set: Created 5 years, 9 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch | Annotate | Revision Log

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: 300, delay: 100 });

10 }

11

12 function startAnimationWithEndDelay()

13 {

14 node.animate([{ width: "100px" }, { width: "200px" }], { duration: 300, 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