css.js
2 years ago
gss.html
2 years ago
gss_test.js
2 years ago
index.html
2 years ago
less.html
2 years ago
less_test.js
2 years ago
scss.html
2 years ago
scss_test.js
2 years ago
test.js
2 years ago
test.js
218 lines
| 1 | // CodeMirror, copyright (c) by Marijn Haverbeke and others |
| 2 | // Distributed under an MIT license: https://codemirror.net/5/LICENSE |
| 3 | |
| 4 | (function() { |
| 5 | var mode = CodeMirror.getMode({indentUnit: 2}, "css"); |
| 6 | function MT(name) { test.mode(name, mode, Array.prototype.slice.call(arguments, 1)); } |
| 7 | |
| 8 | // Error, because "foobarhello" is neither a known type or property, but |
| 9 | // property was expected (after "and"), and it should be in parentheses. |
| 10 | MT("atMediaUnknownType", |
| 11 | "[def @media] [attribute screen] [keyword and] [error foobarhello] { }"); |
| 12 | |
| 13 | // Soft error, because "foobarhello" is not a known property or type. |
| 14 | MT("atMediaUnknownProperty", |
| 15 | "[def @media] [attribute screen] [keyword and] ([error foobarhello]) { }"); |
| 16 | |
| 17 | // Make sure nesting works with media queries |
| 18 | MT("atMediaMaxWidthNested", |
| 19 | "[def @media] [attribute screen] [keyword and] ([property max-width]: [number 25px]) { [tag foo] { } }"); |
| 20 | |
| 21 | MT("atMediaFeatureValueKeyword", |
| 22 | "[def @media] ([property orientation]: [keyword landscape]) { }"); |
| 23 | |
| 24 | MT("atMediaUnknownFeatureValueKeyword", |
| 25 | "[def @media] ([property orientation]: [error upsidedown]) { }"); |
| 26 | |
| 27 | MT("atMediaUppercase", |
| 28 | "[def @MEDIA] ([property orienTAtion]: [keyword landScape]) { }"); |
| 29 | |
| 30 | MT("tagSelector", |
| 31 | "[tag foo] { }"); |
| 32 | |
| 33 | MT("classSelector", |
| 34 | "[qualifier .foo-bar_hello] { }"); |
| 35 | |
| 36 | MT("idSelector", |
| 37 | "[builtin #foo] { [error #foo] }"); |
| 38 | |
| 39 | MT("tagSelectorUnclosed", |
| 40 | "[tag foo] { [property margin]: [number 0] } [tag bar] { }"); |
| 41 | |
| 42 | MT("tagStringNoQuotes", |
| 43 | "[tag foo] { [property font-family]: [variable hello] [variable world]; }"); |
| 44 | |
| 45 | MT("tagStringDouble", |
| 46 | "[tag foo] { [property font-family]: [string \"hello world\"]; }"); |
| 47 | |
| 48 | MT("tagStringSingle", |
| 49 | "[tag foo] { [property font-family]: [string 'hello world']; }"); |
| 50 | |
| 51 | MT("tagColorKeyword", |
| 52 | "[tag foo] {", |
| 53 | " [property color]: [keyword black];", |
| 54 | " [property color]: [keyword navy];", |
| 55 | " [property color]: [keyword yellow];", |
| 56 | "}"); |
| 57 | |
| 58 | MT("tagColorHex3", |
| 59 | "[tag foo] { [property background]: [atom #fff]; }"); |
| 60 | |
| 61 | MT("tagColorHex4", |
| 62 | "[tag foo] { [property background]: [atom #ffff]; }"); |
| 63 | |
| 64 | MT("tagColorHex6", |
| 65 | "[tag foo] { [property background]: [atom #ffffff]; }"); |
| 66 | |
| 67 | MT("tagColorHex8", |
| 68 | "[tag foo] { [property background]: [atom #ffffffff]; }"); |
| 69 | |
| 70 | MT("tagColorHex5Invalid", |
| 71 | "[tag foo] { [property background]: [atom&error #fffff]; }"); |
| 72 | |
| 73 | MT("tagColorHexInvalid", |
| 74 | "[tag foo] { [property background]: [atom&error #ffg]; }"); |
| 75 | |
| 76 | MT("tagNegativeNumber", |
| 77 | "[tag foo] { [property margin]: [number -5px]; }"); |
| 78 | |
| 79 | MT("tagPositiveNumber", |
| 80 | "[tag foo] { [property padding]: [number 5px]; }"); |
| 81 | |
| 82 | MT("tagVendor", |
| 83 | "[tag foo] { [meta -foo-][property box-sizing]: [meta -foo-][atom border-box]; }"); |
| 84 | |
| 85 | MT("tagBogusProperty", |
| 86 | "[tag foo] { [property&error barhelloworld]: [number 0]; }"); |
| 87 | |
| 88 | MT("tagTwoProperties", |
| 89 | "[tag foo] { [property margin]: [number 0]; [property padding]: [number 0]; }"); |
| 90 | |
| 91 | MT("tagTwoPropertiesURL", |
| 92 | "[tag foo] { [property background]: [variable&callee url]([string //example.com/foo.png]); [property padding]: [number 0]; }"); |
| 93 | |
| 94 | MT("indent_tagSelector", |
| 95 | "[tag strong], [tag em] {", |
| 96 | " [property background]: [variable&callee rgba](", |
| 97 | " [number 255], [number 255], [number 0], [number .2]", |
| 98 | " );", |
| 99 | "}"); |
| 100 | |
| 101 | MT("indent_atMedia", |
| 102 | "[def @media] {", |
| 103 | " [tag foo] {", |
| 104 | " [property color]:", |
| 105 | " [keyword yellow];", |
| 106 | " }", |
| 107 | "}"); |
| 108 | |
| 109 | MT("indent_comma", |
| 110 | "[tag foo] {", |
| 111 | " [property font-family]: [variable verdana],", |
| 112 | " [atom sans-serif];", |
| 113 | "}"); |
| 114 | |
| 115 | MT("indent_parentheses", |
| 116 | "[tag foo]:[variable-3 before] {", |
| 117 | " [property background]: [variable&callee url](", |
| 118 | "[string blahblah]", |
| 119 | "[string etc]", |
| 120 | "[string ]) [keyword !important];", |
| 121 | "}"); |
| 122 | |
| 123 | MT("font_face", |
| 124 | "[def @font-face] {", |
| 125 | " [property font-family]: [string 'myfont'];", |
| 126 | " [error nonsense]: [string 'abc'];", |
| 127 | " [property src]: [variable&callee url]([string http://blah]),", |
| 128 | " [variable&callee url]([string http://foo]);", |
| 129 | "}"); |
| 130 | |
| 131 | MT("empty_url", |
| 132 | "[def @import] [variable&callee url]() [attribute screen];"); |
| 133 | |
| 134 | MT("parens", |
| 135 | "[qualifier .foo] {", |
| 136 | " [property background-image]: [variable&callee fade]([atom #000], [number 20%]);", |
| 137 | " [property border-image]: [variable&callee linear-gradient](", |
| 138 | " [atom to] [atom bottom],", |
| 139 | " [variable&callee fade]([atom #000], [number 20%]) [number 0%],", |
| 140 | " [variable&callee fade]([atom #000], [number 20%]) [number 100%]", |
| 141 | " );", |
| 142 | "}"); |
| 143 | |
| 144 | MT("css_variable", |
| 145 | ":[variable-3 root] {", |
| 146 | " [variable-2 --main-color]: [atom #06c];", |
| 147 | "}", |
| 148 | "[tag h1][builtin #foo] {", |
| 149 | " [property color]: [variable&callee var]([variable-2 --main-color]);", |
| 150 | "}"); |
| 151 | |
| 152 | MT("blank_css_variable", |
| 153 | ":[variable-3 root] {", |
| 154 | " [variable-2 --]: [atom #06c];", |
| 155 | "}", |
| 156 | "[tag h1][builtin #foo] {", |
| 157 | " [property color]: [variable&callee var]([variable-2 --]);", |
| 158 | "}"); |
| 159 | |
| 160 | MT("supports", |
| 161 | "[def @supports] ([keyword not] (([property text-align-last]: [atom justify]) [keyword or] ([meta -moz-][property text-align-last]: [atom justify])) {", |
| 162 | " [property text-align-last]: [atom justify];", |
| 163 | "}"); |
| 164 | |
| 165 | MT("document", |
| 166 | "[def @document] [variable&callee url]([string http://blah]),", |
| 167 | " [variable&callee url-prefix]([string https://]),", |
| 168 | " [variable&callee domain]([string blah.com]),", |
| 169 | " [variable&callee regexp]([string \".*blah.+\"]) {", |
| 170 | " [builtin #id] {", |
| 171 | " [property background-color]: [keyword white];", |
| 172 | " }", |
| 173 | " [tag foo] {", |
| 174 | " [property font-family]: [variable Verdana], [atom sans-serif];", |
| 175 | " }", |
| 176 | "}"); |
| 177 | |
| 178 | MT("document_url", |
| 179 | "[def @document] [variable&callee url]([string http://blah]) { [qualifier .class] { } }"); |
| 180 | |
| 181 | MT("document_urlPrefix", |
| 182 | "[def @document] [variable&callee url-prefix]([string https://]) { [builtin #id] { } }"); |
| 183 | |
| 184 | MT("document_domain", |
| 185 | "[def @document] [variable&callee domain]([string blah.com]) { [tag foo] { } }"); |
| 186 | |
| 187 | MT("document_regexp", |
| 188 | "[def @document] [variable&callee regexp]([string \".*blah.+\"]) { [builtin #id] { } }"); |
| 189 | |
| 190 | MT("counter-style", |
| 191 | "[def @counter-style] [variable binary] {", |
| 192 | " [property system]: [atom numeric];", |
| 193 | " [property symbols]: [number 0] [number 1];", |
| 194 | " [property suffix]: [string \".\"];", |
| 195 | " [property range]: [atom infinite];", |
| 196 | " [property speak-as]: [atom numeric];", |
| 197 | "}"); |
| 198 | |
| 199 | MT("counter-style-additive-symbols", |
| 200 | "[def @counter-style] [variable simple-roman] {", |
| 201 | " [property system]: [atom additive];", |
| 202 | " [property additive-symbols]: [number 10] [variable X], [number 5] [variable V], [number 1] [variable I];", |
| 203 | " [property range]: [number 1] [number 49];", |
| 204 | "}"); |
| 205 | |
| 206 | MT("counter-style-use", |
| 207 | "[tag ol][qualifier .roman] { [property list-style]: [variable simple-roman]; }"); |
| 208 | |
| 209 | MT("counter-style-symbols", |
| 210 | "[tag ol] { [property list-style]: [variable&callee symbols]([atom cyclic] [string \"*\"] [string \"\\2020\"] [string \"\\2021\"] [string \"\\A7\"]); }"); |
| 211 | |
| 212 | MT("comment-does-not-disrupt", |
| 213 | "[def @font-face] [comment /* foo */] {", |
| 214 | " [property src]: [variable&callee url]([string x]);", |
| 215 | " [property font-family]: [variable One];", |
| 216 | "}") |
| 217 | })(); |
| 218 |