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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
|
<!DOCTYPE html>
<title>calc-size() expressions</title>
<link rel="help" href="https://drafts.csswg.org/css-values-5/#calc-size">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../support/parsing-testcommon.js"></script>
<script>
test_valid_value("width", "calc-size(auto, size)");
test_valid_value("min-width", "calc-size(auto, size)");
test_valid_value("height", "calc-size(auto, size)");
test_valid_value("min-height", "calc-size(auto, size)");
test_invalid_value("max-height", "calc-size(auto, size)");
test_invalid_value("max-width", "calc-size(auto, size)");
test_invalid_value("height", "calc-size(none, size)");
test_invalid_value("width", "calc-size(none, size)");
test_invalid_value("min-height", "calc-size(none, size)");
test_invalid_value("min-width", "calc-size(none, size)");
test_invalid_value("max-height", "calc-size(none, size)");
test_invalid_value("max-width", "calc-size(none, size)");
test_valid_value("width", "calc-size(max-content, size)");
test_valid_value("height", "calc-size(max-content, size)");
test_valid_value("max-width", "calc-size(max-content, size)");
test_valid_value("max-height", "calc-size(max-content, size)");
test_valid_value("min-width", "calc-size(max-content, size)");
test_valid_value("min-height", "calc-size(max-content, size)");
test_valid_value("block-size", "calc-size(max-content, size)");
test_valid_value("inline-size", "calc-size(max-content, size)");
test_valid_value("max-block-size", "calc-size(max-content, size)");
test_valid_value("max-inline-size", "calc-size(max-content, size)");
test_valid_value("min-block-size", "calc-size(max-content, size)");
test_valid_value("min-inline-size", "calc-size(max-content, size)");
test_valid_value("width", "calc-size(fit-content, size)");
test_valid_value("height", "calc-size(min-content, size * 2)", "calc-size(min-content, 2 * size)");
test_valid_value("max-width", "calc-size(max-content, size / 2)", "calc-size(max-content, 0.5 * size)");
test_valid_value("max-height", "calc-size(fit-content, 30px + size / 2)", "calc-size(fit-content, 30px + (0.5 * size))");
test_valid_value("width", "calc-size(fit-content, 50% + size / 2)", "calc-size(fit-content, 50% + (0.5 * size))");
test_valid_value("width", "calc-size(any, 25em)");
test_valid_value("width", "calc-size(any, 40%)");
test_valid_value("width", "calc-size(any, 50px + 30%)", "calc-size(any, 30% + 50px)");
test_valid_value("width", "calc-size(calc-size(any, 30px), size)");
test_invalid_value("width", "calc-size(any, size)");
test_invalid_value("width", "calc-size(any, fit-content)");
test_invalid_value("width", "calc-size(any, max-content)");
test_invalid_value("width", "calc-size(any, min-content)");
test_valid_value("width", "calc-size(10px, sign(size) * size)");
test_invalid_value("width", "size");
test_invalid_value("width", "sign(size)");
test_invalid_value("width", "calc(50px * sign(size))");
test_invalid_value("width", "calc-size(any, calc-size(10px, sign(size) * size))");
test_invalid_value("width", "calc-size(any, calc-size(any, 10px))");
test_invalid_value("width", "calc(calc-size(auto, size))");
test_invalid_value("width", "calc(50px * sign(calc-size(auto, size)))");
test_invalid_value("width", "calc(calc-size(auto, size) + calc-size(auto, size))");
test_invalid_value("width", "calc(abs(calc-size(auto, size)))");
test_invalid_value("width", "calc(100px * progress(calc-size(auto, size) from calc-size(auto, 0px) to calc-size(auto, size)))");
test_invalid_value("width", "calc(100px * progress(calc-size(auto, size) from 0px to 100px))");
test_invalid_value("width", "calc(100px * progress(50px from calc-size(auto, 0px) to calc-size(auto, size)))");
test_invalid_value("width", "min(calc-size(auto, 0px), calc-size(auto, size))");
test_invalid_value("width", "calc(min(calc-size(auto, 0px), calc-size(auto, size)))");
test_invalid_value("width", "max(calc-size(auto, 0px), calc-size(auto, size))");
test_invalid_value("width", "calc(max(calc-size(auto, 0px), calc-size(auto, size)))");
test_invalid_value("width", "clamp(calc-size(auto, 0px), calc-size(auto, 30px), calc-size(auto, size))");
test_invalid_value("width", "calc(clamp(calc-size(auto, 0px), calc-size(auto, 30px), calc-size(auto, size)))");
test_invalid_value("width", "calc(cos(calc-size(auto, 0px)))");
test_invalid_value("width", "calc(atan2(calc-size(auto, size), calc-size(auto, 50px)))");
test_invalid_value("width", "calc(sqrt(calc-size(auto, 0px)))");
test_invalid_value("width", "calc(hypot(calc-size(auto, size * 0.5), calc-size(auto, size)))");
test_invalid_value("width", "calc(round(calc-size(auto, size * 0.5), calc-size(auto, size)))");
test_invalid_value("width", "calc(round(calc-size(auto, size * 0.5)))");
test_invalid_value("width", "calc(mod(calc-size(auto, size * 0.5), calc-size(auto, size)))");
test_invalid_value("width", "calc(rem(calc-size(auto, size * 0.5), calc-size(auto, size)))");
test_valid_value("width", "calc-size(30px, 25em)");
test_valid_value("width", "calc-size(calc-size(any, 30px), 25em)");
test_valid_value("width", "calc-size(calc-size(2in, 30px), 25em)", "calc-size(calc-size(192px, 30px), 25em)");
test_valid_value("width", "calc-size(calc-size(min-content, 30px), 25em)");
test_valid_value("width", "calc-size(calc-size(min-content, size), size)");
test_invalid_value("height", "calc(12% + calc-size(any, 31%))");
test_invalid_value("width", "calc-size(30px)");
test_invalid_value("width", "calc-size(min(30px, 2em))");
test_invalid_value("width", "calc-size(any)");
test_invalid_value("width", "calc-size(calc-size(any, 30px))");
test_invalid_value("width", "calc-size(size)");
test_invalid_value("width", "calc-size(fit-content)");
test_invalid_value("width", "calc-size(calc-size(fit-content, size * 2))");
test_invalid_value("width", "calc-size(calc-size(30px))");
test_valid_value("flex-basis", "calc-size(any, 50px)");
test_valid_value("flex-basis", "calc-size(auto, size)");
test_valid_value("flex-basis", "calc-size(min-content, size)");
test_valid_value("flex-basis", "calc-size(max-content, size)");
test_valid_value("flex-basis", "calc-size(fit-content, size)");
test_valid_value("flex-basis", "calc-size(content, size)");
test_invalid_value("width", "calc-size(content, size)");
test_invalid_value("height", "calc-size(content, size)");
test_invalid_value("max-width", "calc-size(content, size)");
test_invalid_value("max-height", "calc-size(content, size)");
test_invalid_value("min-width", "calc-size(content, size)");
test_invalid_value("min-height", "calc-size(content, size)");
test_valid_value("width", "calc-size(0px, 0px)");
test_invalid_value("width", "calc-size(0, 0px)");
test_invalid_value("width", "calc-size(0px, 0)");
test_invalid_value("width", "calc-size(0, 0)");
</script>
|
