Merge pull request #33 from jhnns/refactor/tests

Refactor tests

Author: akiran

README.md

@@ -28,8 +28,12 @@ module.exports = {
     loaders: [
       {
         test: /\.scss$/,
-        loader: "style!css!sass?outputStyle=expanded&includePaths[]=" + 
-            (path.resolve(__dirname, './bower_components/bootstrap-sass-official'))
+        // Query parameters are passed to node-sass
+        loader: "style!css!sass?outputStyle=expanded&" +
+          "includePaths[]=" +
+            (path.resolve(__dirname, "./bower_components")) + "&" +
+          "includePaths[]=" +
+            (path.resolve(__dirname, "./node_modules"))
       }
     ]
   }

package.json

@@ -4,7 +4,8 @@
   "description": "SASS loader for Webpack",
   "main": "index.js",
   "scripts": {
-    "test": "rm test/output/* && node ./node_modules/webpack/bin/webpack.js -d -w --config=test/webpack.config.js"
+    "pretest": "node test/prepare.js",
+    "test": "mocha -R spec"
   },
   "keywords": [
     "sass",
@@ -19,11 +20,13 @@
   "license": "MIT",
   "dependencies": {
     "loader-utils": "~0.2.2",
-    "node-sass": "^1.0.1",
+    "node-sass": "^1.2.2",
     "sass-graph": "^0.1.2"
   },
   "devDependencies": {
-    "css-loader": "^0.9.0",
+    "mocha": "^2.0.1",
+    "raw-loader": "^0.5.1",
+    "should": "^4.3.0",
     "webpack": "^1.4.0"
   }
 }

test/.gitignore

@@ -0,0 +1 @@
+**/*.css

test/index.test.js

@@ -0,0 +1,70 @@
+'use strict';
+
+var should = require('should');
+var path = require('path');
+var webpack = require('webpack');
+var fs = require('fs');
+
+var CR = /\r/g;
+
+function readCss(ext, id) {
+    return fs.readFileSync(path.join(__dirname, ext, id + '.css'), 'utf8').replace(CR, '');
+}
+
+function test(name, id, query) {
+    it(name, function (done) {
+        var exts = ['scss', 'sass'];
+        var pending = exts.length;
+
+        query = query || '';
+
+        exts.forEach(function (ext) {
+            var expectedCss = readCss(ext, id);
+            var sassFile = 'raw!' +
+                    path.resolve(__dirname, '../index.js') + '?' +
+                    query +
+                    (ext === 'sass'? '&indentedSyntax=sass' : '') + '!' +
+                    path.join(__dirname, ext, id + '.' + ext);
+            var actualCss;
+
+            // run asynchronously
+            webpack({
+                entry: sassFile,
+                output: {
+                    path: __dirname + '/output',
+                    filename: 'bundle.' + ext + '.js',
+                    libraryTarget: 'commonjs2'
+                }
+            }, function onCompilationFinished(err, stats) {
+                if (err) {
+                    return done(err);
+                }
+                if (stats.hasErrors()) {
+                    return done(stats.compilation.errors[0]);
+                }
+                if (stats.hasWarnings()) {
+                    return done(stats.compilation.warnings[0]);
+                }
+                delete require.cache[path.resolve(__dirname, './output/bundle.' + ext + '.js')];
+
+                actualCss = require('./output/bundle.' + ext + '.js');
+                // writing the actual css to output-dir for better debugging
+                //fs.writeFileSync(__dirname + '/output/' + name + '.' + ext + '.async.css', actualCss, 'utf8');
+                actualCss.should.eql(expectedCss);
+
+                pending--;
+                if (pending === 0) {
+                    done();
+                }
+            });
+        });
+    });
+}
+
+describe('sass-loader', function () {
+    test('should compile simple sass without errors', 'language');
+    test('should resolve imports correctly', 'imports');
+    test('should pass the include paths to node-sass', 'include-paths',
+        'includePaths[]=' + path.resolve(__dirname, './sass/another') + '&' +
+        'includePaths[]=' + path.resolve(__dirname, './scss/another'));
+});

test/output/.gitignore

@@ -0,0 +1 @@
+*.js

test/prepare.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var sass = require('node-sass');
+var fs = require('fs');
+var path = require('path');
+
+['scss', 'sass'].forEach(function (ext) {
+    var files = [];
+
+    fs.readdirSync(path.join(__dirname, ext))
+        .filter(function (file) {
+            return path.extname(file) === '.' + ext;
+        })
+        .map(function (file) {
+            var filename;
+
+            files.push(filename = path.join(__dirname, ext, file));
+            return sass.renderSync({
+                outputStyle: 'compressed',
+                file: filename,
+                includePaths: [
+                    path.join(__dirname, ext, 'another')
+                ]
+            })
+        })
+        .forEach(function (content, index) {
+            fs.writeFileSync(files[index].replace(new RegExp('\\.' + ext + '$', 'gi'), '.css'), content, 'utf8');
+        });
+});

test/sass/another/_module.sass

@@ -0,0 +1,2 @@
+.another-module
+  background: hotpink

test/sass/imports.sass

@@ -0,0 +1 @@
+@import another/module

test/sass/include-paths.sass

@@ -0,0 +1 @@
+@import module

test/sass/language.sass

@@ -0,0 +1,47 @@
+$font-stack:    Helvetica, sans-serif
+$primary-color: #333
+
+body
+  font: 100% $font-stack
+  color: $primary-color
+
+nav
+  ul
+    margin: 0
+    padding: 0
+    list-style: none
+
+  li
+    display: inline-block
+
+  a
+    display: block
+    padding: 6px 12px
+    text-decoration: none
+
+=border-radius($radius)
+  -webkit-border-radius: $radius
+  -moz-border-radius:    $radius
+  -ms-border-radius:     $radius
+  border-radius:         $radius
+
+.box
+  +border-radius(10px)
+
+.message
+  border: 1px solid #ccc
+  padding: 10px
+  color: #333
+
+.success
+  @extend .message
+  border-color: green
+
+.error
+  @extend .message
+  border-color: red
+
+.warning
+  @extend .message
+  border-color: yellow
+