test.js 6.6 KB

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