Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/css-values/clamp-none-whitespace.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Values: clamp() accepts whitespace around a 'none' argument</title>
<meta name="assert" content="clamp( [ <calc-sum> | none ], <calc-sum>, [ <calc-sum> | none ] ) must accept optional whitespace around the 'none' keyword, including before the following comma and after a trailing 'none', exactly as it does for a <calc-sum> argument.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id="log"></div>
<script>
// Returns the serialized specified value of 'width' for the given declaration,
// or "" if the declaration was rejected as invalid.
function serializeWidth(value) {
const el = document.createElement("div");
el.style.width = value;
return el.style.width;
}
// The 'none' argument with insignificant whitespace must parse identically to
// the same value without that whitespace. Comparing against the no-whitespace
// control avoids hard-coding clamp()'s canonical serialization.
test(() => {
const control = serializeWidth("clamp(none, 5px, 10px)");
assert_not_equals(control, "", "clamp() with 'none' as the min argument is supported");
assert_equals(serializeWidth("clamp(none , 5px, 10px)"), control,
"whitespace between 'none' and the following comma");
}, "clamp() accepts whitespace between a 'none' min argument and the following comma");
test(() => {
const control = serializeWidth("clamp(5px, 6px, none)");
assert_not_equals(control, "", "clamp() with 'none' as the max argument is supported");
assert_equals(serializeWidth("clamp(5px, 6px, none )"), control,
"whitespace after a trailing 'none'");
}, "clamp() accepts whitespace after a trailing 'none' max argument");
test(() => {
const control = serializeWidth("clamp(none, 5px, none)");
assert_not_equals(control, "", "clamp() with 'none' as both bounds is supported");
assert_equals(serializeWidth("clamp( none , 5px , none )"), control,
"whitespace around both 'none' bounds");
}, "clamp() accepts whitespace around 'none' for both bounds");
</script>