test.js 7.3 KB

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