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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/animations/interpolation/line-height-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
« no previous file with comments | « LayoutTests/animations/interpolation/letter-spacing-interpolation.html ('k') | LayoutTests/animations/interpolation/margin-interpolation.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <meta charset="UTF-8"> 2 <meta charset="UTF-8">
3 <style> 3 <style>
4 .parent {
5 line-height: 30px;
6 }
4 .target { 7 .target {
5 display: inline-block; 8 display: inline-block;
6 font: 20px sans-serif; 9 font: 20px sans-serif;
10 line-height: 10px;
7 } 11 }
8 .expected { 12 .expected {
9 color: green; 13 color: green;
10 margin-right: 30px; 14 margin-right: 30px;
11 } 15 }
12 </style> 16 </style>
13 <body> 17 <body>
14 <template id="target-template"> 18 <template id="target-template">
15 <p> 19 <p>
16 v<br />v 20 v<br />v
17 </p> 21 </p>
18 </template> 22 </template>
19 <script src="resources/interpolation-test.js"></script> 23 <script src="resources/interpolation-test.js"></script>
20 <script> 24 <script>
21 assertInterpolation({ 25 assertInterpolation({
22 property: 'line-height', 26 property: 'line-height',
27 from: '',
28 to: '20px',
29 }, [
30 {at: -1, is: '0px'},
31 {at: -0.3, is: '7px'},
32 {at: 0, is: '10px'},
33 {at: 0.3, is: '13px'},
34 {at: 0.6, is: '16px'},
35 {at: 1, is: '20px'},
36 {at: 1.5, is: '25px'},
37 ]);
38 assertNoInterpolation({
39 property: 'line-height',
40 from: 'initial',
41 to: '20px',
42 });
43 assertInterpolation({
44 property: 'line-height',
45 from: 'inherit',
46 to: '20px',
47 }, [
48 {at: -1, is: '40px'},
49 {at: -0.3, is: '33px'},
50 {at: 0, is: '30px'},
51 {at: 0.3, is: '27px'},
52 {at: 0.6, is: '24px'},
53 {at: 1, is: '20px'},
54 {at: 1.5, is: '15px'},
55 ]);
56 assertInterpolation({
57 property: 'line-height',
58 from: 'unset',
59 to: '20px',
60 }, [
61 {at: -1, is: '40px'},
62 {at: -0.3, is: '33px'},
63 {at: 0, is: '30px'},
64 {at: 0.3, is: '27px'},
65 {at: 0.6, is: '24px'},
66 {at: 1, is: '20px'},
67 {at: 1.5, is: '15px'},
68 ]);
69 assertInterpolation({
70 property: 'line-height',
23 from: '4', 71 from: '4',
24 to: '14' 72 to: '14',
25 }, [ 73 }, [
26 {at: -1, is: '0'}, 74 {at: -1, is: '0'},
27 {at: -0.3, is: '1'}, 75 {at: -0.3, is: '1'},
28 {at: 0, is: '4'}, 76 {at: 0, is: '4'},
29 {at: 0.3, is: '7'}, 77 {at: 0.3, is: '7'},
30 {at: 0.6, is: '10'}, 78 {at: 0.6, is: '10'},
31 {at: 1, is: '14'}, 79 {at: 1, is: '14'},
32 {at: 1.5, is: '19'}, 80 {at: 1.5, is: '19'},
33 ]); 81 ]);
34 assertInterpolation({ 82 assertInterpolation({
35 property: 'line-height', 83 property: 'line-height',
36 from: '4px', 84 from: '4px',
37 to: '14px' 85 to: '14px',
38 }, [ 86 }, [
39 {at: -1, is: '0px'}, 87 {at: -1, is: '0px'},
40 {at: -0.3, is: '1px'}, 88 {at: -0.3, is: '1px'},
41 {at: 0, is: '4px'}, 89 {at: 0, is: '4px'},
42 {at: 0.3, is: '7px'}, 90 {at: 0.3, is: '7px'},
43 {at: 0.6, is: '10px'}, 91 {at: 0.6, is: '10px'},
44 {at: 1, is: '14px'}, 92 {at: 1, is: '14px'},
45 {at: 1.5, is: '19px'}, 93 {at: 1.5, is: '19px'},
46 ]); 94 ]);
47 assertInterpolation({ 95 assertInterpolation({
48 property: 'line-height', 96 property: 'line-height',
49 from: 'normal', 97 from: 'normal',
50 to: 'normal' 98 to: 'normal',
51 }, [ 99 }, [
52 {at: -0.3, is: 'normal'}, 100 {at: -0.3, is: 'normal'},
53 {at: 0, is: 'normal'}, 101 {at: 0, is: 'normal'},
54 {at: 0.3, is: 'normal'}, 102 {at: 0.3, is: 'normal'},
55 {at: 0.6, is: 'normal'}, 103 {at: 0.6, is: 'normal'},
56 {at: 1, is: 'normal'}, 104 {at: 1, is: 'normal'},
57 {at: 1.5, is: 'normal'}, 105 {at: 1.5, is: 'normal'},
58 ]); 106 ]);
59 assertNoInterpolation({ 107 assertNoInterpolation({
60 property: 'line-height', 108 property: 'line-height',
61 from: '4', 109 from: '4',
62 to: '14px' 110 to: '14px',
63 }); 111 });
64 assertNoInterpolation({ 112 assertNoInterpolation({
65 property: 'line-height', 113 property: 'line-height',
66 from: '14px', 114 from: '14px',
67 to: 'normal' 115 to: 'normal',
68 }); 116 });
69 assertNoInterpolation({ 117 assertNoInterpolation({
70 property: 'line-height', 118 property: 'line-height',
71 from: 'normal', 119 from: 'normal',
72 to: '4' 120 to: '4',
73 }); 121 });
74 assertNoInterpolation({ 122 assertNoInterpolation({
75 property: 'line-height', 123 property: 'line-height',
76 from: '4', 124 from: '4',
77 to: 'normal' 125 to: 'normal',
78 }); 126 });
79 assertNoInterpolation({ 127 assertNoInterpolation({
80 property: 'line-height', 128 property: 'line-height',
81 from: 'normal', 129 from: 'normal',
82 to: '14px' 130 to: '14px',
83 }); 131 });
84 assertNoInterpolation({ 132 assertNoInterpolation({
85 property: 'line-height', 133 property: 'line-height',
86 from: '14px', 134 from: '14px',
87 to: '4' 135 to: '4',
88 }); 136 });
89 assertInterpolation({ 137 assertInterpolation({
90 property: 'line-height', 138 property: 'line-height',
91 from: '4vw', 139 from: '4vw',
92 to: '14vw' 140 to: '14vw',
93 }, [ 141 }, [
94 {at: -1, is: '0'}, 142 {at: -1, is: '0'},
95 {at: -0.3, is: '1vw'}, 143 {at: -0.3, is: '1vw'},
96 {at: 0, is: '4vw'}, 144 {at: 0, is: '4vw'},
97 {at: 0.3, is: '7vw'}, 145 {at: 0.3, is: '7vw'},
98 {at: 0.6, is: '10vw'}, 146 {at: 0.6, is: '10vw'},
99 {at: 1, is: '14vw'}, 147 {at: 1, is: '14vw'},
100 {at: 1.5, is: '19vw'}, 148 {at: 1.5, is: '19vw'},
101 ]); 149 ]);
102 // content_shell --run-layout-test uses a viewport of 800x600. 150 // content_shell --run-layout-test uses a viewport of 800x600.
103 assertInterpolation({ 151 assertInterpolation({
104 property: 'line-height', 152 property: 'line-height',
105 from: '50vmin', 153 from: '50vmin',
106 to: '100px' 154 to: '100px',
107 }, [ 155 }, [
108 {at: -0.25, is: '350px'}, 156 {at: -0.25, is: '350px'},
109 {at: 0, is: '300px'}, 157 {at: 0, is: '300px'},
110 {at: 0.25, is: '250px'}, 158 {at: 0.25, is: '250px'},
111 {at: 0.75, is: '150px'}, 159 {at: 0.75, is: '150px'},
112 {at: 1, is: '100px'}, 160 {at: 1, is: '100px'},
113 {at: 1.5, is: '0px'}, 161 {at: 1.5, is: '0px'},
114 ]); 162 ]);
115 assertInterpolation({ 163 assertInterpolation({
116 property: 'line-height', 164 property: 'line-height',
117 from: '100px', 165 from: '100px',
118 to: '50vmax' 166 to: '50vmax',
119 }, [ 167 }, [
120 {at: -0.25, is: '25px'}, 168 {at: -0.25, is: '25px'},
121 {at: 0, is: '100px'}, 169 {at: 0, is: '100px'},
122 {at: 0.25, is: '175px'}, 170 {at: 0.25, is: '175px'},
123 {at: 0.75, is: '325px'}, 171 {at: 0.75, is: '325px'},
124 {at: 1, is: '400px'}, 172 {at: 1, is: '400px'},
125 {at: 1.5, is: '550px'}, 173 {at: 1.5, is: '550px'},
126 ]); 174 ]);
127 assertInterpolation({ 175 assertInterpolation({
128 property: 'line-height', 176 property: 'line-height',
129 from: '75vw', 177 from: '75vw',
130 to: '25vh' 178 to: '25vh',
131 }, [ 179 }, [
132 {at: -0.25, is: '712.5px'}, 180 {at: -0.25, is: '712.5px'},
133 {at: 0, is: '600px'}, 181 {at: 0, is: '600px'},
134 {at: 0.25, is: '487.5px'}, 182 {at: 0.25, is: '487.5px'},
135 {at: 0.75, is: '262.5px'}, 183 {at: 0.75, is: '262.5px'},
136 {at: 1, is: '150px'}, 184 {at: 1, is: '150px'},
137 {at: 1.5, is: '0px'}, // line-height must not be less than 0. 185 {at: 1.5, is: '0px'}, // line-height must not be less than 0.
138 ]); 186 ]);
139 </script> 187 </script>
140 </body> 188 </body>
141 189
142 190
143 191
144 192
145 193
146 194
OLDNEW
« no previous file with comments | « LayoutTests/animations/interpolation/letter-spacing-interpolation.html ('k') | LayoutTests/animations/interpolation/margin-interpolation.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698