Simple automated JavaScript testing with Grunt and Mocha/Chai

When I was new to coding, there was a point when I knew that TDD was valuable, but I didn’t know enough to feel comfortable using robust testing frameworks.

The problem:

  • TDD was a habit I wanted to learn.
  • The process of setting up my initial tests and directory structure was time consuming and annoying.

To form the habit of testing everything, it was important for me to create as little resistance as possible between myself and testing.

Large popular testing skeleton frameworks like Yeoman and Nightwatch had more bells and whistles than I needed and I found it easy to get lost in their more complicated possibilities.

But it was tedious to manually create my directory structure for each project and install individual packages for Chai, Mocha, Grunt, and then modify all of their config files.

The solution:

  • Create a skeleton structure with a default directory structure, Gruntfile.js, and package.json
  • Turn that into a git repo that you can clone anywhere
  • Write a bash script so that with one command the repo can be downloaded and customized based off of the project name
This led to the following TDD setup and workflow for toy problems.

The git repo for the framework is at https://github.com/eihli/test-skeleton

Simply cloning that repo at the start of a project will be a solid foundation. But there are two problems with that.

  • After you clone the repo, you'll have to change the repo's remote so that you aren't pushing your project back to your test-skeleton repo.
  • You can't clone the test-skeleton framework into a folder that is already a git repo without overwriting some of the other repo files.

The following bash script will download a zip of the directory structure and extract it to the current folder without pulling any repository data. (Check out Josh Wyatt's bash_profile for an example of some nice alias's and shortcuts.)

I have a function in my bash profile that creates a new project directory, downloads an npm package.json file and a Gruntfile, then runs npm install.

function mktest() {
  wget https://github.com/eihli/test-skeleton/archive/master.zip -O temp.zip
  unzip temp.zip -d ./
  mv ./test-skeleton-master/* ./
  rm -r ./test-skeleton-master temp.zip
  npm install    
}

The above code downloads files from a test-skeleton repo I from my github.

module.exports = function (grunt) {

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    jshint: {
      all: ['Gruntfile.js', 'package.json'],
      options: {
        curly: true,
        eqeqeq: true,
      }
    },
    watch: {
      files: ['Gruntfile.js', 'package.json'],
      tasks: ['jshint', 'mochaTest'],
      options: {
        atBegin: true
      }
    },
    mochaTest: {
      src: []
    }
  });

  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-mocha-test');
};