Simple Wallaby Node App

Getting Wallaby to work with a barebones node app requires only a minimal Wallaby config. If you just want to practice installing wallaby in your code editor and seeing it work on a single ‘hello world’ style test, this is the place to start. For our purposes, this app will only have a couple dependencies and only a few files.

See this tiny example app on github.

Install wallaby into your editor

I use atom and the Wallaby plugin works great. But you can use any number of editors and follow the corresponding instructions.

Setup a new Node app

run npm init. At the prompts put whatever you like or pound your enter key.

Setup the wallaby config file

This configuration file tells wallaby how to run and what files to load, among other things. This file is required, but the most basic version is only about . We will specify our app’s code, our test code, that we need to run in node instead of the default (PhantomJS), and that we want to use babel (for the latest javascript features).

module.exports = function (wallaby) {  
  return {
    files: [
      './app.js'
    ],
    tests: [
      './test.js'
    ],
    env: {
      type: 'node'
    },
    compilers: {
      '**/*.js': wallaby.compilers.babel()
    }
  };
}

// wallaby.js

Setup babel

Wallaby works with Babel out of the box, you just need to install it. You can customize how it runs with your own .babelrc file.

I try using the latest javascript features whenever I can, especially 'import'. We can add a babel plugin and specify it in the .babelrc file.

run: npm install --save-dev babel-core babel-preset-latest

Make a .babelrc file and tell babel to use our chosen preset (preset is a group of plugins bundled together, this gives us the latest javascript features);

{
  "presets": ["latest"]
}

// .babelrc

Create source and test files

This example app has one source file that exports one function. The function is foo() and it returns a string, "bar".

export function foo() {  
  return 'bar';
}

// app.js

The test file tests that foo works as expected. I like using chai ‘expect’, so here we can first install chai:

npm install --save-dev chai.

And then we can use it in our test file:

import { expect } from 'chai';  
import { foo } from './app';

describe('foo returns bar', () => {  
  expect(foo()).to.equal('bar');
});

Start wallaby.

See the green dots. Change ‘bar’ to ‘banana’ and see the green dots change to red, and read wallaby’s helpful output, right there in your browser.

Wallaby red and green

Want more practice? Try setting up Wallaby with a React webapp using the create-react-app package.