dashed-function-named-arg.tentative.html (1546B)
1 <!DOCTYPE html> 2 <title>Custom Functions: <dashed-function> with named argument syntax</title> 3 <link rel="help" href="https://drafts.csswg.org/css-mixins-1/#function-rule"> 4 <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11749"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="/css/support/parsing-testcommon.js"></script> 8 <script> 9 test_valid_value('top', '--func(myident)'); 10 test_valid_value('top', '--func(--myident)'); 11 test_valid_value('top', '--func(--)'); 12 test_valid_value('top', '--func(50px --myident:)'); 13 14 // Arguments may not begin within <dashed-ident> <colon> (ignoring whitespace); 15 // this pattern is reserved for named arguments in the future. 16 // 17 // https://github.com/w3c/csswg-drafts/issues/11749 18 // 19 // Note: This matches the "bad declaration" handling in 20 // https://drafts.csswg.org/css-syntax/#consume-qualified-rule 21 test_invalid_value('top', '--func(--myident:)'); 22 test_invalid_value('top', '--func( --myident:)'); 23 test_invalid_value('top', '--func(--myident :)'); 24 test_invalid_value('top', '--func(--myident: )'); 25 test_invalid_value('top', '--func( --myident : )'); 26 test_invalid_value('top', '--func(10px, --myident : )'); 27 28 // It's valid when wrapped in {}, though: 29 test_valid_value('top', '--func({--myident:})'); 30 test_valid_value('top', '--func({ --myident:})'); 31 test_valid_value('top', '--func({--myident :})'); 32 test_valid_value('top', '--func({--myident: })'); 33 test_valid_value('top', '--func(10px, { --myident : })'); 34 </script>