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

Side by Side Diff: third_party/WebKit/LayoutTests/animations/interpolation/rotate-interpolation.html

Issue 2662203002: CSS: Rotate support for none and fixed responsive-test.js (Closed)
Patch Set: avoid expectation failure on Mac Created 3 years, 10 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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <meta charset="UTF-8"> 2 <meta charset="UTF-8">
3 <style> 3 <style>
4 .parent { 4 .parent {
5 rotate: 90deg; 5 rotate: 90deg;
6 } 6 }
7 .target { 7 .target {
8 width: 40px; 8 width: 40px;
9 height: 20px; 9 height: 20px;
10 background-color: grey; 10 background-color: grey;
11 rotate: 10deg; 11 rotate: 10deg;
12 } 12 }
13 .expected { 13 .expected {
14 background-color: green; 14 background-color: green;
15 } 15 }
16 </style> 16 </style>
17 <template id="target-template"> 17 <template id="target-template">
18 <div class="parent"> 18 <div class="parent">
19 <div class="target">Text</div> 19 <div class="target">Text</div>
20 </div> 20 </div>
21 </template> 21 </template>
22 <script src="resources/interpolation-test.js"></script> 22 <script src="resources/interpolation-test.js"></script>
23 <script> 23 <script>
24 assertInterpolation({ 24 assertInterpolation({
25 property: 'rotate', 25 property: 'rotate',
26 from: 'none',
27 to: '30deg',
28 }, [
29 {at: -1, is: '-30deg'},
30 {at: 0, is: 'none'},
31 {at: 0.25, is: '7.5deg'},
32 {at: 0.75, is: '22.5deg'},
33 {at: 1, is: '30deg'},
34 {at: 2, is: '60deg'},
35 ]);
36
37 assertInterpolation({
38 property: 'rotate',
26 from: neutralKeyframe, 39 from: neutralKeyframe,
27 to: '30deg', 40 to: '30deg',
28 }, [ 41 }, [
29 {at: -1, is: '-10deg'}, 42 {at: -1, is: '-10deg'},
30 {at: 0, is: '10deg'}, 43 {at: 0, is: '10deg'},
31 {at: 0.25, is: '15deg'}, 44 {at: 0.25, is: '15deg'},
32 {at: 0.75, is: '25deg'}, 45 {at: 0.75, is: '25deg'},
33 {at: 1, is: '30deg'}, 46 {at: 1, is: '30deg'},
34 {at: 2, is: '50deg'}, 47 {at: 2, is: '50deg'},
35 ]); 48 ]);
36 49
37 assertInterpolation({ 50 assertInterpolation({
38 property: 'rotate', 51 property: 'rotate',
39 from: 'unset', 52 from: 'unset',
40 to: '30deg', 53 to: '30deg',
41 }, [ 54 }, [
42 {at: -1, is: '-30deg'}, 55 {at: -1, is: '-30deg'},
43 {at: 0, is: '0deg'}, 56 {at: 0, is: 'none'},
44 {at: 0.25, is: '7.5deg'}, 57 {at: 0.25, is: '7.5deg'},
45 {at: 0.75, is: '22.5deg'}, 58 {at: 0.75, is: '22.5deg'},
46 {at: 1, is: '30deg'}, 59 {at: 1, is: '30deg'},
47 {at: 2, is: '60deg'}, 60 {at: 2, is: '60deg'},
48 ]); 61 ]);
49 62
50 assertInterpolation({ 63 assertInterpolation({
51 property: 'rotate', 64 property: 'rotate',
52 from: '100deg', 65 from: '100deg',
53 to: '-100deg', 66 to: '-100deg',
(...skipping 54 matching lines...) Expand 10 before | Expand all | Expand 10 after
108 {at: 0, is: '1 0 0 0deg'}, 121 {at: 0, is: '1 0 0 0deg'},
109 {at: 0.25, is: '0 1 0 2.5deg'}, 122 {at: 0.25, is: '0 1 0 2.5deg'},
110 {at: 0.75, is: '0 1 0 7.5deg'}, 123 {at: 0.75, is: '0 1 0 7.5deg'},
111 {at: 1, is: '0 1 0 10deg'}, 124 {at: 1, is: '0 1 0 10deg'},
112 {at: 2, is: '0 1 0 20deg'}, 125 {at: 2, is: '0 1 0 20deg'},
113 ]); 126 ]);
114 127
115 assertInterpolation({ 128 assertInterpolation({
116 property: 'rotate', 129 property: 'rotate',
117 from: '1 1 0 90deg', 130 from: '1 1 0 90deg',
118 to: '0 1 1 180deg', 131 to: '0 1 1 135deg',
119 }, [ 132 }, [
120 {at: -1, is: '0.41 -0.41 -0.82 120deg'}, 133 {at: -1, is: '0.67 -0.06 -0.74 124.97deg'},
121 {at: 0, is: '1 1 0 90deg'}, 134 {at: 0, is: '1 1 0 90deg'},
122 {at: 0.25, is: '0.8 0.27 -0.53 82.76deg'}, 135 {at: 0.25, is: '0.54 0.8 0.26 94.83deg'},
123 {at: 0.75, is: '0.27 -0.54 -0.8 138.89deg'}, 136 {at: 0.75, is: '0.17 0.78 0.61 118.68deg'},
124 {at: 1, is: '0 1 1 180deg'}, 137 {at: 1, is: '0 1 1 135deg'},
125 {at: 2, is: '0.71 0 -0.71 90deg'}, 138 {at: 2, is: '0.52 -0.29 -0.81 151.04deg'},
126 ]); 139 ]);
127 140
128 assertInterpolation({ 141 assertInterpolation({
129 property: 'rotate', 142 property: 'rotate',
130 from: '0 1 0 0deg', 143 from: '0 1 0 0deg',
131 to: '1 0 0 450deg', 144 to: '1 0 0 450deg',
132 }, [ 145 }, [
133 {at: -1, is: '1 0 0 -450deg'}, 146 {at: -1, is: '1 0 0 -450deg'},
134 {at: 0, is: '0 1 0 0deg'}, 147 {at: 0, is: '0 1 0 0deg'},
135 {at: 0.25, is: '1 0 0 112.5deg'}, 148 {at: 0.25, is: '1 0 0 112.5deg'},
136 {at: 0.75, is: '1 0 0 337.5deg'}, 149 {at: 0.75, is: '1 0 0 337.5deg'},
137 {at: 1, is: '1 0 0 450deg'}, 150 {at: 1, is: '1 0 0 450deg'},
138 {at: 2, is: '1 0 0 900deg'}, 151 {at: 2, is: '1 0 0 900deg'},
139 ]); 152 ]);
140 153
141 assertInterpolation({ 154 assertInterpolation({
142 property: 'rotate', 155 property: 'rotate',
143 from: '1 0 0 450deg', 156 from: '1 0 0 450deg',
144 to: '0 1 0 0deg', 157 to: '0 1 0 0deg',
145 }, [ 158 }, [
146 {at: -1, is: '1 0 0 900deg'}, 159 {at: -1, is: '1 0 0 900deg'},
147 {at: 0, is: '1 0 0 450deg'}, 160 {at: 0, is: '1 0 0 450deg'},
148 {at: 0.25, is: '1 0 0 337.5deg'}, 161 {at: 0.25, is: '1 0 0 337.5deg'},
149 {at: 0.75, is: '1 0 0 112.5deg'}, 162 {at: 0.75, is: '1 0 0 112.5deg'},
150 {at: 1, is: '0 1 0 0deg'}, 163 {at: 1, is: '0 1 0 0deg'},
151 {at: 2, is: '1 0 0 -450deg'}, 164 {at: 2, is: '1 0 0 -450deg'},
152 ]); 165 ]);
153 </script> 166 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698