OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE HTML> |
| 2 <script src="../resources/testharness.js"></script> |
| 3 <script src="../resources/testharnessreport.js"></script> |
| 4 <script> |
| 5 function assert_valid(syntax, initialValue) { |
| 6 // No actual assertions, this just shouldn't throw |
| 7 test(function() { |
| 8 try { CSS.unregisterProperty('--syntax-test'); } catch(e) { } |
| 9 CSS.registerProperty({name: '--syntax-test', syntax: syntax, initialValu
e: initialValue}); |
| 10 }, "syntax:'" + syntax + "', initialValue:'" + initialValue + "' is valid"); |
| 11 } |
| 12 |
| 13 function assert_invalid(syntax, initialValue) { |
| 14 test(function(){ |
| 15 try { CSS.unregisterProperty('--syntax-test'); } catch(e) { } |
| 16 assert_throws(new SyntaxError(), |
| 17 () => CSS.registerProperty({name: '--syntax-test', syntax: syntax, i
nitialValue: initialValue})); |
| 18 }, "syntax:'" + syntax + "', initialValue:'" + initialValue + "' is invalid"
); |
| 19 } |
| 20 |
| 21 assert_valid("*", "a"); |
| 22 assert_valid(" * ", "b"); |
| 23 assert_valid("<length>", "2px"); |
| 24 assert_valid(" <number>", "5"); |
| 25 assert_valid("<percentage> ", "10%"); |
| 26 assert_valid("<color>+", "red"); |
| 27 assert_valid(" <length>+ | <percentage>", "2px 8px"); |
| 28 assert_valid("<length>|<percentage>|<length-percentage>", "2px"); // Valid but s
illy |
| 29 assert_valid("<color> | <image> | <url> | <integer> | <angle>", "red"); |
| 30 assert_valid("<time> | <resolution> | <transform-function> | <custom-ident>", "r
ed"); |
| 31 |
| 32 assert_valid("*", ":> hello"); |
| 33 assert_valid("*", "([ brackets ]) { yay (??)}"); |
| 34 assert_valid("*", "yep 'this is valid too'"); |
| 35 assert_valid("*", "unmatched opening bracket is valid :("); |
| 36 assert_valid("*", '"'); |
| 37 |
| 38 assert_valid("<length>", "0"); |
| 39 assert_valid("<length>", "10px /*:)*/"); |
| 40 assert_valid("<length>", " calc(-2px)"); |
| 41 assert_valid("<length>", "calc(2px*4 + 10px)"); |
| 42 assert_valid("<length>", "7.1e-4cm"); |
| 43 assert_valid("<length>", "calc(7in - 12px)"); |
| 44 assert_valid("<length>+", "2px 7px calc(8px)"); |
| 45 assert_valid("<percentage>", "-9.3e3%"); |
| 46 assert_valid("<length-percentage>", "-54%"); |
| 47 assert_valid("<length-percentage>", "0"); |
| 48 assert_valid("<length-percentage>", "calc(-11px + 10.4%)"); |
| 49 |
| 50 assert_valid("<number>", "-109"); |
| 51 assert_valid("<number>", "2.3e4"); |
| 52 assert_valid("<integer>", "-109"); |
| 53 assert_valid("<integer>", "19"); |
| 54 |
| 55 assert_valid("<angle>", "10deg"); |
| 56 assert_valid("<angle>", "20.5rad"); |
| 57 assert_valid("<angle>", "calc(50grad + 3.14159rad)"); |
| 58 assert_valid("<time>", "2s"); |
| 59 assert_valid("<time>", "calc(2s - 9ms)"); |
| 60 assert_valid("<resolution>", "10dpi"); |
| 61 assert_valid("<resolution>", "-5.3dpcm"); |
| 62 assert_valid("<transform-function>", "scale(2)"); |
| 63 assert_valid("<transform-function>+", "translateX(2px) rotate(20deg)"); |
| 64 |
| 65 assert_valid("<color>", "rgb(12, 34, 56)"); |
| 66 assert_valid("<color>", "lightgoldenrodyellow"); |
| 67 assert_valid("<image>", "url(a)"); |
| 68 assert_valid("<image>", "linear-gradient(yellow, blue)"); |
| 69 assert_valid("<url>", "url(a)"); |
| 70 |
| 71 assert_valid("banana", "banana"); |
| 72 assert_valid("bAnAnA", "bAnAnA"); |
| 73 assert_valid("ba-na-nya", "ba-na-nya"); |
| 74 assert_valid("banana", "banan\\61"); |
| 75 assert_valid("<custom-ident>", "banan\\61"); |
| 76 assert_valid("big | bigger | BIGGER", "bigger"); |
| 77 assert_valid("foo+|bar", "foo foo foo"); |
| 78 |
| 79 assert_valid("banana\t", "banana"); |
| 80 assert_valid("\nbanana\r\n", "banana"); |
| 81 assert_valid("ba\f\n|\tna\r|nya", "nya"); |
| 82 |
| 83 assert_valid(null, "null"); |
| 84 assert_valid(undefined, "undefined"); |
| 85 assert_valid(["banana"], "banana"); |
| 86 |
| 87 // Invalid syntax |
| 88 assert_invalid("banana,nya", "banana"); |
| 89 assert_invalid("banan\\61", "banana"); |
| 90 assert_invalid("<\\6c ength>", "10px"); |
| 91 assert_invalid("<banana>", "banana"); |
| 92 assert_invalid("<Number>", "10"); |
| 93 assert_invalid("<length", "10px"); |
| 94 assert_invalid("<LENGTH>", "10px"); |
| 95 assert_invalid("< length>", "10px"); |
| 96 assert_invalid("<length >", "10px"); |
| 97 assert_invalid("<length> +", "10px"); |
| 98 |
| 99 assert_invalid("<length>++", "10px"); |
| 100 assert_invalid("<length> | *", "10px"); |
| 101 assert_invalid("*|banana", "banana"); |
| 102 assert_invalid("*+", "banana"); |
| 103 |
| 104 assert_invalid("initial", "initial"); |
| 105 assert_invalid("<length>|initial", "10px"); |
| 106 assert_invalid("<length>|INHERIT", "10px"); |
| 107 |
| 108 // Invalid initialValue |
| 109 assert_invalid("*", "initial"); |
| 110 assert_invalid("*", "inherit"); |
| 111 assert_invalid("*", "unset"); |
| 112 assert_invalid("*", "revert"); |
| 113 assert_invalid("<custom-ident>", "initial"); |
| 114 assert_invalid("<custom-ident>+", "foo inherit bar"); |
| 115 |
| 116 assert_invalid("*", ")"); |
| 117 assert_invalid("*", "([)]"); |
| 118 assert_invalid("*", "whee!"); |
| 119 assert_invalid("*", '"\n'); |
| 120 assert_invalid("*", "url(moo '')"); |
| 121 assert_invalid("*", "semi;colon"); |
| 122 assert_invalid("*", "var(invalid var ref)"); |
| 123 assert_invalid("*", "var(--foo)"); |
| 124 |
| 125 assert_invalid("banana", "bAnAnA"); |
| 126 assert_invalid("<length>", "var(--moo)"); |
| 127 assert_invalid("<length>", "10"); |
| 128 assert_invalid("<length>", "10%"); |
| 129 assert_invalid("<length>", "calc(5px + 10%)"); |
| 130 assert_invalid("<length>", "calc(5px * 3px / 6px)"); |
| 131 assert_invalid("<length>", "10em"); |
| 132 assert_invalid("<length>", "10vmin"); |
| 133 assert_invalid("<length>", "calc(4px + 3em)"); |
| 134 assert_invalid("<length>", "calc(4px + calc(8 * 2em))"); |
| 135 assert_invalid("<length>", "10px;"); |
| 136 assert_invalid("<length-percentage>", "calc(2px + 10% + 7ex)"); |
| 137 assert_invalid("<percentage>", "0"); |
| 138 assert_invalid("<integer>", "1.0"); |
| 139 assert_invalid("<integer>", "1e0"); |
| 140 assert_invalid("<number>|foo", "foo var(--foo, bla)"); |
| 141 |
| 142 assert_invalid("<angle>", "10%"); |
| 143 assert_invalid("<time>", "2px"); |
| 144 assert_invalid("<resolution>", "10"); |
| 145 assert_invalid("<transform-function>", "scale()"); |
| 146 assert_invalid("<color>", "fancy-looking"); |
| 147 assert_invalid("<image>", "banana.png"); |
| 148 assert_invalid("<url>", "banana.png"); |
| 149 </script> |
OLD | NEW |