| <!doctype html> |
| <meta charset="utf-8"> |
| <title>Normalization of raw CSS tokens tests</title> |
| <link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#normalize-tokens"> |
| <script src="../..//resources/testharness.js"></script> |
| <script src="../..//resources/testharnessreport.js"></script> |
| <script src="../resources/testhelper.js"></script> |
| <script> |
| 'use strict'; |
| |
| function assert_string_normalizes_to(property, str, expected) { |
| // From string |
| assert_style_value_equals(CSSStyleValue.parse(property, str), expected); |
| // From CSSOM |
| assert_style_value_equals( |
| newDivWithStyle(property + ':' + str).attributeStyleMap.get(property), |
| expected |
| ); |
| } |
| |
| const gTestCases = [ |
| { |
| value: 'var(--A)', |
| expectedResult: [ |
| new CSSVariableReferenceValue('--A'), |
| ] |
| }, |
| { |
| value: 'var(--A, 1em)', |
| expectedResult: [ |
| new CSSVariableReferenceValue('--A', new CSSUnparsedValue(' 1em')), |
| ] |
| }, |
| { |
| value: 'var(--A, var(--B))', |
| expectedResult: [ |
| new CSSVariableReferenceValue('--A', new CSSUnparsedValue(' ', new CSSVariableReferenceValue('--B'))), |
| ] |
| }, |
| { |
| value: 'calc(42px + var(--foo, 15em) + var(--bar, var(--far) + 15px))', |
| expectedResult: [ |
| 'calc(42px +', |
| new CSSVariableReferenceValue('--foo', new CSSUnparsedValue(' 15em')), |
| ' + ', |
| new CSSVariableReferenceValue('--bar', new CSSUnparsedValue(' ', new CSSVariableReferenceValue('--far'), ' + 15px')), |
| ')', |
| ] |
| }, |
| ]; |
| |
| for (const {value, expectedResult} of gTestCases) { |
| test(() => { |
| assert_string_normalizes_to('color', value, new CSSUnparsedValue(...expectedResult)); |
| }, 'Normalizing "' + value + '" on a CSS property returns correct CSSUnparsedValue'); |
| |
| test(() => { |
| assert_string_normalizes_to('--X', value, new CSSUnparsedValue(...expectedResult)); |
| }, 'Normalizing "' + value + '" on a custom property returns correct CSSUnparsedValue'); |
| } |
| |
| </script> |
