-
Notifications
You must be signed in to change notification settings - Fork 3.1k
/
color-invalid-color-function.html
71 lines (66 loc) · 3.56 KB
/
color-invalid-color-function.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Color Level 4: Parsing and serialization of colors using invalid color() function syntax</title>
<link rel="help" href="https://drafts.csswg.org/css-color-4/#color-function">
<link rel="help" href="https://drafts.csswg.org/css-color-4/#resolving-color-function-values">
<link rel="help" href="https://drafts.csswg.org/css-color-4/#serializing-color-function-values">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
const RGB_SPACES = ["srgb", "srgb-linear", "a98-rgb", "rec2020", "prophoto-rgb"];
const XYZ_SPACES = ["xyz", "xyz-d50", "xyz-d65"];
for (const colorSpace of RGB_SPACES) {
test_invalid_value("color", `color(${colorSpace} 0 0 0 0)`);
test_invalid_value("color", `color(${colorSpace} 0deg 0% 0)`);
test_invalid_value("color", `color(${colorSpace} 0% 0 0 1)`);
test_invalid_value("color", `color(${colorSpace} 0% 0 0 10%)`);
test_invalid_value("color", `color(${colorSpace} 0% 0 0deg)`);
test_invalid_value("color", `color(${colorSpace} 0% 0% 0deg)`);
test_invalid_value("color", `color(${colorSpace} 40% 0 0deg)`);
// Missing parameters should not parse
test_invalid_value("color", `color(${colorSpace} 50% -200)`);
test_invalid_value("color", `color(${colorSpace} 50%)`);
test_invalid_value("color", `color(${colorSpace})`);
test_invalid_value("color", `color(${colorSpace} 50% -200 / 0.5)`);
test_invalid_value("color", `color(${colorSpace} 50% / 0.5)`);
test_invalid_value("color", `color(${colorSpace} / 0.5)`);
}
for (const colorSpace of XYZ_SPACES) {
test_invalid_value("color", `color(${colorSpace} 0 0 0 0)`);
test_invalid_value("color", `color(${colorSpace} 0deg 0% 0)`);
test_invalid_value("color", `color(${colorSpace} 0% 0 0 1)`);
test_invalid_value("color", `color(${colorSpace} 0% 0 0 10%)`);
test_invalid_value("color", `color(${colorSpace} 0% 0 0deg)`);
test_invalid_value("color", `color(${colorSpace} 0% 0% 0deg)`);
test_invalid_value("color", `color(${colorSpace} 40% 0 0deg)`);
// Missing parameters should not parse
test_invalid_value("color", `color(${colorSpace} 1 1)`);
test_invalid_value("color", `color(${colorSpace} 1)`);
test_invalid_value("color", `color(${colorSpace})`);
test_invalid_value("color", `color(${colorSpace} 1 1 / .5)`);
test_invalid_value("color", `color(${colorSpace} 1 / 0.5)`);
test_invalid_value("color", `color(${colorSpace} / 50%)`);
}
test_invalid_value("color", "color()"); // Empty
test_invalid_value("color", "color(banana 1 1 1)"); // Bad color space
test_invalid_value("color", "color(displayp3 1 1 1)"); // Bad Display P3 color space
test_invalid_value("color", "color(1 1 1)"); // No color space
test_invalid_value("color", "color(srgb 1 1)"); // One missing component
test_invalid_value("color", "color(srgb 1)"); // Two missing components
test_invalid_value("color", "color(srgb 0, 0, 0)"); // Commas as separators
test_invalid_value("color", "color(srgb 1 1 1 1)"); // Too many parameters
test_invalid_value("color", "color(srgb 1 1 1 1 1)"); // Way too many parameters
test_invalid_value("color", "color(srgb 1 eggs 1)"); // Bad parameters
test_invalid_value("color", "color(srgb 1 1 1 / bacon)"); // Bad alpha
test_invalid_value("color", "color(srgb 1 1 1 / 1 cucumber)"); // Junk after alpha
for (const colorSpace of [...RGB_SPACES, ...XYZ_SPACES]) {
test_invalid_value("color", `${colorSpace}(0 0 0)`);
}
</script>
</body>
</html>