https://github.com/web-platform-tests/wpt
Tip revision: 093b9474d12dc945dccdff7cc35ace71b60c9978 authored by moz-wptsync-bot on 13 March 2018, 19:14:12 UTC
Add a WPT test for calc font-variation-settings.
Add a WPT test for calc font-variation-settings.
Tip revision: 093b947
color-resolving-keywords.html
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Color 4: Resolving keyword color values</title>
<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
<link rel="help" href="https://drafts.csswg.org/css-color-4/#resolving-color-values">
<meta name="assert" content="Tests if keyword color values are resolved properly">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id="parent" style="color: rgb(45, 23, 27)">
<div id="inner"></div>
</div>
<script>
function color_test(color, expected, reason) {
test(function() {
var element = document.getElementById('inner');
// Random value not in our test data.
fail_value = "rgb(12, 34, 223)"
element.style.color = "black";
element.style.cssText = "color: " + fail_value + "; color: " + color;
if (expected === null)
assert_equals(getComputedStyle(element).color, fail_value);
else
assert_equals(getComputedStyle(element).color, expected);
}, `${reason}: ${color}`);
}
function expected_value(rgb_channels) {
if (rgb_channels === null)
return null;
else if (rgb_channels.length === 3 || rgb_channels[3] == 1)
return "rgb(" + rgb_channels.slice(0, 3).join(", ") + ")";
else
return "rgba(" + rgb_channels.join(", ") + ")";
}
keywords = [
['transparent', [0, 0, 0, 0]],
['aliceblue', [240, 248, 255, 1]],
['antiquewhite', [250, 235, 215, 1]],
['aqua', [0, 255, 255, 1]],
['aquamarine', [127, 255, 212, 1]],
['azure', [240, 255, 255, 1]],
['beige', [245, 245, 220, 1]],
['bisque', [255, 228, 196, 1]],
['black', [0, 0, 0, 1]],
['blanchedalmond', [255, 235, 205, 1]],
['blue', [0, 0, 255, 1]],
['blueviolet', [138, 43, 226, 1]],
['brown', [165, 42, 42, 1]],
['burlywood', [222, 184, 135, 1]],
['cadetblue', [95, 158, 160, 1]],
['chartreuse', [127, 255, 0, 1]],
['chocolate', [210, 105, 30, 1]],
['coral', [255, 127, 80, 1]],
['cornflowerblue', [100, 149, 237, 1]],
['cornsilk', [255, 248, 220, 1]],
['crimson', [220, 20, 60, 1]],
['cyan', [0, 255, 255, 1]],
['darkblue', [0, 0, 139, 1]],
['darkcyan', [0, 139, 139, 1]],
['darkgoldenrod', [184, 134, 11, 1]],
['darkgray', [169, 169, 169, 1]],
['darkgreen', [0, 100, 0, 1]],
['darkgrey', [169, 169, 169, 1]],
['darkkhaki', [189, 183, 107, 1]],
['darkmagenta', [139, 0, 139, 1]],
['darkolivegreen', [85, 107, 47, 1]],
['darkorange', [255, 140, 0, 1]],
['darkorchid', [153, 50, 204, 1]],
['darkred', [139, 0, 0, 1]],
['darksalmon', [233, 150, 122, 1]],
['darkseagreen', [143, 188, 143, 1]],
['darkslateblue', [72, 61, 139, 1]],
['darkslategray', [47, 79, 79, 1]],
['darkslategrey', [47, 79, 79, 1]],
['darkturquoise', [0, 206, 209, 1]],
['darkviolet', [148, 0, 211, 1]],
['deeppink', [255, 20, 147, 1]],
['deepskyblue', [0, 191, 255, 1]],
['dimgray', [105, 105, 105, 1]],
['dimgrey', [105, 105, 105, 1]],
['dodgerblue', [30, 144, 255, 1]],
['firebrick', [178, 34, 34, 1]],
['floralwhite', [255, 250, 240, 1]],
['forestgreen', [34, 139, 34, 1]],
['fuchsia', [255, 0, 255, 1]],
['gainsboro', [220, 220, 220, 1]],
['ghostwhite', [248, 248, 255, 1]],
['gold', [255, 215, 0, 1]],
['goldenrod', [218, 165, 32, 1]],
['gray', [128, 128, 128, 1]],
['green', [0, 128, 0, 1]],
['greenyellow', [173, 255, 47, 1]],
['grey', [128, 128, 128, 1]],
['honeydew', [240, 255, 240, 1]],
['hotpink', [255, 105, 180, 1]],
['indianred', [205, 92, 92, 1]],
['indigo', [75, 0, 130, 1]],
['ivory', [255, 255, 240, 1]],
['khaki', [240, 230, 140, 1]],
['lavender', [230, 230, 250, 1]],
['lavenderblush', [255, 240, 245, 1]],
['lawngreen', [124, 252, 0, 1]],
['lemonchiffon', [255, 250, 205, 1]],
['lightblue', [173, 216, 230, 1]],
['lightcoral', [240, 128, 128, 1]],
['lightcyan', [224, 255, 255, 1]],
['lightgoldenrodyellow', [250, 250, 210, 1]],
['lightgray', [211, 211, 211, 1]],
['lightgreen', [144, 238, 144, 1]],
['lightgrey', [211, 211, 211, 1]],
['lightpink', [255, 182, 193, 1]],
['lightsalmon', [255, 160, 122, 1]],
['lightseagreen', [32, 178, 170, 1]],
['lightskyblue', [135, 206, 250, 1]],
['lightslategray', [119, 136, 153, 1]],
['lightslategrey', [119, 136, 153, 1]],
['lightsteelblue', [176, 196, 222, 1]],
['lightyellow', [255, 255, 224, 1]],
['lime', [0, 255, 0, 1]],
['limegreen', [50, 205, 50, 1]],
['linen', [250, 240, 230, 1]],
['magenta', [255, 0, 255, 1]],
['maroon', [128, 0, 0, 1]],
['mediumaquamarine', [102, 205, 170, 1]],
['mediumblue', [0, 0, 205, 1]],
['mediumorchid', [186, 85, 211, 1]],
['mediumpurple', [147, 112, 219, 1]],
['mediumseagreen', [60, 179, 113, 1]],
['mediumslateblue', [123, 104, 238, 1]],
['mediumspringgreen', [0, 250, 154, 1]],
['mediumturquoise', [72, 209, 204, 1]],
['mediumvioletred', [199, 21, 133, 1]],
['midnightblue', [25, 25, 112, 1]],
['mintcream', [245, 255, 250, 1]],
['mistyrose', [255, 228, 225, 1]],
['moccasin', [255, 228, 181, 1]],
['navajowhite', [255, 222, 173, 1]],
['navy', [0, 0, 128, 1]],
['oldlace', [253, 245, 230, 1]],
['olive', [128, 128, 0, 1]],
['olivedrab', [107, 142, 35, 1]],
['orange', [255, 165, 0, 1]],
['orangered', [255, 69, 0, 1]],
['orchid', [218, 112, 214, 1]],
['palegoldenrod', [238, 232, 170, 1]],
['palegreen', [152, 251, 152, 1]],
['paleturquoise', [175, 238, 238, 1]],
['palevioletred', [219, 112, 147, 1]],
['papayawhip', [255, 239, 213, 1]],
['peachpuff', [255, 218, 185, 1]],
['peru', [205, 133, 63, 1]],
['pink', [255, 192, 203, 1]],
['plum', [221, 160, 221, 1]],
['powderblue', [176, 224, 230, 1]],
['purple', [128, 0, 128, 1]],
['red', [255, 0, 0, 1]],
['rosybrown', [188, 143, 143, 1]],
['royalblue', [65, 105, 225, 1]],
['saddlebrown', [139, 69, 19, 1]],
['salmon', [250, 128, 114, 1]],
['sandybrown', [244, 164, 96, 1]],
['seagreen', [46, 139, 87, 1]],
['seashell', [255, 245, 238, 1]],
['sienna', [160, 82, 45, 1]],
['silver', [192, 192, 192, 1]],
['skyblue', [135, 206, 235, 1]],
['slateblue', [106, 90, 205, 1]],
['slategray', [112, 128, 144, 1]],
['slategrey', [112, 128, 144, 1]],
['snow', [255, 250, 250, 1]],
['springgreen', [0, 255, 127, 1]],
['steelblue', [70, 130, 180, 1]],
['tan', [210, 180, 140, 1]],
['teal', [0, 128, 128, 1]],
['thistle', [216, 191, 216, 1]],
['tomato', [255, 99, 71, 1]],
['turquoise', [64, 224, 208, 1]],
['violet', [238, 130, 238, 1]],
['wheat', [245, 222, 179, 1]],
['white', [255, 255, 255, 1]],
['whitesmoke', [245, 245, 245, 1]],
['yellow', [255, 255, 0, 1]],
['yellowgreen', [154, 205, 50, 1]],
]
for (var value in keywords) {
items_to_test = keywords[value];
keyword = items_to_test[0];
expected = expected_value(items_to_test[1]);
letter = value % keyword.length;
replacement = keyword;
color_test(keyword, expected, "Keyword should parse properly");
color_test(keyword.toUpperCase(), expected, "Keywords should be case-insensitive");
replacement[letter] = "\\" + keyword.codePointAt(letter);
color_test(replacement, expected, "Code point should parse");
color_test(keyword.slice(0, letter) + keyword.slice(letter + 1, keyword.length), null, "Partial keywords shouldn't parse");
if (keyword.indexOf('k') !== -1)
color_test(keyword.replace('k', 'K'), null, "Unicode modification shouldn't parse");
}
</script>
