Carles Andrés

Passionate Web Developer

Creating a Grunt Task for Easier Testing

As an avid Yeoman user I start many of my pet projects, and some of my professional ones, by invoking generator-webapp. However, I miss the powerful development tools provided by the browser when I find a bug in my tests while running them through PhantomJS.

Therefore, after running yo webapp, one of the first things that I usually do is to add a custom task to my Gruntfile so that I can run my tests in a browser window.

My testlivereload subtask looks like this:

1
2
3
4
5
6
7
8
9
10
11
12
testlivereload: {
    options: {
        middleware: function (connect) {
            return [
                lrSnippet,
                connect.static(__dirname),
                mountFolder(connect, '.tmp'),
                mountFolder(connect, 'test')
            ];
        }
    }
}

And my testlive task:

1
2
3
4
5
6
7
8
grunt.registerTask('testlive', [
    'clean:server',
    'concurrent:test',
    'autoprefixer',
    'connect:testlivereload',
    'open',
    'watch'
]);

I also learned recently that I can add a -d flag to a grunt command to make it more verbose. That way I can also have more feedback from, for example, PhantomJS when running my usual grunt serve command.

Comments