| <!doctype html> |
| <meta charset="utf-8"> |
| <title>Computed 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 computed 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 = createComputedStyleMap(t, '--foo: auto'); |
| assert_equals(styleMap.get('--Foo'), null); |
| }, 'Getting a custom property not in the computed style returns null'); |
| |
| test(t => { |
| const styleMap = createComputedStyleMap(t, 'width: 10px; height: 20px'); |
| assert_style_value_equals(styleMap.get('width'), new CSSUnitValue(10, 'px')); |
| }, 'Getting a valid property from computed style returns the correct entry'); |
| |
| test(t => { |
| const styleMap = createComputedStyleMap(t, '--foo: auto; --bar: 10px'); |
| assert_style_value_equals(styleMap.get('--foo'), |
| new CSSUnparsedValue([' auto'])); |
| }, 'Getting a valid custom property from computed style returns the ' + |
| 'correct entry'); |
| |
| test(t => { |
| const styleMap = createComputedStyleMap(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 computed style returns only ' + |
| 'the first value'); |
| |
| test(t => { |
| const styleMap = createComputedStyleMap(t, 'height: 20px; width: 10px;'); |
| assert_style_value_equals(styleMap.get('wIdTh'), new CSSUnitValue(10, 'px')); |
| }, 'Computed StylePropertyMap.get is not case-sensitive'); |
| |
| test(t => { |
| const [elem, styleMap] = createElementWithComputedStyleMap(t, 'width: 10px;'); |
| assert_style_value_equals(styleMap.get('width'), new CSSUnitValue(10, 'px')); |
| elem.style.width = '20px'; |
| assert_style_value_equals(styleMap.get('width'), new CSSUnitValue(20, 'px')); |
| }, 'Computed StylePropertyMap.get reflects updates in inline style'); |
| |
| </script> |
