Mocha --require syntax #310

Closed
chrisblossom opened this Issue Oct 27, 2015 · 6 comments

Projects

None yet

3 participants

@chrisblossom

I am following a react tutorial and wanted to try Wallaby.js at the same time.

My npm test script is:

"test": "mocha --compilers js:babel/register --require ./test/test_helper.js  --recursive",

test_helper.js:

import chai from 'chai';
import chaiImmutable from 'chai-immutable';

chai.use(chaiImmutable);

How can I tell Wallaby to --require ./test/test_helper.js for Mocha?

@ArtemGovorov
Member

You may use the bootstrap function and require the helper file from it. Note that the helper file needs to be in your files list, alternatively you can reference it by full path, like in this example.

@chrisblossom

Thanks @ArtemGovorov. It seems I am unable to use import during the bootstrap.

This works:

//import chai from 'chai';
const chai = require('chai');
//import chaiImmutable from 'chai-immutable';
const chaiImmutable = require('chai-immutable');

chai.use(chaiImmutable);

This is the exact error I receive when using import and not require:

/Users/chris/github/voting-server/test/test_helper.js:1
(function (exports, require, module, __filename, __dirname) { import chai from
                                                              ^^^^^^
SyntaxError: Unexpected reserved word
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:393:25)
    at Object.Module._extensions..js (module.js:428:10)
    at Module.load (module.js:335:32)
    at Function.Module._load (module.js:290:12)
    at Module.require (module.js:345:17)
    at require (module.js:364:17)

wallaby.js:

const babel = require('babel');

module.exports = wallaby => {
  return {
    files: [
      'src/*.js',
    ],

    tests: [
      'test/*spec.js',
    ],

    compilers: {
      '**/*.js': wallaby.compilers.babel({
        babel: babel,
        stage: 0,
      }),
    },

    workers: {
      initial: 6,
      regular: 2,
    },

    env: {
      type: 'node',
    },

    testFramework: 'mocha',

    bootstrap: function bootstrap(wallaby) {
      const path = require('path');
      require(path.join(wallaby.localProjectDir, 'test', 'test_helper'));
    },
  };
};
@ArtemGovorov
Member

@chrisblossom Hey Chris, when you require the helper file like

require(path.join(wallaby.localProjectDir, 'test', 'test_helper'));

it just loads it from your project without processing like the rest of files, so it doesn't get compiled with babel and hence the error.

To make it work, you may use the solution with including the file to your files list, this way it gets processed with babel like the rest. So something like this should work for you

const babel = require('babel');

module.exports = wallaby => {
  return {
    files: [
      'src/*.js',
      'test/test_helper.js' // <-- the file will now be processed by wallaby like the rest of files
    ],

    tests: [
      'test/*spec.js',
    ],

    compilers: {
      '**/*.js': wallaby.compilers.babel({
        babel: babel,
        stage: 0,
      }),
    },

    workers: {
      initial: 6,
      regular: 2,
    },

    env: {
      type: 'node',
    },

    testFramework: 'mocha',

    bootstrap: function bootstrap() {
      require('./test/test_helper'); // <-- it's in the `files` list, so you may just do that
    },
  };
};

Please let me know if it works for you.

@chrisblossom

@ArtemGovorov That worked, thank you! I first did that, but incorrectly omitted the ./ from the path. I appreciate the help.

@miguelbermudez

@ArtemGovorov, Thanks for this update. I have the exact some issue but if I follow this, I get ReferenceError: window is not defined.

I'm pretty sure it's because I have set the env: type to node, but if I set it to browser then I don't have ability to require the test_helper.js file.

Is there a workaround for requiring a file before mocha tests and have the environment set to browser?

Thanks and apologies for the threadjack.

FYI, this a for a web app in browser using webpack, mocha and react.

@ArtemGovorov
Member

@miguelbermudez Yep, there's a way to make it work for browser environment as well.

If your test_helper.js file doesn't require anything, but only loads some global stuff, you may just include the file in your files list with load: true flag.

If you test_helper.js does require other things in it, and needs to be webpack-ed, you may include the file into the entry patterns list. In the example in the linked doc section fixture.js is your test_helper.js.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment