Support minifying extracted css (#237)

* Support minifying extracted css

* Remove broken file reference

index.js

@@ -71,6 +71,14 @@ function getIndent(html, $el) {
     return detectIndent(lines.join('\n')).indent;
 }
 
+/**
+ * Minify CSS
+ * @param {string} styles
+ */
+function minifyCSS(styles) {
+    return new CleanCSS().minify(styles).styles; // eslint-disable-line prefer-destructuring
+}
+
 module.exports = function (html, styles, options) {
     if (!_.isString(html)) {
         html = String(html);
@@ -109,7 +117,7 @@ module.exports = function (html, styles, options) {
 
     // Minify if minify option is set
     if (o.minify) {
-        styles = new CleanCSS().minify(styles).styles; // eslint-disable-line prefer-destructuring
+        styles = minifyCSS(styles);
     }
 
     if (styles) {
@@ -142,7 +150,12 @@ module.exports = function (html, styles, options) {
                 const href = $el.attr('href');
                 const file = path.resolve(path.join(o.basePath, href));
                 if (fs.existsSync(file)) {
-                    const diff = normalizeNewline(cave(file, {css: styles}));
+                    let diff = normalizeNewline(cave(file, {css: styles}));
+
+                    if (o.minify) {
+                        diff = minifyCSS(diff);
+                    }
+
                     fs.writeFileSync(reaver.rev(file, diff), diff);
                     $el.attr('href', normalizePath(reaver.rev(href, diff)));
                 }

test/expected/cartoon-expected-minified.css

@@ -0,0 +1 @@
+.cool{color:red}#not{color:red}body{color:red}@media screen and (min-width:768px){.container{max-width:730px}.header{padding-left:0;padding-right:0}.header{margin-bottom:30px}.jumbotron{border-bottom:0}}a{background:0 0}@media print{*{color:#000!important;text-shadow:none!important;background:0 0!important;box-shadow:none!important}}:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-size:62.5%;-webkit-tap-highlight-color:transparent}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fff}@media (min-width:768px){.lead{font-size:21px}}@media (min-width:768px){.container{width:750px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}.btn{display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-image:none;border:1px solid transparent;border-radius:4px}.nav>li{position:relative;display:block}.nav>li>a{position:relative;display:block;padding:10px 15px}.nav-pills>li{float:left}.nav-pills>li>a{border-radius:4px}.nav-pills>li+li{margin-left:2px}.nav-pills>li.active>a{color:#fff;background-color:#428bca}@media screen and (min-width:768px){.jumbotron{padding-top:48px;padding-bottom:48px}.container .jumbotron{padding-right:60px;padding-left:60px}.jumbotron h1{font-size:63px}}.pull-right{float:right!important}.foo{color:red}

test/index.js

@@ -83,6 +83,19 @@ describe('Module: inline-critical', function () {
         done();
     });
 
+
+    it('should extract and minify css', function (done) {
+        var html = read('test/fixtures/cartoon.html');
+        var css = read('test/fixtures/critical.css');
+        var expected = read('test/expected/cartoon-expected-minified.css');
+
+        var out = inlineCritical(html, css, {minify: true, extract: true, basePath: 'test/fixtures'});
+
+        expect(read(reaver.rev('test/fixtures/css/cartoon.css', expected))).to.be.equal(expected);
+
+        done();
+    });
+
     it('should inline and extract css correctly with absolute paths', function (done) {
         var html = read('test/fixtures/cartoon-absolute.html');
         var css = read('test/fixtures/critical.css');