Wallaby.js supports continuous testing and real-time code coverage for JSX and React.js.


You may find a very detailed step by step react.js tutorial in our blog. The source code for the blog post is available in this repository.

You may also find the example of React + Webpack in this other sample repository.


React + Webpack + ES6

You may find the working sample of wallaby.js configuration for React + Webpack + ES6 in this repository.


If you are using the create-react-app tool for your React application without eject, you may find a couple of tips to configure wallaby.js for the setup below.

The create-react-app tool is using Jest, so you use the relevant wallaby.js docs section as a start point for your configuration.

Because create-react-app stores some of the node modules under react-scripts/node_modules, you may need to let wallaby.js node runner know about it by setting the NODE_PATH environment variable.

The next step is to configure babel compiler. The create-react-app tool is using react-app preset, so we will need to add it to the wallaby babel config.

The last step is to configure jest the same way as the create-react-app does to stub CSS and other assets. It’s done in the setup function by calling the same script that create-react-app calls to create jest config.

You may find the full config for the clean create-react-app run below:

module.exports = function (wallaby) {

  // Babel, jest-cli and some other modules may be located under
  // react-scripts/node_modules, so need to let node.js know about it
  var path = require('path');
  process.env.NODE_PATH +=
    path.delimiter +
    path.join(__dirname, 'node_modules') +
    path.delimiter +
    path.join(__dirname, 'node_modules/react-scripts/node_modules');

  return {
    files: [

    tests: ['src/**/*.test.js?(x)'],

    env: {
      type: 'node',
      runner: 'node'

    compilers: {
      '**/*.js?(x)': wallaby.compilers.babel({
        babel: require('babel-core'),
        presets: ['react-app']

    setup: wallaby => {
      const jestConfig = require('react-scripts/scripts/utils/createJestConfig')(p => require.resolve('react-scripts/' + p));
      delete jestConfig.transform['^.+\\.(js|jsx)$'];
      delete jestConfig.testEnvironment;

    testFramework: 'jest'

You may also find a sample wallaby.js configuration for create-react-app-ts generated project here.