css_test.go 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. package css // import "github.com/tdewolff/minify/css"
  2. import (
  3. "bytes"
  4. "fmt"
  5. "os"
  6. "testing"
  7. "github.com/tdewolff/minify"
  8. "github.com/tdewolff/test"
  9. )
  10. func TestCSS(t *testing.T) {
  11. cssTests := []struct {
  12. css string
  13. expected string
  14. }{
  15. {"/*comment*/", ""},
  16. {"/*! bang comment */", "/*!bang comment*/"},
  17. {"i{}/*! bang comment */", "i{}/*!bang comment*/"},
  18. {"i { key: value; key2: value; }", "i{key:value;key2:value}"},
  19. {".cla .ss > #id { x:y; }", ".cla .ss>#id{x:y}"},
  20. {".cla[id ^= L] { x:y; }", ".cla[id^=L]{x:y}"},
  21. {"area:focus { outline : 0;}", "area:focus{outline:0}"},
  22. {"@import 'file';", "@import 'file'"},
  23. {"@font-face { x:y; }", "@font-face{x:y}"},
  24. {"input[type=\"radio\"]{x:y}", "input[type=radio]{x:y}"},
  25. {"DIV{margin:1em}", "div{margin:1em}"},
  26. {".CLASS{margin:1em}", ".CLASS{margin:1em}"},
  27. {"@MEDIA all{}", "@media all{}"},
  28. {"@media only screen and (max-width : 800px){}", "@media only screen and (max-width:800px){}"},
  29. {"@media (-webkit-min-device-pixel-ratio:1.5),(min-resolution:1.5dppx){}", "@media(-webkit-min-device-pixel-ratio:1.5),(min-resolution:1.5dppx){}"},
  30. {"[class^=icon-] i[class^=icon-],i[class*=\" icon-\"]{x:y}", "[class^=icon-] i[class^=icon-],i[class*=\" icon-\"]{x:y}"},
  31. {"html{line-height:1;}html{line-height:1;}", "html{line-height:1}html{line-height:1}"},
  32. {"a { b: 1", "a{b:1}"},
  33. {":root { --custom-variable:0px; }", ":root{--custom-variable:0px}"},
  34. // case sensitivity
  35. {"@counter-style Ident{}", "@counter-style Ident{}"},
  36. // coverage
  37. {"a, b + c { x:y; }", "a,b+c{x:y}"},
  38. // bad declaration
  39. {".clearfix { *zoom: 1px; }", ".clearfix{*zoom:1px}"},
  40. {".clearfix { *zoom: 1px }", ".clearfix{*zoom:1px}"},
  41. {".clearfix { color:green; *zoom: 1px; color:red; }", ".clearfix{color:green;*zoom:1px;color:red}"},
  42. // go-fuzz
  43. {"input[type=\"\x00\"] { a: b\n}.a{}", "input[type=\"\x00\"]{a:b}.a{}"},
  44. {"a{a:)'''", "a{a:)'''}"},
  45. }
  46. m := minify.New()
  47. for _, tt := range cssTests {
  48. t.Run(tt.css, func(t *testing.T) {
  49. r := bytes.NewBufferString(tt.css)
  50. w := &bytes.Buffer{}
  51. err := Minify(m, w, r, nil)
  52. test.Minify(t, tt.css, err, w.String(), tt.expected)
  53. })
  54. }
  55. }
  56. func TestCSSInline(t *testing.T) {
  57. cssTests := []struct {
  58. css string
  59. expected string
  60. }{
  61. {"/*comment*/", ""},
  62. {"/*! bang comment */", ""},
  63. {";", ""},
  64. {"empty:", "empty:"},
  65. {"key: value;", "key:value"},
  66. {"margin: 0 1; padding: 0 1;", "margin:0 1;padding:0 1"},
  67. {"color: #FF0000;", "color:red"},
  68. {"color: #000000;", "color:#000"},
  69. {"color: black;", "color:#000"},
  70. {"color: rgb(255,255,255);", "color:#fff"},
  71. {"color: rgb(100%,100%,100%);", "color:#fff"},
  72. {"color: rgba(255,0,0,1);", "color:red"},
  73. {"color: rgba(255,0,0,2);", "color:red"},
  74. {"color: rgba(255,0,0,0.5);", "color:rgba(255,0,0,.5)"},
  75. {"color: rgba(255,0,0,-1);", "color:transparent"},
  76. {"color: rgba(0%,15%,25%,0.2);", "color:rgba(0%,15%,25%,.2)"},
  77. {"color: rgba(0,0,0,0.5);", "color:rgba(0,0,0,.5)"},
  78. {"color: hsla(5,0%,10%,0.75);", "color:hsla(5,0%,10%,.75)"},
  79. {"color: hsl(0,100%,50%);", "color:red"},
  80. {"color: hsla(1,2%,3%,1);", "color:#080807"},
  81. {"color: hsla(1,2%,3%,0);", "color:transparent"},
  82. {"color: hsl(48,100%,50%);", "color:#fc0"},
  83. {"font-weight: bold; font-weight: normal;", "font-weight:700;font-weight:400"},
  84. {"font: bold \"Times new Roman\",\"Sans-Serif\";", "font:700 times new roman,\"sans-serif\""},
  85. {"outline: none;", "outline:0"},
  86. {"outline: none !important;", "outline:0!important"},
  87. {"border-left: none;", "border-left:0"},
  88. {"margin: 1 1 1 1;", "margin:1"},
  89. {"margin: 1 2 1 2;", "margin:1 2"},
  90. {"margin: 1 2 3 2;", "margin:1 2 3"},
  91. {"margin: 1 2 3 4;", "margin:1 2 3 4"},
  92. {"margin: 1 1 1 a;", "margin:1 1 1 a"},
  93. {"margin: 1 1 1 1 !important;", "margin:1!important"},
  94. {"padding:.2em .4em .2em", "padding:.2em .4em"},
  95. {"margin: 0em;", "margin:0"},
  96. {"font-family:'Arial', 'Times New Roman';", "font-family:arial,times new roman"},
  97. {"background:url('http://domain.com/image.png');", "background:url(http://domain.com/image.png)"},
  98. {"filter: progid : DXImageTransform.Microsoft.BasicImage(rotation=1);", "filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"},
  99. {"filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);", "filter:alpha(opacity=0)"},
  100. {"content: \"a\\\nb\";", "content:\"ab\""},
  101. {"content: \"a\\\r\nb\\\r\nc\";", "content:\"abc\""},
  102. {"content: \"\";", "content:\"\""},
  103. {"font:27px/13px arial,sans-serif", "font:27px/13px arial,sans-serif"},
  104. {"text-decoration: none !important", "text-decoration:none!important"},
  105. {"color:#fff", "color:#fff"},
  106. {"border:2px rgb(255,255,255);", "border:2px #fff"},
  107. {"margin:-1px", "margin:-1px"},
  108. {"margin:+1px", "margin:1px"},
  109. {"margin:0.5em", "margin:.5em"},
  110. {"margin:-0.5em", "margin:-.5em"},
  111. {"margin:05em", "margin:5em"},
  112. {"margin:.50em", "margin:.5em"},
  113. {"margin:5.0em", "margin:5em"},
  114. {"margin:5000em", "margin:5e3em"},
  115. {"color:#c0c0c0", "color:silver"},
  116. {"-ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)\";", "-ms-filter:\"alpha(opacity=80)\""},
  117. {"filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 80);", "filter:alpha(opacity=80)"},
  118. {"MARGIN:1EM", "margin:1em"},
  119. //{"color:CYAN", "color:cyan"}, // TODO
  120. {"width:attr(Name em)", "width:attr(Name em)"},
  121. {"content:CounterName", "content:CounterName"},
  122. {"background:URL(x.PNG);", "background:url(x.PNG)"},
  123. {"background:url(/*nocomment*/)", "background:url(/*nocomment*/)"},
  124. {"background:url(data:,text)", "background:url(data:,text)"},
  125. {"background:url('data:text/xml; version = 2.0,content')", "background:url(data:text/xml;version=2.0,content)"},
  126. {"background:url('data:\\'\",text')", "background:url('data:\\'\",text')"},
  127. {"margin:0 0 18px 0;", "margin:0 0 18px"},
  128. {"background:none", "background:0 0"},
  129. {"background:none 1 1", "background:none 1 1"},
  130. {"z-index:1000", "z-index:1000"},
  131. {"any:0deg 0s 0ms 0dpi 0dpcm 0dppx 0hz 0khz", "any:0 0s 0ms 0dpi 0dpcm 0dppx 0hz 0khz"},
  132. {"--custom-variable:0px;", "--custom-variable:0px"},
  133. {"--foo: if(x > 5) this.width = 10", "--foo: if(x > 5) this.width = 10"},
  134. {"--foo: ;", "--foo: "},
  135. // case sensitivity
  136. {"animation:Ident", "animation:Ident"},
  137. {"animation-name:Ident", "animation-name:Ident"},
  138. // coverage
  139. {"margin: 1 1;", "margin:1"},
  140. {"margin: 1 2;", "margin:1 2"},
  141. {"margin: 1 1 1;", "margin:1"},
  142. {"margin: 1 2 1;", "margin:1 2"},
  143. {"margin: 1 2 3;", "margin:1 2 3"},
  144. {"margin: 0%;", "margin:0"},
  145. {"color: rgb(255,64,64);", "color:#ff4040"},
  146. {"color: rgb(256,-34,2342435);", "color:#f0f"},
  147. {"color: rgb(120%,-45%,234234234%);", "color:#f0f"},
  148. {"color: rgb(0, 1, ident);", "color:rgb(0,1,ident)"},
  149. {"color: rgb(ident);", "color:rgb(ident)"},
  150. {"margin: rgb(ident);", "margin:rgb(ident)"},
  151. {"filter: progid:b().c.Alpha(rgba(x));", "filter:progid:b().c.Alpha(rgba(x))"},
  152. // go-fuzz
  153. {"FONT-FAMILY: ru\"", "font-family:ru\""},
  154. }
  155. m := minify.New()
  156. params := map[string]string{"inline": "1"}
  157. for _, tt := range cssTests {
  158. t.Run(tt.css, func(t *testing.T) {
  159. r := bytes.NewBufferString(tt.css)
  160. w := &bytes.Buffer{}
  161. err := Minify(m, w, r, params)
  162. test.Minify(t, tt.css, err, w.String(), tt.expected)
  163. })
  164. }
  165. }
  166. func TestReaderErrors(t *testing.T) {
  167. r := test.NewErrorReader(0)
  168. w := &bytes.Buffer{}
  169. m := minify.New()
  170. err := Minify(m, w, r, nil)
  171. test.T(t, err, test.ErrPlain, "return error at first read")
  172. }
  173. func TestWriterErrors(t *testing.T) {
  174. errorTests := []struct {
  175. css string
  176. n []int
  177. }{
  178. {`@import 'file'`, []int{0, 2}},
  179. {`@media all{}`, []int{0, 2, 3, 4}},
  180. {`a[id^="L"]{margin:2in!important;color:red}`, []int{0, 4, 6, 7, 8, 9, 10, 11}},
  181. {`a{color:rgb(255,0,0)}`, []int{4}},
  182. {`a{color:rgb(255,255,255)}`, []int{4}},
  183. {`a{color:hsl(0,100%,50%)}`, []int{4}},
  184. {`a{color:hsl(360,100%,100%)}`, []int{4}},
  185. {`a{color:f(arg)}`, []int{4}},
  186. {`<!--`, []int{0}},
  187. {`/*!comment*/`, []int{0, 1, 2}},
  188. {`a{--var:val}`, []int{2, 3, 4}},
  189. {`a{*color:0}`, []int{2, 3}},
  190. {`a{color:0;baddecl 5}`, []int{5}},
  191. }
  192. m := minify.New()
  193. for _, tt := range errorTests {
  194. for _, n := range tt.n {
  195. t.Run(fmt.Sprint(tt.css, " ", tt.n), func(t *testing.T) {
  196. r := bytes.NewBufferString(tt.css)
  197. w := test.NewErrorWriter(n)
  198. err := Minify(m, w, r, nil)
  199. test.T(t, err, test.ErrPlain)
  200. })
  201. }
  202. }
  203. }
  204. ////////////////////////////////////////////////////////////////
  205. func ExampleMinify() {
  206. m := minify.New()
  207. m.AddFunc("text/css", Minify)
  208. if err := m.Minify("text/css", os.Stdout, os.Stdin); err != nil {
  209. panic(err)
  210. }
  211. }