diff --git a/package.json b/package.json index ff7979f..3313415 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "author": "Tobias Koppers @sokra", "description": "style loader module for webpack", "devDependencies": { - "css-loader": "~0.8.0", + "css-loader": "^0.27.3", "file-loader": "^0.10.1", "jsdom": "^9.11.0", "memory-fs": "^0.4.1", diff --git a/test/basicTest.js b/test/basicTest.js index df10e89..b715084 100644 --- a/test/basicTest.js +++ b/test/basicTest.js @@ -11,6 +11,7 @@ describe("basic tests", function() { var requiredCss = ".required { color: blue }", requiredCssTwo = ".requiredTwo { color: cyan }", + localScopedCss = ":local(.className) { background: red; }", requiredStyle = ``, existingStyle = "", rootDir = path.resolve(__dirname + "/../") + "/", @@ -65,6 +66,7 @@ describe("basic tests", function() { fs.writeFileSync(rootDir + "main.js", "var css = require('./style.css');"); fs.writeFileSync(rootDir + "style.css", requiredCss); fs.writeFileSync(rootDir + "styleTwo.css", requiredCssTwo); + fs.writeFileSync(rootDir + "localScoped.css", localScopedCss); }); // before each it("insert at bottom", function(done) { @@ -143,8 +145,7 @@ describe("basic tests", function() { it("useable", function(done) { cssRule.use = [ { - loader: "style-loader/useable", - options: {} + loader: "style-loader/useable" }, "css-loader" ]; @@ -168,4 +169,53 @@ describe("basic tests", function() { runCompilerTest(expected, done); }); // it useable + + it("local scope", function(done) { + cssRule.use = [ + { + loader: "style-loader" + }, + { + loader: "css-loader", + options: { + localIdentName: '[name].[local]_[hash:base64:7]' + } + } + ]; + + fs.writeFileSync( + rootDir + "main.js", + [ + "css = require('./localScoped.css');" + ].join("\n") + ); + + let expected = 'localScoped-className_3dIU6Uf'; + runCompilerTest(expected, done, function() { return this.css.className; }); + }); // it local scope + + it("local scope, useable", function(done) { + cssRule.use = [ + { + loader: "style-loader/useable" + }, + { + loader: "css-loader", + options: { + localIdentName: '[name].[local]_[hash:base64:7]' + } + } + ]; + + fs.writeFileSync( + rootDir + "main.js", + [ + "css = require('./localScoped.css');" + ].join("\n") + ); + + let expected = 'localScoped-className_3dIU6Uf'; + runCompilerTest(expected, done, function() { return this.css.locals.className; }); + }); // it local scope + }); // describe \ No newline at end of file diff --git a/test/utils.js b/test/utils.js index 86aaf29..9bab4b6 100644 --- a/test/utils.js +++ b/test/utils.js @@ -51,7 +51,13 @@ module.exports = { return fs; }, - runCompilerTest: function(expected, done) { + + /* + * @param {string} expected - Expected value. + * @param {function} done - Async callback from Mocha. + * @param {function} actual - Executed in the context of jsdom window, should return a string to compare to. + */ + runCompilerTest: function(expected, done, actual) { compiler.run(function(err, stats) { if (stats.compilation.errors.length) { throw new Error(stats.compilation.errors); @@ -62,8 +68,13 @@ module.exports = { jsdom.env({ html: jsdomHtml, src: [bundleJs], + virtualConsole: jsdom.createVirtualConsole().sendTo(console), done: function(err, window) { - assert.equal(window.document.head.innerHTML.trim(), expected); + if (typeof actual === 'function') { + assert.equal(actual.apply(window), expected); + } else { + assert.equal(window.document.head.innerHTML.trim(), expected); + } // free memory associated with the window window.close();