andre487 andre487 - 5 days ago 6
Javascript Question

Handle WebPack CSS imports when testing with Mocha

With WebPack you can import styles in your code like this:

import './PageSpinner.styl';
But when you try to test this code with Mocha, your tests will be crashed with SyntaxError because engine tries to handle styles like JS code.

How can I test code like this with Mocha?

Answer

I had the same problem lately and the solution was through Mocha compilers.

create a file, let's call it 'css-null-compiler.js' and it has:

function noop() {
  return null;
}

require.extensions['.styl'] = noop;
// you can add whatever you wanna handle
require.extensions['.scss'] = noop;
require.extensions['.png'] = noop;
// ..etc

when you run mocha from the command line, pass this file as a compiler

mocha /your/test.spec.js --compilers css:css-null-compiler.js
Comments