OLD | NEW |
| (Empty) |
1 Test the computed style of the -webkit-filter property. | |
2 | |
3 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
". | |
4 | |
5 | |
6 | |
7 Basic reference : url('#a') | |
8 PASS filterStyle is "url(\"#a\")" | |
9 | |
10 Bare unquoted reference converting to quoted form : url(#a) | |
11 PASS filterStyle is "url(\"#a\")" | |
12 | |
13 Multiple references : url('#a') url('#b') | |
14 PASS filterStyle is "url(\"#a\") url(\"#b\")" | |
15 | |
16 Reference as 2nd value : grayscale(1) url('#a') | |
17 PASS filterStyle is "grayscale(1) url(\"#a\")" | |
18 | |
19 Integer value : grayscale(1) | |
20 PASS filterStyle is "grayscale(1)" | |
21 | |
22 Float value converts to integer : grayscale(1.0) | |
23 PASS filterStyle is "grayscale(1)" | |
24 | |
25 Zero value : grayscale(0) | |
26 PASS filterStyle is "grayscale(0)" | |
27 | |
28 No values : grayscale() | |
29 PASS filterStyle is "grayscale(1)" | |
30 | |
31 Multiple values : grayscale(0.5) grayscale(0.25) | |
32 PASS filterStyle is "grayscale(0.5) grayscale(0.25)" | |
33 | |
34 Integer value : sepia(1) | |
35 PASS filterStyle is "sepia(1)" | |
36 | |
37 Float value converts to integer : sepia(1.0) | |
38 PASS filterStyle is "sepia(1)" | |
39 | |
40 Zero value : sepia(0) | |
41 PASS filterStyle is "sepia(0)" | |
42 | |
43 No values : sepia() | |
44 PASS filterStyle is "sepia(1)" | |
45 | |
46 Multiple values : sepia(0.5) sepia(0.25) | |
47 PASS filterStyle is "sepia(0.5) sepia(0.25)" | |
48 | |
49 Rule combinations : sepia(0.5) grayscale(0.25) | |
50 PASS filterStyle is "sepia(0.5) grayscale(0.25)" | |
51 | |
52 Integer value : saturate(1) | |
53 PASS filterStyle is "saturate(1)" | |
54 | |
55 Float value converts to integer : saturate(1.0) | |
56 PASS filterStyle is "saturate(1)" | |
57 | |
58 Zero value : saturate(0) | |
59 PASS filterStyle is "saturate(0)" | |
60 | |
61 No values : saturate() | |
62 PASS filterStyle is "saturate(1)" | |
63 | |
64 Multiple values : saturate(0.5) saturate(0.25) | |
65 PASS filterStyle is "saturate(0.5) saturate(0.25)" | |
66 | |
67 Rule combinations : saturate(0.5) grayscale(0.25) | |
68 PASS filterStyle is "saturate(0.5) grayscale(0.25)" | |
69 | |
70 Degrees value as integer : hue-rotate(10deg) | |
71 PASS filterStyle is "hue-rotate(10deg)" | |
72 | |
73 Degrees float value converts to integer : hue-rotate(10.0deg) | |
74 PASS filterStyle is "hue-rotate(10deg)" | |
75 | |
76 Radians value : hue-rotate(10rad) | |
77 PASS filterStyle is "hue-rotate(572.958deg)" | |
78 | |
79 Gradians value : hue-rotate(10grad) | |
80 PASS filterStyle is "hue-rotate(9deg)" | |
81 | |
82 Turns value : hue-rotate(0.5turn) | |
83 PASS filterStyle is "hue-rotate(180deg)" | |
84 | |
85 Zero value : hue-rotate(0) | |
86 PASS filterStyle is "hue-rotate(0deg)" | |
87 | |
88 No values : hue-rotate() | |
89 PASS filterStyle is "hue-rotate(0deg)" | |
90 | |
91 Rule combinations : hue-rotate(10deg) grayscale(0.25) | |
92 PASS filterStyle is "hue-rotate(10deg) grayscale(0.25)" | |
93 | |
94 Integer value : invert(1) | |
95 PASS filterStyle is "invert(1)" | |
96 | |
97 Float value converts to integer : invert(1.0) | |
98 PASS filterStyle is "invert(1)" | |
99 | |
100 Zero value : invert(0) | |
101 PASS filterStyle is "invert(0)" | |
102 | |
103 No values : invert() | |
104 PASS filterStyle is "invert(1)" | |
105 | |
106 Multiple values : invert(0.5) invert(0.25) | |
107 PASS filterStyle is "invert(0.5) invert(0.25)" | |
108 | |
109 Rule combinations : invert(0.5) grayscale(0.25) | |
110 PASS filterStyle is "invert(0.5) grayscale(0.25)" | |
111 | |
112 Integer value : opacity(1) | |
113 PASS filterStyle is "opacity(1)" | |
114 | |
115 Float value converts to integer : opacity(1.0) | |
116 PASS filterStyle is "opacity(1)" | |
117 | |
118 Zero value : opacity(0) | |
119 PASS filterStyle is "opacity(0)" | |
120 | |
121 No values : opacity() | |
122 PASS filterStyle is "opacity(1)" | |
123 | |
124 Multiple values : opacity(0.5) opacity(0.25) | |
125 PASS filterStyle is "opacity(0.5) opacity(0.25)" | |
126 | |
127 Rule combinations : opacity(0.5) grayscale(0.25) | |
128 PASS filterStyle is "opacity(0.5) grayscale(0.25)" | |
129 | |
130 Integer value : brightness(1) | |
131 PASS filterStyle is "brightness(1)" | |
132 | |
133 Float value converts to integer : brightness(1.0) | |
134 PASS filterStyle is "brightness(1)" | |
135 | |
136 Zero value : brightness(0) | |
137 PASS filterStyle is "brightness(0)" | |
138 | |
139 No values : brightness() | |
140 PASS filterStyle is "brightness(0)" | |
141 | |
142 Multiple values : brightness(0.5) brightness(0.25) | |
143 PASS filterStyle is "brightness(0.5) brightness(0.25)" | |
144 | |
145 Rule combinations : brightness(0.5) grayscale(0.25) | |
146 PASS filterStyle is "brightness(0.5) grayscale(0.25)" | |
147 | |
148 Integer value : contrast(1) | |
149 PASS filterStyle is "contrast(1)" | |
150 | |
151 Value greater than 1 : contrast(2) | |
152 PASS filterStyle is "contrast(2)" | |
153 | |
154 Float value converts to integer : contrast(1.0) | |
155 PASS filterStyle is "contrast(1)" | |
156 | |
157 Zero value : contrast(0) | |
158 PASS filterStyle is "contrast(0)" | |
159 | |
160 No values : contrast() | |
161 PASS filterStyle is "contrast(1)" | |
162 | |
163 Multiple values : contrast(0.5) contrast(0.25) | |
164 PASS filterStyle is "contrast(0.5) contrast(0.25)" | |
165 | |
166 Rule combinations : contrast(0.5) grayscale(0.25) | |
167 PASS filterStyle is "contrast(0.5) grayscale(0.25)" | |
168 | |
169 One zero to px : blur(0) | |
170 PASS filterStyle is "blur(0px)" | |
171 | |
172 One length : blur(2em) | |
173 PASS filterStyle is "blur(32px)" | |
174 | |
175 One length : blur(5px) | |
176 PASS filterStyle is "blur(5px)" | |
177 | |
178 No values : blur() | |
179 PASS filterStyle is "blur(0px)" | |
180 | |
181 Color then three values : drop-shadow(red 1px 2px 3px) | |
182 PASS filterStyle is "drop-shadow(rgb(255, 0, 0) 1px 2px 3px)" | |
183 | |
184 Three values then color : drop-shadow(1px 2px 3px red) | |
185 PASS filterStyle is "drop-shadow(rgb(255, 0, 0) 1px 2px 3px)" | |
186 | |
187 Color then three values with zero length : drop-shadow(#abc 0 0 0) | |
188 PASS filterStyle is "drop-shadow(rgb(170, 187, 204) 0px 0px 0px)" | |
189 | |
190 Three values with zero length : drop-shadow(0 0 0) | |
191 PASS filterStyle is "drop-shadow(rgb(0, 0, 0) 0px 0px 0px)" | |
192 | |
193 Two values no color : drop-shadow(1px 2px) | |
194 PASS filterStyle is "drop-shadow(rgb(0, 0, 0) 1px 2px 0px)" | |
195 | |
196 Multiple operations : grayscale(0.5) sepia(0.25) saturate(0.75) hue-rotate(35deg
) invert(0.2) opacity(0.9) blur(5px) | |
197 PASS filterStyle is "grayscale(0.5) sepia(0.25) saturate(0.75) hue-rotate(35deg)
invert(0.2) opacity(0.9) blur(5px)" | |
198 | |
199 Percentage values : grayscale(50%) sepia(25%) saturate(75%) invert(20%) opacity(
90%) brightness(60%) contrast(30%) | |
200 PASS filterStyle is "grayscale(0.5) sepia(0.25) saturate(0.75) invert(0.2) opaci
ty(0.9) brightness(0.6) contrast(0.3)" | |
201 PASS successfullyParsed is true | |
202 | |
203 TEST COMPLETE | |
204 | |
OLD | NEW |