69 lines
2.2 KiB
HTML
69 lines
2.2 KiB
HTML
<link rel=author title="Tab Atkins-Bittner" href="https://www.xanthir.com/contact/">
|
|
<link rel="help" href="https://drafts.csswg.org/css-values/#calc-range">
|
|
<body><!doctype html>
|
|
<title>Serializing Integers Never Uses Scinot</title>
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
|
|
<link rel=author title="Tab Atkins-Bittner" href="https://www.xanthir.com/contact/">
|
|
<link rel="help" href="https://drafts.csswg.org/cssom/#serialize-a-css-component-value">
|
|
<!--
|
|
Per CSSOM, integers always serialize all their digits out.
|
|
They never serialize to scinot, regardless of size,
|
|
because that makes them stop being an integer.
|
|
This applies to custom properties as well.
|
|
-->
|
|
<body>
|
|
|
|
<script>
|
|
|
|
try {
|
|
CSS.registerProperty({
|
|
name: "--two",
|
|
value: "<integer>",
|
|
inherits: true,
|
|
initial: -1
|
|
});
|
|
}catch(e){}
|
|
|
|
testIntLength(4);
|
|
testIntLength(6);
|
|
testIntLength(8);
|
|
testIntLength(12);
|
|
// JS starts serializing with scinot at 22 digits...
|
|
testIntLength(25);
|
|
|
|
function testIntLength(len) {
|
|
let el = document.body;
|
|
const val = "1".repeat(len);
|
|
test(()=>{
|
|
el.removeAttribute("style");
|
|
const nullVal = getComputedStyle(el).zIndex;
|
|
el.style.zIndex=val;
|
|
assert_not_equals(getComputedStyle(el).zIndex, nullVal)
|
|
}, `z-index can take a ${len}-digit integer`);
|
|
|
|
test(()=>{
|
|
el.removeAttribute("style");
|
|
el.style.setProperty("--one", val);
|
|
assert_equals(getComputedStyle(el).getPropertyValue("--one"), val);
|
|
}, `An unregistered custom prop can take a ${len}-digit integer`);
|
|
|
|
test(()=>{
|
|
el.removeAttribute("style");
|
|
el.style.setProperty("--two", val);
|
|
assert_equals(getComputedStyle(el).getPropertyValue("--two"), val);
|
|
}, `An <integer> custom prop can take a ${len}-digit integer`);
|
|
|
|
test(()=>{
|
|
el.removeAttribute("style");
|
|
el.style.zIndex = val;
|
|
const standardVal = getComputedStyle(el).zIndex;
|
|
el.removeAttribute("style");
|
|
el.style.setProperty("--three", val);
|
|
el.style.zIndex = "var(--three)";
|
|
assert_equals(getComputedStyle(el).zIndex, standardVal);
|
|
}, `z-index can take a custom property set to a ${len}-digit integer`);
|
|
}
|
|
|
|
</script>
|