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

Side by Side Diff: LayoutTests/css3/filters/composited-during-animation.html

Issue 60033004: Don't check all animation/transition properties when comparing RenderStyles (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Rebased Created 7 years, 1 month 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 2
3 <html> 3 <html>
4 <head> 4 <head>
5 <style> 5 <style>
6 img { 6 img {
7 margin: 10px; 7 margin: 10px;
8 } 8 }
9 9
10 .animating img { 10 img {
11 -webkit-animation-duration: 2s !important; 11 -webkit-animation-duration: 2s !important;
12 -webkit-animation-timing-function: linear !important; 12 -webkit-animation-timing-function: linear !important;
13 } 13 }
14 14
15 #grayscale-box { 15 #grayscale-box {
16 -webkit-filter: grayscale(1);
17 }
18 .animating #grayscale-box {
16 -webkit-animation-name: grayscale-anim; 19 -webkit-animation-name: grayscale-anim;
17 -webkit-filter: grayscale(1);
18 } 20 }
19 21
20 #sepia-box { 22 #sepia-box {
23 -webkit-filter: sepia(1);
24 }
25 .animating #sepia-box {
21 -webkit-animation: sepia-anim; 26 -webkit-animation: sepia-anim;
22 -webkit-filter: sepia(1);
23 } 27 }
24 28
25 #saturate-box { 29 #saturate-box {
30 -webkit-filter: saturate(1);
31 }
32 .animating #saturate-box {
26 -webkit-animation: saturate-anim; 33 -webkit-animation: saturate-anim;
27 -webkit-filter: saturate(1);
28 } 34 }
29 35
30 #huerotate-box { 36 #huerotate-box {
37 -webkit-filter: hue-rotate(90deg);
38 }
39 .animating #huerotate-box {
31 -webkit-animation: huerotate-anim; 40 -webkit-animation: huerotate-anim;
32 -webkit-filter: hue-rotate(90deg);
33 } 41 }
34 42
35 #invert-box { 43 #invert-box {
44 -webkit-filter: invert(1);
45 }
46 .animating #invert-box {
36 -webkit-animation: invert-anim; 47 -webkit-animation: invert-anim;
37 -webkit-filter: invert(1);
38 } 48 }
39 49
40 #opacity-box { 50 #opacity-box {
51 -webkit-filter: opacity(0);
52 }
53 .animating #opacity-box {
41 -webkit-animation: opacity-anim; 54 -webkit-animation: opacity-anim;
42 -webkit-filter: opacity(0);
43 } 55 }
44 56
45 #brightness-box { 57 #brightness-box {
58 -webkit-filter: brightness(0);
59 }
60 .animating #brightness-box {
46 -webkit-animation: brightness-anim; 61 -webkit-animation: brightness-anim;
47 -webkit-filter: brightness(0);
48 } 62 }
49 63
50 #contrast-box { 64 #contrast-box {
65 -webkit-filter: contrast(0);
66 }
67 .animating #contrast-box {
51 -webkit-animation: contrast-anim; 68 -webkit-animation: contrast-anim;
52 -webkit-filter: contrast(0);
53 } 69 }
54 70
55 #blur-box { 71 #blur-box {
72 -webkit-filter: blur(10px);
73 }
74 .animating #blur-box {
56 -webkit-animation: blur-anim; 75 -webkit-animation: blur-anim;
57 -webkit-filter: blur(10px);
58 } 76 }
59 77
60 @-webkit-keyframes grayscale-anim { 78 @-webkit-keyframes grayscale-anim {
61 from { -webkit-filter: grayscale(0); } 79 from { -webkit-filter: grayscale(0); }
62 to { -webkit-filter: grayscale(1); } 80 to { -webkit-filter: grayscale(1); }
63 } 81 }
64 82
65 @-webkit-keyframes sepia-anim { 83 @-webkit-keyframes sepia-anim {
66 from { -webkit-filter: sepia(0); } 84 from { -webkit-filter: sepia(0); }
67 to { -webkit-filter: sepia(1); } 85 to { -webkit-filter: sepia(1); }
(...skipping 97 matching lines...) Expand 10 before | Expand all | Expand 10 after
165 <img src="resources/reference.png" id="grayscale-box"> 183 <img src="resources/reference.png" id="grayscale-box">
166 <img src="resources/reference.png" id="sepia-box"> 184 <img src="resources/reference.png" id="sepia-box">
167 <img src="resources/reference.png" id="saturate-box"> 185 <img src="resources/reference.png" id="saturate-box">
168 <img src="resources/reference.png" id="huerotate-box"> 186 <img src="resources/reference.png" id="huerotate-box">
169 <img src="resources/reference.png" id="invert-box"> 187 <img src="resources/reference.png" id="invert-box">
170 <img src="resources/reference.png" id="opacity-box"> 188 <img src="resources/reference.png" id="opacity-box">
171 <img src="resources/reference.png" id="brightness-box"> 189 <img src="resources/reference.png" id="brightness-box">
172 <img src="resources/reference.png" id="contrast-box"> 190 <img src="resources/reference.png" id="contrast-box">
173 <img src="resources/reference.png" id="blur-box"> 191 <img src="resources/reference.png" id="blur-box">
174 192
175 <!-- this result element is filled in the script above, before the animations st art -->
176 <div id="preresult">
177 </div>
178
179 <!-- this result element is filled by the animation test system --> 193 <!-- this result element is filled by the animation test system -->
180 <div id="result"> 194 <div id="result">
181 </div> 195 </div>
182 </body> 196 </body>
183 </html> 197 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698