Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(401)

Side by Side Diff: LayoutTests/animations/interpolation/svg-cx-interpolation.html

Issue 1265873002: Add test coverage for interpolations using CSS wide keywords and neutral keyframes (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Rebased Created 5 years, 4 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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <meta charset="UTF-8"> 2 <meta charset="UTF-8">
3 <style> 3 <style>
4 svg { 4 .parent {
5 cx: 100px; 5 cx: 100px;
6 } 6 }
7 .target { 7 .target {
8 stroke: black;
9 font-size: 16px; 8 font-size: 16px;
9 cx: 50px;
10 } 10 }
11 .expected { 11 .expected {
12 stroke: green; 12 fill: green;
13 } 13 }
14 </style> 14 </style>
15 <body> 15 <body>
16 <template id="target-template"> 16 <template id="target-template">
17 <svg height="200" width="10"> 17 <svg height="20" width="400">
18 <circle cx="50%" cy="50%" r="25%" class="target"> 18 <circle cx="50%" cy="50%" r="10" class="target">
19 </svg> 19 </svg>
20 </template> 20 </template>
21 <script src="resources/interpolation-test.js"></script> 21 <script src="resources/interpolation-test.js"></script>
22 <script> 22 <script>
23 assertInterpolation({ 23 assertInterpolation({
24 property: 'cx', 24 property: 'cx',
25 from: '',
26 to: '20px',
27 }, [
28 {at: -0.25, is: '57.5px'},
29 {at: 0, is: '50px'},
30 {at: 0.25, is: '42.5px'},
31 {at: 0.5, is: '35px'},
32 {at: 0.75, is: '27.5px'},
33 {at: 1, is: '20px'},
34 {at: 1.25, is: '12.5px'},
35 ]);
36
37 assertInterpolation({
38 property: 'cx',
39 from: 'initial',
40 to: '20px',
41 }, [
42 {at: -0.25, is: '-5px'},
43 {at: 0, is: '0px'},
44 {at: 0.25, is: '5px'},
45 {at: 0.5, is: '10px'},
46 {at: 0.75, is: '15px'},
47 {at: 1, is: '20px'},
48 {at: 1.25, is: '25px'},
49 ]);
50
51 assertInterpolation({
52 property: 'cx',
53 from: 'inherit',
54 to: '20px',
55 }, [
56 {at: -0.25, is: '120px'},
57 {at: 0, is: '100px'},
58 {at: 0.25, is: '80px'},
59 {at: 0.5, is: '60px'},
60 {at: 0.75, is: '40px'},
61 {at: 1, is: '20px'},
62 {at: 1.25, is: '0px'},
63 ]);
64
65 assertInterpolation({
66 property: 'cx',
67 from: 'unset',
68 to: '20px',
69 }, [
70 {at: -0.25, is: '-5px'},
71 {at: 0, is: '0px'},
72 {at: 0.25, is: '5px'},
73 {at: 0.5, is: '10px'},
74 {at: 0.75, is: '15px'},
75 {at: 1, is: '20px'},
76 {at: 1.25, is: '25px'},
77 ]);
78
79 assertInterpolation({
80 property: 'cx',
25 from: '-10px', 81 from: '-10px',
26 to: '10px' 82 to: '10px',
27 }, [ 83 }, [
28 {at: -0.25, is: '-15px'}, 84 {at: -0.25, is: '-15px'},
29 {at: 0, is: '-10px'}, 85 {at: 0, is: '-10px'},
30 {at: 0.25, is: '-5px'}, 86 {at: 0.25, is: '-5px'},
31 {at: 0.5, is: '0px'}, 87 {at: 0.5, is: '0px'},
32 {at: 0.75, is: '5px'}, 88 {at: 0.75, is: '5px'},
33 {at: 1, is: '10px'}, 89 {at: 1, is: '10px'},
34 {at: 1.25, is: '15px'}, 90 {at: 1.25, is: '15px'},
35 ]); 91 ]);
92
36 assertInterpolation({ 93 assertInterpolation({
37 property: 'cx', 94 property: 'cx',
38 from: '-20px', 95 from: '-20px',
39 to: '30em' 96 to: '30em',
40 }, [ 97 }, [
41 {at: -0.25, is: '-145px'}, 98 {at: -0.25, is: '-145px'},
42 {at: 0, is: '-20px'}, 99 {at: 0, is: '-20px'},
43 {at: 0.25, is: '105px'}, 100 {at: 0.25, is: '105px'},
44 {at: 0.5, is: '230px'}, 101 {at: 0.5, is: '230px'},
45 {at: 0.75, is: '355px'}, 102 {at: 0.75, is: '355px'},
46 {at: 1, is: '30em'}, 103 {at: 1, is: '30em'},
47 {at: 1.25, is: '605px'}, 104 {at: 1.25, is: '605px'},
48 ]); 105 ]);
49 assertInterpolation({ 106
50 property: 'cx',
51 from: 'inherit',
52 to: '140px'
53 }, [
54 {at: -0.25, is: '90px'},
55 {at: 0, is: '100px'},
56 {at: 0.25, is: '110px'},
57 {at: 0.5, is: '120px'},
58 {at: 0.75, is: '130px'},
59 {at: 1, is: '140px'},
60 {at: 1.25, is: '150px'},
61 ]);
62 assertInterpolation({ 107 assertInterpolation({
63 property: 'cx', 108 property: 'cx',
64 from: '-10', 109 from: '-10',
65 to: '10' 110 to: '10',
66 }, [ 111 }, [
67 {at: -0.25, is: '-15'}, 112 {at: -0.25, is: '-15'},
68 {at: 0, is: '-10'}, 113 {at: 0, is: '-10'},
69 {at: 0.25, is: '-5'}, 114 {at: 0.25, is: '-5'},
70 {at: 0.5, is: '0'}, 115 {at: 0.5, is: '0'},
71 {at: 0.75, is: '5'}, 116 {at: 0.75, is: '5'},
72 {at: 1, is: '10'}, 117 {at: 1, is: '10'},
73 {at: 1.25, is: '15'}, 118 {at: 1.25, is: '15'},
74 ]); 119 ]);
75 </script> 120 </script>
76 </body> 121 </body>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698