blob: c4215cb339e023a1b5f50995fd4e1e4e9f50b51b [file] [log] [blame]
<!doctype html>
<meta charset="utf-8">
<title>Declared StylePropertyMap.get</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#get-a-value-from-a-stylepropertymap">
<meta name="assert" content="Test declared StylePropertyMap.get" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<body>
<div id="log">
<script>
'use strict';
test(t => {
const styleMap = createDeclaredStyleMap(t, '--foo: auto');
assert_equals(styleMap.get('--Foo'), null);
}, 'Getting a custom property not in the CSS rule returns null');
test(t => {
const styleMap = createDeclaredStyleMap(t, '');
assert_equals(styleMap.get('width'), null);
}, 'Getting a valid property not in the CSS rule returns null');
test(t => {
const styleMap = createDeclaredStyleMap(t, 'width: 10px; height: 20px');
assert_style_value_equals(styleMap.get('width'), new CSSUnitValue(10, 'px'));
}, 'Getting a valid property from CSS rule returns the correct entry');
test(t => {
const styleMap = createDeclaredStyleMap(t, '--foo: auto; --bar: 10px');
assert_style_value_equals(styleMap.get('--foo'),
new CSSUnparsedValue([' auto']));
}, 'Getting a valid custom property from CSS rule returns the ' +
'correct entry');
test(t => {
const styleMap = createDeclaredStyleMap(t,
'width: 10px; transition-duration: 1s, 2s; height: 10px;');
assert_style_value_equals(styleMap.get('transition-duration'),
new CSSUnitValue(1, 's'));
}, 'Getting a list-valued property from CSS rule returns only ' +
'the first value');
test(t => {
const styleMap = createDeclaredStyleMap(t, 'height: 20px; width: 10px;');
assert_style_value_equals(styleMap.get('wIdTh'), new CSSUnitValue(10, 'px'));
}, 'Declared StylePropertyMap.get is not case-sensitive');
test(t => {
const [rule, styleMap] = createRuleWithDeclaredStyleMap(t, 'width: 10px;');
assert_style_value_equals(styleMap.get('width'), new CSSUnitValue(10, 'px'));
rule.style.width = '20px';
assert_style_value_equals(styleMap.get('width'), new CSSUnitValue(20, 'px'));
}, 'Declared StylePropertyMap.get reflects changes in the CSS rule');
</script>