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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/css3/filters/filter-animation-from-none-hw.html

Issue 716963002: Remove property-specific handling in animation-test-helpers.js (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@animhelpercleanup
Patch Set: Created 6 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
« no previous file with comments | « LayoutTests/css3/filters/filter-animation-from-none-expected.txt ('k') | LayoutTests/css3/filters/filter-animation-from-none-hw-expected.txt » ('j') | LayoutTests/transitions/cubic-bezier-overflow-shadow.html » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 2
3 <html> 3 <html>
4 <head> 4 <head>
5 <style> 5 <style>
6 .box { 6 .box {
7 height: 100px; 7 height: 100px;
8 width: 100px; 8 width: 100px;
9 margin: 10px; 9 margin: 10px;
10 background-color: blue; 10 background-color: blue;
11 display: inline-block; 11 display: inline-block;
12 transform:translateZ(0); 12 transform:translateZ(0);
13 } 13 }
14 14
15 #grayscale-box { 15 #grayscale-box {
16 -webkit-animation: grayscale-anim 2s linear 16 -webkit-animation: grayscale-anim 2s linear
17 } 17 }
18 18
19 #sepia-box { 19 #sepia-box {
20 -webkit-animation: sepia-anim 2s linear 20 -webkit-animation: sepia-anim 2s linear
21 } 21 }
22 22
23 #saturate-box { 23 #saturate-box {
24 -webkit-animation: saturate-anim 2s linear 24 -webkit-animation: saturate-anim 2s linear
25 } 25 }
26 26
27 #huerotate-box { 27 #hue-rotate-box {
28 -webkit-animation: huerotate-anim 2s linear 28 -webkit-animation: hue-rotate-anim 2s linear
29 } 29 }
30 30
31 #invert-box { 31 #invert-box {
32 -webkit-animation: invert-anim 2s linear 32 -webkit-animation: invert-anim 2s linear
33 } 33 }
34 34
35 #opacity-box { 35 #opacity-box {
36 -webkit-animation: opacity-anim 2s linear 36 -webkit-animation: opacity-anim 2s linear
37 } 37 }
38 38
(...skipping 22 matching lines...) Expand all
61 @-webkit-keyframes sepia-anim { 61 @-webkit-keyframes sepia-anim {
62 from { } 62 from { }
63 to { -webkit-filter: sepia(1); } 63 to { -webkit-filter: sepia(1); }
64 } 64 }
65 65
66 @-webkit-keyframes saturate-anim { 66 @-webkit-keyframes saturate-anim {
67 from { } 67 from { }
68 to { -webkit-filter: saturate(0); } 68 to { -webkit-filter: saturate(0); }
69 } 69 }
70 70
71 @-webkit-keyframes huerotate-anim { 71 @-webkit-keyframes hue-rotate-anim {
72 from { } 72 from { }
73 to { -webkit-filter: hue-rotate(180deg); } 73 to { -webkit-filter: hue-rotate(180deg); }
74 } 74 }
75 75
76 @-webkit-keyframes invert-anim { 76 @-webkit-keyframes invert-anim {
77 from { } 77 from { }
78 to { -webkit-filter: invert(1); } 78 to { -webkit-filter: invert(1); }
79 } 79 }
80 80
81 @-webkit-keyframes opacity-anim { 81 @-webkit-keyframes opacity-anim {
(...skipping 22 matching lines...) Expand all
104 } 104 }
105 105
106 </style> 106 </style>
107 <script src="../../animations/resources/animation-test-helpers.js"></script> 107 <script src="../../animations/resources/animation-test-helpers.js"></script>
108 <script type="text/javascript"> 108 <script type="text/javascript">
109 const expectedValues = [ 109 const expectedValues = [
110 // [time, element-id, property, expected-value, tolerance] 110 // [time, element-id, property, expected-value, tolerance]
111 [1, "grayscale-box", "webkitFilter", 'grayscale(0.5)', 0.05], 111 [1, "grayscale-box", "webkitFilter", 'grayscale(0.5)', 0.05],
112 [1, "sepia-box", "webkitFilter", 'sepia(0.5)', 0.05], 112 [1, "sepia-box", "webkitFilter", 'sepia(0.5)', 0.05],
113 [1, "saturate-box", "webkitFilter", 'saturate(0.5)', 0.05], 113 [1, "saturate-box", "webkitFilter", 'saturate(0.5)', 0.05],
114 [1, "huerotate-box", "webkitFilter", 'huerotate(90deg)', 5], 114 [1, "hue-rotate-box", "webkitFilter", 'hue-rotate(90deg)', 5],
115 [1, "invert-box", "webkitFilter", 'invert(0.5)', 0.05], 115 [1, "invert-box", "webkitFilter", 'invert(0.5)', 0.05],
116 [1, "opacity-box", "webkitFilter", 'opacity(0.5)', 0.05], 116 [1, "opacity-box", "webkitFilter", 'opacity(0.5)', 0.05],
117 [1, "brightness-box", "webkitFilter", 'brightness(0.5)', 0.05], 117 [1, "brightness-box", "webkitFilter", 'brightness(0.5)', 0.05],
118 [1, "contrast-box", "webkitFilter", 'contrast(0.5)', 0.05], 118 [1, "contrast-box", "webkitFilter", 'contrast(0.5)', 0.05],
119 [1, "blur-box", "webkitFilter", 'blur(10px)', 1], 119 [1, "blur-box", "webkitFilter", 'blur(10px)', 1],
120 // FIXME when we implement computed filter style for drop-shadow. 120 // FIXME when we implement computed filter style for drop-shadow.
121 // ["dropshadow-anim", 1, "dropshadow-box", "webkitFilter", 'drop-shadow( rgba(0, 0, 0, 0.25) 5px 8px 3px )', 2], 121 // ["dropshadow-anim", 1, "dropshadow-box", "webkitFilter", 'drop-shadow( rgba(0, 0, 0, 0.25) 5px 8px 3px )', 2],
122 ]; 122 ];
123 123
124 runAnimationTest(expectedValues); 124 runAnimationTest(expectedValues);
125 </script> 125 </script>
126 </head> 126 </head>
127 <body> 127 <body>
128 128
129 <div class="box" id="grayscale-box"></div> 129 <div class="box" id="grayscale-box"></div>
130 <div class="box" id="sepia-box"></div> 130 <div class="box" id="sepia-box"></div>
131 <div class="box" id="saturate-box"></div> 131 <div class="box" id="saturate-box"></div>
132 <div class="box" id="huerotate-box"></div> 132 <div class="box" id="hue-rotate-box"></div>
133 <div class="box" id="invert-box"></div> 133 <div class="box" id="invert-box"></div>
134 <div class="box" id="opacity-box"></div> 134 <div class="box" id="opacity-box"></div>
135 <div class="box" id="brightness-box"></div> 135 <div class="box" id="brightness-box"></div>
136 <div class="box" id="contrast-box"></div> 136 <div class="box" id="contrast-box"></div>
137 <div class="box" id="blur-box"></div> 137 <div class="box" id="blur-box"></div>
138 <!-- <div class="box" id="dropshadow-box"></div> --> 138 <!-- <div class="box" id="dropshadow-box"></div> -->
139 139
140 <div id="result"> 140 <div id="result">
141 </div> 141 </div>
142 </body> 142 </body>
143 </html> 143 </html>
OLDNEW
« no previous file with comments | « LayoutTests/css3/filters/filter-animation-from-none-expected.txt ('k') | LayoutTests/css3/filters/filter-animation-from-none-hw-expected.txt » ('j') | LayoutTests/transitions/cubic-bezier-overflow-shadow.html » ('J')

Powered by Google App Engine
This is Rietveld 408576698