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 </script>
 246 <script src="../js/resources/js-test-post.js"></script>
 247 </html>