JS Test Harness: Insert the stylesheet dynamically
[WebKit-https.git] / LayoutTests / fast / css / test-setting-canvas-color.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <script src="../js/resources/js-test-pre.js"></script>
5 </head>
6 <body>
7 <canvas id="canvas">
8 <script>
9 description("Test case for bug 39168. This tests the CSS color parsing code using &lt;canvas&gt;.");
10
11 function log(message) {
12     var console = document.getElementById("console");
13     console.appendChild(document.createTextNode(message));
14     console.appendChild(document.createElement("BR"));
15 }
16
17 var canvas = document.getElementById("canvas");
18 var ctx = canvas.getContext("2d");
19
20 function shouldSuccessfullyParse(color) {
21     ctx.fillStyle = "#f00";
22     ctx.fillStyle = color;
23     // Check that there is no red.
24     if (ctx.fillStyle.match(/^#(?!(FF0000|ff0000|f00)$)/))
25         testPassed("Setting color to " + color + " was successfully set.");
26     else
27         testFailed("Setting color to " + color + " was not set but should!");
28 }
29
30 function shouldNotSuccessfullyParse(color) {
31     ctx.fillStyle = "#0f0";
32     ctx.fillStyle = color;
33     // Check that the color is still green.
34     if (ctx.fillStyle.match(/^#(00FF00|00ff00|0f0)$/))
35         testPassed("Setting color to " + color + " was not set (as expected).");
36     else
37         testFailed("Setting color to " + color + " was successfully set but should not!");
38 }
39
40 // Taken from CSS 3 color.
41 var deprecatedSystemColors = [
42     "ActiveBorder",
43     "ActiveCaption",
44     "AppWorkspace",
45     "Background",
46     "ButtonFace",
47     "ButtonHighlight",
48     "ButtonShadow",
49     "ButtonText",
50     "CaptionText",
51     "GrayText",
52     "Highlight",
53     "HighlightText",
54     "InactiveBorder",
55     "InactiveCaption",
56     "InactiveCaptionText",
57     "InfoBackground",
58     "InfoText",
59     "Menu",
60     "MenuText",
61     "Scrollbar",
62     "ThreeDDarkShadow",
63     "ThreeDFace",
64     "ThreeDHighlight",
65     "ThreeDLightShadow",
66     "ThreeDShadow",
67     "Window",
68     "WindowFrame",
69     "WindowText"
70 ];
71
72 // Valid values passed in color matching.
73 for (var i = 0; i < deprecatedSystemColors.length; ++i) {
74     shouldSuccessfullyParse(deprecatedSystemColors[i]);
75     shouldSuccessfullyParse(deprecatedSystemColors[i].toLowerCase());
76 }
77
78 // Taken from CSS 3 color.
79 var svgColors = [
80     "aliceblue",
81     "antiquewhite",
82     "aqua",
83     "aquamarine",
84     "azure",
85     "beige",
86     "bisque",
87     "black",
88     "blanchedalmond",
89     "blue",
90     "blueviolet",
91     "brown",
92     "burlywood",
93     "cadetblue",
94     "chartreuse",
95     "chocolate",
96     "coral",
97     "cornflowerblue",
98     "cornsilk",
99     "crimson",
100     "cyan",
101     "darkblue",
102     "darkcyan",
103     "darkgoldenrod",
104     "darkgray",
105     "darkgreen",
106     "darkgrey",
107     "darkkhaki",
108     "darkmagenta",
109     "darkolivegreen",
110     "darkorange",
111     "darkorchid",
112     "darkred",
113     "darksalmon",
114     "darkseagreen",
115     "darkslateblue",
116     "darkslategray",
117     "darkslategrey",
118     "darkturquoise",
119     "darkviolet",
120     "deeppink",
121     "deepskyblue",
122     "dimgray",
123     "dimgrey",
124     "dodgerblue",
125     "firebrick",
126     "floralwhite",
127     "forestgreen",
128     "fuchsia",
129     "gainsboro",
130     "ghostwhite",
131     "gold",
132     "goldenrod",
133     "gray",
134     "green",
135     "greenyellow",
136     "grey",
137     "honeydew",
138     "hotpink",
139     "indianred",
140     "indigo",
141     "ivory",
142     "khaki",
143     "lavender",
144     "lavenderblush",
145     "lawngreen",
146     "lemonchiffon",
147     "lightblue",
148     "lightcoral",
149     "lightcyan",
150     "lightgoldenrodyellow",
151     "lightgray",
152     "lightgreen",
153     "lightgrey",
154     "lightpink",
155     "lightsalmon",
156     "lightseagreen",
157     "lightskyblue",
158     "lightslategray",
159     "lightslategrey",
160     "lightsteelblue",
161     "lightyellow",
162     "lime",
163     "limegreen",
164     "linen",
165     "magenta",
166     "maroon",
167     "mediumaquamarine",
168     "mediumblue",
169     "mediumorchid",
170     "mediumpurple",
171     "mediumseagreen",
172     "mediumslateblue",
173     "mediumspringgreen",
174     "mediumturquoise",
175     "mediumvioletred",
176     "midnightblue",
177     "mintcream",
178     "mistyrose",
179     "moccasin",
180     "navajowhite",
181     "navy",
182     "oldlace",
183     "olive",
184     "olivedrab",
185     "orange",
186     "orangered",
187     "orchid",
188     "palegoldenrod",
189     "palegreen",
190     "paleturquoise",
191     "palevioletred",
192     "papayawhip",
193     "peachpuff",
194     "peru",
195     "pink",
196     "plum",
197     "powderblue",
198     "purple",
199     // We do not test red.
200     "rosybrown",
201     "royalblue",
202     "saddlebrown",
203     "salmon",
204     "sandybrown",
205     "seagreen",
206     "seashell",
207     "sienna",
208     "silver",
209     "skyblue",
210     "slateblue",
211     "slategray",
212     "slategrey",
213     "snow",
214     "springgreen",
215     "steelblue",
216     "tan",
217     "teal",
218     "thistle",
219     "tomato",
220     "turquoise",
221     "violet",
222     "wheat",
223     "white",
224     "whitesmoke",
225     "yellow",
226     "yellowgreen"
227 ];
228
229 // Valid values passed in color matching.
230 for (var i = 0; i < svgColors.length; ++i)
231     shouldSuccessfullyParse(svgColors[i]);
232
233
234 shouldSuccessfullyParse("#0f0");
235 shouldSuccessfullyParse("hsl(120, 100%, 50%)"); // Green HSL
236
237 // Invalid values.
238 shouldNotSuccessfullyParse("foobar");
239 shouldNotSuccessfullyParse("counter(foobar)");
240 shouldNotSuccessfullyParse("url(http://127.0.0.1:8080/)");
241 shouldNotSuccessfullyParse("inherited");
242 shouldNotSuccessfullyParse("#100%");
243 shouldNotSuccessfullyParse("#100px");
244 shouldNotSuccessfullyParse('-webkit-var("test")');
245
246 successfullyParsed = true;
247 </script>
248 <script src="../js/resources/js-test-post.js"></script>
249 </html>