3 use Wikimedia\TestingAccessWrapper
;
6 * @group ResourceLoader
9 class CSSMinTest
extends MediaWikiTestCase
{
11 protected function setUp() {
15 $server = 'https://expand.example';
16 $this->setMwGlobals( [
17 'wgServer' => $server,
18 'wgCanonicalServer' => $server,
23 * @dataProvider provideSerializeStringValue
24 * @covers CSSMin::serializeStringValue
26 public function testSerializeStringValue( $input, $expected ) {
27 $output = CSSMin
::serializeStringValue( $input );
31 'Serialized output must be in the expected form.'
35 public static function provideSerializeStringValue() {
37 [ 'Hello World!', '"Hello World!"' ],
38 [ "Null\0Null", "\"Null\xEF\xBF\xBDNull\"" ],
42 [ "Tab\tTab", '"Tab\\9 Tab"' ],
43 [ "Space tab \t space", '"Space tab \\9 space"' ],
44 [ "Line\nfeed", '"Line\\a feed"' ],
45 [ "Return\rreturn", '"Return\\d return"' ],
46 [ "Next\xc2\x85line", "\"Next\xc2\x85line\"" ],
47 [ "Del\x7fDel", '"Del\\7f Del"' ],
48 [ "nb\xc2\xa0sp", "\"nb\xc2\xa0sp\"" ],
49 [ "AMP&AMP", "\"AMP&AMP\"" ],
50 [ '!"#$%&\'()*+,-./0123456789:;<=>?', '"!\\"#$%&\'()*+,-./0123456789:;<=>?"' ],
51 [ '@[\\]^_`{|}~', '"@[\\\\]^_`{|}~"' ],
55 [ '𝒞', '"𝒞"' ], // U+1D49E 'MATHEMATICAL SCRIPT CAPITAL C'
60 * @dataProvider provideMimeType
61 * @covers CSSMin::getMimeType
63 public function testGetMimeType( $fileContents, $fileExtension, $expected ) {
64 $fileName = wfTempDir() . DIRECTORY_SEPARATOR
. uniqid( 'MW_PHPUnit_CSSMinTest_' ) . '.'
66 $this->addTmpFiles( $fileName );
67 file_put_contents( $fileName, $fileContents );
68 $this->assertSame( $expected, CSSMin
::getMimeType( $fileName ) );
71 public static function provideMimeType() {
73 'JPEG with short extension' => [
78 'JPEG with long extension' => [
84 "\x89\x50\x4E\x47\x0D\x0A\x1A\x0A",
89 'PNG extension but JPEG content' => [
94 'JPEG extension but PNG content' => [
95 "\x89\x50\x4E\x47\x0D\x0A\x1A\x0A",
99 'PNG extension but SVG content' => [
100 '<?xml version="1.0"?><svg></svg>',
104 'SVG extension but PNG content' => [
105 "\x89\x50\x4E\x47\x0D\x0A\x1A\x0A",
110 'SVG with all headers' => [
111 '<?xml version="1.0"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" '
112 . '"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg></svg>',
116 'SVG with XML header only' => [
117 '<?xml version="1.0"?><svg></svg>',
121 'SVG with DOCTYPE only' => [
122 '<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" '
123 . '"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg></svg>',
127 'SVG without any header' => [
136 * @dataProvider provideMinifyCases
137 * @covers CSSMin::minify
139 public function testMinify( $code, $expectedOutput ) {
140 $minified = CSSMin
::minify( $code );
145 'Minified output should be in the form expected.'
149 public static function provideMinifyCases() {
152 [ "\r\t\f \v\n\r", "" ],
153 [ "foo, bar {\n\tprop: value;\n}", "foo,bar{prop:value}" ],
157 [ "/*******\n foo\n *******/", "" ],
158 [ "/*!\n foo\n */", "" ],
160 // Inline comments in various different places
161 [ "/* comment */foo, bar {\n\tprop: value;\n}", "foo,bar{prop:value}" ],
162 [ "foo/* comment */, bar {\n\tprop: value;\n}", "foo,bar{prop:value}" ],
163 [ "foo,/* comment */ bar {\n\tprop: value;\n}", "foo,bar{prop:value}" ],
164 [ "foo, bar/* comment */ {\n\tprop: value;\n}", "foo,bar{prop:value}" ],
165 [ "foo, bar {\n\t/* comment */prop: value;\n}", "foo,bar{prop:value}" ],
166 [ "foo, bar {\n\tprop: /* comment */value;\n}", "foo,bar{prop:value}" ],
167 [ "foo, bar {\n\tprop: value /* comment */;\n}", "foo,bar{prop:value }" ],
168 [ "foo, bar {\n\tprop: value; /* comment */\n}", "foo,bar{prop:value; }" ],
170 // Keep track of things that aren't as minified as much as they
172 [ 'foo { prop: value ;}', 'foo{prop:value }' ],
173 [ 'foo { prop : value; }', 'foo{prop :value}' ],
174 [ 'foo { prop: value ; }', 'foo{prop:value }' ],
175 [ 'foo { font-family: "foo" , "bar"; }', 'foo{font-family:"foo" ,"bar"}' ],
176 [ "foo { src:\n\turl('foo') ,\n\turl('bar') ; }", "foo{src:url('foo') ,url('bar') }" ],
178 // Interesting cases with string values
179 // - Double quotes, single quotes
180 [ 'foo { content: ""; }', 'foo{content:""}' ],
181 [ "foo { content: ''; }", "foo{content:''}" ],
182 [ 'foo { content: "\'"; }', 'foo{content:"\'"}' ],
183 [ "foo { content: '\"'; }", "foo{content:'\"'}" ],
184 // - Whitespace in string values
185 [ 'foo { content: " "; }', 'foo{content:" "}' ],
187 // Whitespaces after opening and before closing parentheses and brackets
188 [ 'a:not( [ href ] ) { prop: url( foobar.png ); }', 'a:not([href]){prop:url(foobar.png)}' ],
190 // Ensure that the invalid "url (" will not become the valid "url(" by minification
191 [ 'foo { prop: url ( foobar.png ); }', 'foo{prop:url (foobar.png)}' ],
195 public static function provideIsRemoteUrl() {
197 [ true, 'http://localhost/w/red.gif?123' ],
198 [ true, 'https://example.org/x.png' ],
199 [ true, '//example.org/x.y.z/image.png' ],
200 [ true, '//localhost/styles.css?query=yes' ],
201 [ true, 'data:image/gif;base64,R0lGODlhAQABAIAAAP8AADAAACwAAAAAAQABAAACAkQBADs=' ],
207 [ false, './x.gif' ],
208 [ false, '../x.gif' ],
213 * @dataProvider provideIsRemoteUrl
214 * @covers CSSMin::isRemoteUrl
216 public function testIsRemoteUrl( $expect, $url ) {
217 $class = TestingAccessWrapper
::newFromClass( CSSMin
::class );
218 $this->assertEquals( $class->isRemoteUrl( $url ), $expect );
221 public static function provideIsLocalUrls() {
228 [ false, './x.gif' ],
229 [ false, '../x.gif' ],
234 * @dataProvider provideIsLocalUrls
235 * @covers CSSMin::isLocalUrl
237 public function testIsLocalUrl( $expect, $url ) {
238 $class = TestingAccessWrapper
::newFromClass( CSSMin
::class );
239 $this->assertEquals( $class->isLocalUrl( $url ), $expect );
243 * This test tests funky parameters to CSSMin::remap.
245 * @see testRemapRemapping for testing of the basic functionality
246 * @dataProvider provideRemapCases
247 * @covers CSSMin::remap
248 * @covers CSSMin::remapOne
250 public function testRemap( $message, $params, $expectedOutput ) {
251 $remapped = call_user_func_array( 'CSSMin::remap', $params );
253 $messageAdd = " Case: $message";
257 'CSSMin::remap should return the expected url form.' . $messageAdd
261 public static function provideRemapCases() {
262 // Parameter signature:
263 // CSSMin::remap( $code, $local, $remote, $embedData = true )
267 [ 'foo { prop: url(bar.png); }', false, 'http://example.org', false ],
268 'foo { prop: url(http://example.org/bar.png); }',
271 'Without trailing slash',
272 [ 'foo { prop: url(../bar.png); }', false, 'http://example.org/quux', false ],
273 'foo { prop: url(http://example.org/bar.png); }',
276 'With trailing slash on remote (T29052)',
277 [ 'foo { prop: url(../bar.png); }', false, 'http://example.org/quux/', false ],
278 'foo { prop: url(http://example.org/bar.png); }',
281 'Guard against stripping double slashes from query',
282 [ 'foo { prop: url(bar.png?corge=//grault); }', false, 'http://example.org/quux/', false ],
283 'foo { prop: url(http://example.org/quux/bar.png?corge=//grault); }',
286 'Expand absolute paths',
287 [ 'foo { prop: url(/w/skin/images/bar.png); }', false, 'http://example.org/quux', false ],
288 'foo { prop: url(https://expand.example/w/skin/images/bar.png); }',
291 "Don't barf at behavior: url(#default#behaviorName) - T162973",
292 [ 'foo { behavior: url(#default#bar); }', false, '/w/', false ],
293 'foo { behavior: url("#default#bar"); }',
299 * Cases with empty url() for CSSMin::remap.
301 * Regression test for T191237.
303 * @dataProvider provideRemapEmptyUrl
306 public function testRemapEmptyUrl( $params, $expected ) {
307 $remapped = call_user_func_array( 'CSSMin::remap', $params );
308 $this->assertEquals( $expected, $remapped, 'Ignore empty url' );
311 public static function provideRemapEmptyUrl() {
314 [ "background-image: url();", false, '/example', false ],
315 "background-image: url();",
318 [ "background-image: url('');", false, '/example', false ],
319 "background-image: url('');",
322 [ 'background-image: url("");', false, '/example', false ],
323 'background-image: url("");',
325 'Single quote with outer spacing' => [
326 [ "background-image: url( '' );", false, '/example', false ],
327 "background-image: url( '' );",
333 * This tests the basic functionality of CSSMin::remap.
335 * @see testRemap for testing of funky parameters
336 * @dataProvider provideRemapRemappingCases
339 public function testRemapRemapping( $message, $input, $expectedOutput ) {
340 $localPath = __DIR__
. '/../../data/cssmin';
341 $remotePath = 'http://localhost/w';
343 $realOutput = CSSMin
::remap( $input, $localPath, $remotePath );
344 $this->assertEquals( $expectedOutput, $realOutput, "CSSMin::remap: $message" );
347 public static function provideRemapRemappingCases() {
348 // red.gif and green.gif are one-pixel 35-byte GIFs.
349 // large.png is a 35K PNG that should be non-embeddable.
350 // Full paths start with http://localhost/w/.
351 // Timestamps in output are replaced with 'timestamp'.
353 // data: URIs for red.gif, green.gif, circle.svg
354 $red = 'data:image/gif;base64,R0lGODlhAQABAIAAAP8AADAAACwAAAAAAQABAAACAkQBADs=';
355 $green = 'data:image/gif;base64,R0lGODlhAQABAIAAAACAADAAACwAAAAAAQABAAACAkQBADs=';
356 $svg = 'data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%228'
357 . '%22 height=%228%22 viewBox=%220 0 8 8%22%3E %3Ccircle cx=%224%22 cy=%224%22 '
358 . 'r=%222%22/%3E %3Ca xmlns:xlink=%22http://www.w3.org/1999/xlink%22 xlink:title='
359 . '%22%3F%3E%22%3Etest%3C/a%3E %3C/svg%3E';
361 // phpcs:disable Generic.Files.LineLength
365 'foo { background: url(red.gif); }',
366 'foo { background: url(http://localhost/w/red.gif?34ac6); }',
369 'Regular file (missing)',
370 'foo { background: url(theColorOfHerHair.gif); }',
371 'foo { background: url(http://localhost/w/theColorOfHerHair.gif); }',
375 'foo { background: url(http://example.org/w/foo.png); }',
376 'foo { background: url(http://example.org/w/foo.png); }',
379 'Protocol-relative remote URL',
380 'foo { background: url(//example.org/w/foo.png); }',
381 'foo { background: url(//example.org/w/foo.png); }',
384 'Remote URL with query',
385 'foo { background: url(http://example.org/w/foo.png?query=yes); }',
386 'foo { background: url(http://example.org/w/foo.png?query=yes); }',
389 'Protocol-relative remote URL with query',
390 'foo { background: url(//example.org/w/foo.png?query=yes); }',
391 'foo { background: url(//example.org/w/foo.png?query=yes); }',
394 'Domain-relative URL',
395 'foo { background: url(/static/foo.png); }',
396 'foo { background: url(https://expand.example/static/foo.png); }',
399 'Domain-relative URL with query',
400 'foo { background: url(/static/foo.png?query=yes); }',
401 'foo { background: url(https://expand.example/static/foo.png?query=yes); }',
404 'Path-relative URL with query',
405 "foo { background: url(?query=yes); }",
406 'foo { background: url(http://localhost/w/?query=yes); }',
409 'Remote URL (unnecessary quotes not preserved)',
410 'foo { background: url("http://example.org/w/unnecessary-quotes.png"); }',
411 'foo { background: url(http://example.org/w/unnecessary-quotes.png); }',
415 'foo { /* @embed */ background: url(red.gif); }',
416 "foo { background: url($red); background: url(http://localhost/w/red.gif?34ac6)!ie; }",
419 'Embedded file, other comments before the rule',
420 "foo { /* Bar. */ /* @embed */ background: url(red.gif); }",
421 "foo { /* Bar. */ background: url($red); /* Bar. */ background: url(http://localhost/w/red.gif?34ac6)!ie; }",
424 'Can not re-embed data: URIs',
425 "foo { /* @embed */ background: url($red); }",
426 "foo { background: url($red); }",
429 'Can not remap data: URIs',
430 "foo { background: url($red); }",
431 "foo { background: url($red); }",
434 'Can not embed remote URLs',
435 'foo { /* @embed */ background: url(http://example.org/w/foo.png); }',
436 'foo { background: url(http://example.org/w/foo.png); }',
439 'Embedded file (inline @embed)',
440 'foo { background: /* @embed */ url(red.gif); }',
441 "foo { background: url($red); "
442 . "background: url(http://localhost/w/red.gif?34ac6)!ie; }",
445 'Can not embed large files',
446 'foo { /* @embed */ background: url(large.png); }',
447 "foo { background: url(http://localhost/w/large.png?e3d1f); }",
450 'SVG files are embedded without base64 encoding and unnecessary IE 6 and 7 fallback',
451 'foo { /* @embed */ background: url(circle.svg); }',
452 "foo { background: url(\"$svg\"); }",
455 'Two regular files in one rule',
456 'foo { background: url(red.gif), url(green.gif); }',
457 'foo { background: url(http://localhost/w/red.gif?34ac6), '
458 . 'url(http://localhost/w/green.gif?13651); }',
461 'Two embedded files in one rule',
462 'foo { /* @embed */ background: url(red.gif), url(green.gif); }',
463 "foo { background: url($red), url($green); "
464 . "background: url(http://localhost/w/red.gif?34ac6), "
465 . "url(http://localhost/w/green.gif?13651)!ie; }",
468 'Two embedded files in one rule (inline @embed)',
469 'foo { background: /* @embed */ url(red.gif), /* @embed */ url(green.gif); }',
470 "foo { background: url($red), url($green); "
471 . "background: url(http://localhost/w/red.gif?34ac6), "
472 . "url(http://localhost/w/green.gif?13651)!ie; }",
475 'Two embedded files in one rule (inline @embed), one too large',
476 'foo { background: /* @embed */ url(red.gif), /* @embed */ url(large.png); }',
477 "foo { background: url($red), url(http://localhost/w/large.png?e3d1f); "
478 . "background: url(http://localhost/w/red.gif?34ac6), "
479 . "url(http://localhost/w/large.png?e3d1f)!ie; }",
482 'Practical example with some noise',
483 'foo { /* @embed */ background: #f9f9f9 url(red.gif) 0 0 no-repeat; }',
484 "foo { background: #f9f9f9 url($red) 0 0 no-repeat; "
485 . "background: #f9f9f9 url(http://localhost/w/red.gif?34ac6) 0 0 no-repeat!ie; }",
488 'Does not mess with other properties',
489 'foo { color: red; background: url(red.gif); font-size: small; }',
490 'foo { color: red; background: url(http://localhost/w/red.gif?34ac6); font-size: small; }',
493 'Spacing and miscellanea not changed (1)',
494 'foo { background: url(red.gif); }',
495 'foo { background: url(http://localhost/w/red.gif?34ac6); }',
498 'Spacing and miscellanea not changed (2)',
499 'foo {background:url(red.gif)}',
500 'foo {background:url(http://localhost/w/red.gif?34ac6)}',
503 'Spaces within url() parentheses are ignored',
504 'foo { background: url( red.gif ); }',
505 'foo { background: url(http://localhost/w/red.gif?34ac6); }',
508 '@import rule to local file (should we remap this?)',
509 '@import url(/styles.css)',
510 '@import url(https://expand.example/styles.css)',
513 '@import rule to local file (should we remap this?)',
514 '@import url(/styles.css)',
515 '@import url(https://expand.example/styles.css)',
518 '@import rule to URL',
519 '@import url(//localhost/styles.css?query=val)',
520 '@import url(//localhost/styles.css?query=val)',
523 'Background URL (double quotes)',
524 'foo { background: url("//localhost/styles.css?quoted=double") }',
525 'foo { background: url(//localhost/styles.css?quoted=double) }',
528 'Background URL (single quotes)',
529 'foo { background: url(\'//localhost/styles.css?quoted=single\') }',
530 'foo { background: url(//localhost/styles.css?quoted=single) }',
533 'Background URL (double quoted, containing parentheses; T60473)',
534 'foo { background: url("//localhost/styles.css?query=(parens)") }',
535 'foo { background: url("//localhost/styles.css?query=(parens)") }',
538 'Background URL (double quoted, containing single quotes; T60473)',
539 'foo { background: url("//localhost/styles.css?quote=\'") }',
540 'foo { background: url("//localhost/styles.css?quote=\'") }',
543 'Background URL (single quoted, containing double quotes; T60473)',
544 'foo { background: url(\'//localhost/styles.css?quote="\') }',
545 'foo { background: url("//localhost/styles.css?quote=\"") }',
548 'Background URL (double quoted with outer spacing)',
549 'foo { background: url( "http://localhost/styles.css?quoted=double" ) }',
550 'foo { background: url(http://localhost/styles.css?quoted=double) }',
553 'Background URL (single quoted, containing spaces, with outer spacing)',
554 "foo { background: url( ' red.gif ' ); }",
555 'foo { background: url("http://localhost/w/ red.gif "); }',
558 'Simple case with comments before url',
559 'foo { prop: /* some {funny;} comment */ url(bar.png); }',
560 'foo { prop: /* some {funny;} comment */ url(http://localhost/w/bar.png); }',
563 'Simple case with comments after url',
564 'foo { prop: url(red.gif)/* some {funny;} comment */ ; }',
565 'foo { prop: url(http://localhost/w/red.gif?34ac6)/* some {funny;} comment */ ; }',
568 'Embedded file with comment before url',
569 'foo { /* @embed */ background: /* some {funny;} comment */ url(red.gif); }',
570 "foo { background: /* some {funny;} comment */ url($red); background: /* some {funny;} comment */ url(http://localhost/w/red.gif?34ac6)!ie; }",
573 'Embedded file with comments inside and outside the rule',
574 'foo { /* @embed */ background: url(red.gif) /* some {foo;} comment */; /* some {bar;} comment */ }',
575 "foo { background: url($red) /* some {foo;} comment */; background: url(http://localhost/w/red.gif?34ac6) /* some {foo;} comment */!ie; /* some {bar;} comment */ }",
578 'Embedded file with comment outside the rule',
579 'foo { /* @embed */ background: url(red.gif); /* some {funny;} comment */ }',
580 "foo { background: url($red); background: url(http://localhost/w/red.gif?34ac6)!ie; /* some {funny;} comment */ }",
583 'Rule with two urls, each with comments',
584 '{ background: /*asd*/ url(something.png); background: /*jkl*/ url(something.png); }',
585 '{ background: /*asd*/ url(http://localhost/w/something.png); background: /*jkl*/ url(http://localhost/w/something.png); }',
588 'Sanity check for offending line from jquery.ui.theme.css (T62077)',
589 '.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d3d3d3/*{borderColorDefault}*/; background: #e6e6e6/*{bgColorDefault}*/ url(images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; }',
590 '.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d3d3d3/*{borderColorDefault}*/; background: #e6e6e6/*{bgColorDefault}*/ url(http://localhost/w/images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; }',
597 * This tests basic functionality of CSSMin::buildUrlValue.
599 * @dataProvider provideBuildUrlValueCases
600 * @covers CSSMin::buildUrlValue
602 public function testBuildUrlValue( $message, $input, $expectedOutput ) {
605 CSSMin
::buildUrlValue( $input ),
606 "CSSMin::buildUrlValue: $message"
610 public static function provideBuildUrlValueCases() {
614 'scheme://user@domain:port/~user/fi%20le.png?query=yes&really=y+s',
615 'url(scheme://user@domain:port/~user/fi%20le.png?query=yes&really=y+s)',
619 'data:image/png;base64,R0lGODlh/+==',
620 'url(data:image/png;base64,R0lGODlh/+==)',
624 "https://en.wikipedia.org/wiki/Wendy's",
625 "url(\"https://en.wikipedia.org/wiki/Wendy's\")",
628 'URL with parentheses',
629 'https://en.wikipedia.org/wiki/Boston_(band)',
630 'url("https://en.wikipedia.org/wiki/Boston_(band)")',
636 * Seperated because they are currently broken (T37492)
639 * @dataProvider provideStringCases
640 * @covers CSSMin::remap
642 public function testMinifyWithCSSStringValues( $code, $expectedOutput ) {
643 $this->testMinifyOutput( $code, $expectedOutput );
646 public static function provideStringCases() {
648 // String values should be respected
649 // - More than one space in a string value
650 [ 'foo { content: " "; }', 'foo{content:" "}' ],
651 // - Using a tab in a string value (turns into a space)
652 [ "foo { content: '\t'; }", "foo{content:'\t'}" ],
653 // - Using css-like syntax in string values
655 'foo::after { content: "{;}"; position: absolute; }',
656 'foo::after{content:"{;}";position:absolute}'