LayoutTests/animations/keyframes-invalid-keys.html - Issue 13871007: Add CSS parser recovery from errors while parsing @-webkit-keyframes key values.

Side by Side Diff: LayoutTests/animations/keyframes-invalid-keys.html

Issue 13871007: Add CSS parser recovery from errors while parsing @-webkit-keyframes key values. (Closed) Base URL: svn://svn.chromium.org/blink/trunk

Patch Set: Brought the behavior closer to the spec, added another test Created 7 years, 8 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
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"	1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

2 "http://www.w3.org/TR/html4/loose.dtd">	2 "http://www.w3.org/TR/html4/loose.dtd">

3	3

4 <html lang="en">	4 <html lang="en">

5 <head>	5 <head>

6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">	6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

7 <title>Keyframes test</title>	7 <title>Keyframes with invalid keys</title>

8 <style type="text/css" media="screen">	8 <style type="text/css" media="screen">

	9 @-webkit-keyframes "anim" {

	10 0, from { left: 100px; }

	11 fromto { left: 100px; }

	12 50% { left: 3px; }

	13 60%, unknown { left: 100px; }

	14 100 { left: 100px; }

	15 }

9 #box {	16 #box {

10 position: absolute;	17 position: absolute;

11 left: 0;	18 left: 3px;

12 top: 100px;	19 top: 100px;

13 height: 100px;	20 height: 100px;

14 width: 100px;	21 width: 100px;

15 background-color: blue;	22 background-color: blue;

16 -webkit-animation-duration: 1s;	23 -webkit-animation-duration: 1s;

17 -webkit-animation-timing-function: linear;	24 -webkit-animation-timing-function: linear;

18 -webkit-animation-name: "anim";	25 -webkit-animation-name: "anim";

19 }	26 }

20 @-webkit-keyframes "anim" {	27

21 from { left: 50px; }

22 20% { left: 100px; }

23 40% { left: 100px; }

24 60% { left: 200px; }

25 80% { left: 200px; }

26 to { left: 300px; }

27 }

28 </style>	28 </style>

29 <script src="resources/animation-test-helpers.js" type="text/javascript" cha rset="utf-8"></script>	29 <script src="resources/animation-test-helpers.js" type="text/javascript" cha rset="utf-8"></script>

30 <script type="text/javascript" charset="utf-8">	30 <script type="text/javascript" charset="utf-8">

31	31

32 const expectedValues = [	32 const expectedValues = [

33 // [animation-name, time, element-id, property, expected-value, tolerance]	33 // [animation-name, time, element-id, property, expected-value, tolerance]

34 ["anim", 0.3, "box", "left", 100, 1],	34 ["anim", 0.2, "box", "left", 3, 1],

35 ["anim", 0.7, "box", "left", 200, 1],	35 ["anim", 0.8, "box", "left", 3, 1],

36 ];	36 ];

37	37

38 runAnimationTest(expectedValues);	38 runAnimationTest(expectedValues);

39	39

40 </script>	40 </script>

41 </head>	41 </head>

42 <body>	42 <body>

43 This test performs an animation of the left property. It should stop for 100ms a t 100px and 200px	43 This test performs an animation of the left property. It should always remain 3p x, unless there are

44 We test for those values 50ms after it has stopped at each position.	44 errors during parsing, resulting in other values in keyframes with bad keys.

	45 Four of the keyframes contain invalid keys, and should be discarded altogether

	46 ("If a keyframe selector specifies negative percentage values or values higher t han 100%, then the keyframe will be ignored", see <a href="http://www.w3.org/TR/ css3-animations/#keyframes">http://www.w3.org/TR/css3-animations/#keyframes</a>) .

45 <div id="box">	47 <div id="box">

46 </div>	48 </div>

47 <div id="result">	49 <div id="result">

48 </div>	50 </div>

49 </body>	51 </body>

50 </html>	52 </html>

OLD	NEW

« no previous file with comments | « no previous file | LayoutTests/animations/keyframes-invalid-keys-expected.txt » ('j') | Source/WebCore/css/CSSGrammar.y.in » ('J')