197 lines
6.8 KiB
HTML
197 lines
6.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Named Colors Test</title>
|
|
<script>
|
|
|
|
if (window.testRunner)
|
|
testRunner.dumpAsText();
|
|
|
|
// Named colors and their rgb values as per the css3 specification.
|
|
// http://www.w3.org/TR/css3-color/#svg-color
|
|
var colors = [
|
|
['aliceblue', '240,248,255'],
|
|
['antiquewhite', '250,235,215'],
|
|
['aqua', '0,255,255'],
|
|
['aquamarine', '127,255,212'],
|
|
['azure', '240,255,255'],
|
|
['beige', '245,245,220'],
|
|
['bisque', '255,228,196'],
|
|
['black', '0,0,0'],
|
|
['blanchedalmond', '255,235,205'],
|
|
['blue', '0,0,255'],
|
|
['blueviolet', '138,43,226'],
|
|
['brown', '165,42,42'],
|
|
['burlywood', '222,184,135'],
|
|
['cadetblue', '95,158,160'],
|
|
['chartreuse', '127,255,0'],
|
|
['chocolate', '210,105,30'],
|
|
['coral', '255,127,80'],
|
|
['cornflowerblue', '100,149,237'],
|
|
['cornsilk', '255,248,220'],
|
|
['crimson', '220,20,60'],
|
|
['cyan', '0,255,255'],
|
|
['darkblue', '0,0,139'],
|
|
['darkcyan', '0,139,139'],
|
|
['darkgoldenrod', '184,134,11'],
|
|
['darkgray', '169,169,169'],
|
|
['darkgreen', '0,100,0'],
|
|
['darkgrey', '169,169,169'],
|
|
['darkkhaki', '189,183,107'],
|
|
['darkmagenta', '139,0,139'],
|
|
['darkolivegreen', '85,107,47'],
|
|
['darkorange', '255,140,0'],
|
|
['darkorchid', '153,50,204'],
|
|
['darkred', '139,0,0'],
|
|
['darksalmon', '233,150,122'],
|
|
['darkseagreen', '143,188,143'],
|
|
['darkslateblue', '72,61,139'],
|
|
['darkslategray', '47,79,79'],
|
|
['darkslategrey', '47,79,79'],
|
|
['darkturquoise', '0,206,209'],
|
|
['darkviolet', '148,0,211'],
|
|
['deeppink', '255,20,147'],
|
|
['deepskyblue', '0,191,255'],
|
|
['dimgray', '105,105,105'],
|
|
['dimgrey', '105,105,105'],
|
|
['dodgerblue', '30,144,255'],
|
|
['firebrick', '178,34,34'],
|
|
['floralwhite', '255,250,240'],
|
|
['forestgreen', '34,139,34'],
|
|
['fuchsia', '255,0,255'],
|
|
['gainsboro', '220,220,220'],
|
|
['ghostwhite', '248,248,255'],
|
|
['gold', '255,215,0'],
|
|
['goldenrod', '218,165,32'],
|
|
['gray', '128,128,128'],
|
|
['green', '0,128,0'],
|
|
['greenyellow', '173,255,47'],
|
|
['grey', '128,128,128'],
|
|
['honeydew', '240,255,240'],
|
|
['hotpink', '255,105,180'],
|
|
['indianred', '205,92,92'],
|
|
['indigo', '75,0,130'],
|
|
['ivory', '255,255,240'],
|
|
['khaki', '240,230,140'],
|
|
['lavender', '230,230,250'],
|
|
['lavenderblush', '255,240,245'],
|
|
['lawngreen', '124,252,0'],
|
|
['lemonchiffon', '255,250,205'],
|
|
['lightblue', '173,216,230'],
|
|
['lightcoral', '240,128,128'],
|
|
['lightcyan', '224,255,255'],
|
|
['lightgoldenrodyellow', '250,250,210'],
|
|
['lightgray', '211,211,211'],
|
|
['lightgreen', '144,238,144'],
|
|
['lightgrey', '211,211,211'],
|
|
['lightpink', '255,182,193'],
|
|
['lightsalmon', '255,160,122'],
|
|
['lightseagreen', '32,178,170'],
|
|
['lightskyblue', '135,206,250'],
|
|
['lightslategray', '119,136,153'],
|
|
['lightslategrey', '119,136,153'],
|
|
['lightsteelblue', '176,196,222'],
|
|
['lightyellow', '255,255,224'],
|
|
['lime', '0,255,0'],
|
|
['limegreen', '50,205,50'],
|
|
['linen', '250,240,230'],
|
|
['magenta', '255,0,255'],
|
|
['maroon', '128,0,0'],
|
|
['mediumaquamarine', '102,205,170'],
|
|
['mediumblue', '0,0,205'],
|
|
['mediumorchid', '186,85,211'],
|
|
['mediumpurple', '147,112,219'],
|
|
['mediumseagreen', '60,179,113'],
|
|
['mediumslateblue', '123,104,238'],
|
|
['mediumspringgreen', '0,250,154'],
|
|
['mediumturquoise', '72,209,204'],
|
|
['mediumvioletred', '199,21,133'],
|
|
['midnightblue', '25,25,112'],
|
|
['mintcream', '245,255,250'],
|
|
['mistyrose', '255,228,225'],
|
|
['moccasin', '255,228,181'],
|
|
['navajowhite', '255,222,173'],
|
|
['navy', '0,0,128'],
|
|
['oldlace', '253,245,230'],
|
|
['olive', '128,128,0'],
|
|
['olivedrab', '107,142,35'],
|
|
['orange', '255,165,0'],
|
|
['orangered', '255,69,0'],
|
|
['orchid', '218,112,214'],
|
|
['palegoldenrod', '238,232,170'],
|
|
['palegreen', '152,251,152'],
|
|
['paleturquoise', '175,238,238'],
|
|
['palevioletred', '219,112,147'],
|
|
['papayawhip', '255,239,213'],
|
|
['peachpuff', '255,218,185'],
|
|
['peru', '205,133,63'],
|
|
['pink', '255,192,203'],
|
|
['plum', '221,160,221'],
|
|
['powderblue', '176,224,230'],
|
|
['purple', '128,0,128'],
|
|
['rebeccapurple', '102,51,153'],
|
|
['red', '255,0,0'],
|
|
['rosybrown', '188,143,143'],
|
|
['royalblue', '65,105,225'],
|
|
['saddlebrown', '139,69,19'],
|
|
['salmon', '250,128,114'],
|
|
['sandybrown', '244,164,96'],
|
|
['seagreen', '46,139,87'],
|
|
['seashell', '255,245,238'],
|
|
['sienna', '160,82,45'],
|
|
['silver', '192,192,192'],
|
|
['skyblue', '135,206,235'],
|
|
['slateblue', '106,90,205'],
|
|
['slategray', '112,128,144'],
|
|
['slategrey', '112,128,144'],
|
|
['snow', '255,250,250'],
|
|
['springgreen', '0,255,127'],
|
|
['steelblue', '70,130,180'],
|
|
['tan', '210,180,140'],
|
|
['teal', '0,128,128'],
|
|
['thistle', '216,191,216'],
|
|
['tomato', '255,99,71'],
|
|
['turquoise', '64,224,208'],
|
|
['violet', '238,130,238'],
|
|
['wheat', '245,222,179'],
|
|
['white', '255,255,255'],
|
|
['whitesmoke', '245,245,245'],
|
|
['yellow', '255,255,0'],
|
|
['yellowgreen', '154,205,50']
|
|
];
|
|
|
|
function testColor(colorName, expected)
|
|
{
|
|
var element = document.createElement("div");
|
|
var statusSpan = document.createElement("span");
|
|
element.appendChild(statusSpan);
|
|
var colorSpan = document.createElement("span");
|
|
colorSpan.appendChild(document.createTextNode(colorName));
|
|
colorSpan.style.backgroundColor = colorName;
|
|
element.appendChild(colorSpan);
|
|
document.body.appendChild(element);
|
|
|
|
var value = document.defaultView.getComputedStyle(colorSpan, "").getPropertyValue("background-color");
|
|
var actual = value.match(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/).splice(1).join(',');
|
|
if (actual == expected) {
|
|
statusSpan.appendChild(document.createTextNode('PASS '));
|
|
element.appendChild(document.createTextNode(' is ' + actual));
|
|
} else {
|
|
statusSpan.appendChild(document.createTextNode('FAIL '));
|
|
element.appendChild(document.createTextNode(' was ' + actual + ', expected ' + expected));
|
|
}
|
|
}
|
|
|
|
function test()
|
|
{
|
|
for (var color, i = 0; color = colors[i]; i++) {
|
|
testColor(color[0], color[1]);
|
|
}
|
|
}
|
|
|
|
</script>
|
|
</head>
|
|
<body onload="test()">
|
|
</body>
|
|
</html>
|