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/attr-length-specified.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<title>CSS Values and Units Test: attr() specified length</title>
<meta name="assert" content="Test attr() specified length">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
div {
--foo: attr(data-foo type(<length>));
--bar: attr(data-bar type(<length>));
--baz: attr(data-baz em);
}
</style>
<div
data-foo="3em"
data-bar="3EM"
data-baz="3"
/ >
<script>
var elem = getComputedStyle(document.querySelector("div"));
test(() => {
assert_equals(elem.getPropertyValue("--foo"), "3em");
}, "type(<length>) lowercase")
test(() => {
assert_equals(elem.getPropertyValue("--bar"), "3em");
}, "type(<length>) uppercase")
test(() => {
assert_equals(elem.getPropertyValue("--baz"), "3em");
}, "Unit (em) number")
</script>