| <!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> |
| <body> |
| <script> |
| 'use strict'; |
| |
| function assert_string_normalizes_to(test, property, str, expected) { |
| // From string |
| assert_style_value_equals(CSSStyleValue.parse(property, str), expected); |
| // From CSSOM |
| assert_style_value_equals( |
| createInlineStyleMap(test, property + ':' + str).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(t => { |
| assert_string_normalizes_to(t, 'color', value, new CSSUnparsedValue(expectedResult)); |
| }, 'Normalizing "' + value + '" on a CSS property returns correct CSSUnparsedValue'); |
| |
| test(t => { |
| assert_string_normalizes_to(t, 'margin', value, new CSSUnparsedValue(expectedResult)); |
| assert_false(true); |
| }, 'Normalizing "' + value + '" on a shorthand returns correct CSSUnparsedValue'); |
| |
| test(t => { |
| assert_string_normalizes_to(t, 'transition-duration', value, new CSSUnparsedValue(expectedResult)); |
| }, 'Normalizing "' + value + '" on a list-valued property returns correct CSSUnparsedValue'); |
| |
| test(t => { |
| assert_string_normalizes_to(t, '--X', value, new CSSUnparsedValue(expectedResult)); |
| }, 'Normalizing "' + value + '" on a custom property returns correct CSSUnparsedValue'); |
| } |
| |
| </script> |
