Posted on January 21, 2015 by Chris Harrington

Testing a Browserify project with Jasmine and Grunt

The WordPress theme for this site has been built (read: over-engineered) with Browserify and React. Most of it is pretty straightforward, but the widgets on the right are a little more complicated. I’ve only just started working with Browserify in general, so I had a relatively difficult time setting up a workflow for testing some of my modules. If you’re unaware, Browserify works by bundling up all of your CommonJS modules and any modules in your node_modules folder for easy use throughout your application using require. You provide the entry point to your application, and Browserify will step through all of the require statements to pull in all the appropriate files and modules. It’s a neat system and, in general, I’m a big fan of it, but I had to change the way I usually test my JavaScript files. I’m using Grunt for my build tool, so the goal here is to be able to type grunt test from the command line and have all my specs run as per usual.

Continue reading

Posted on January 20, 2015 by Chris Harrington

Concurrent watches with Grunt

I’ve been using Grunt with Browserify recently to build the theme for this blog (https://github.com/chrisharrington/dapper-developer-theme) and I’ve noticed that using grunt-contrib-watch in conjunction with Browserify is pretty slow: on the order of 1500ms on a JavaScript code change, which I felt was unacceptable. Watchify is a tool used to bundle Browserify modules on change that works much faster because it only rebundles files that have changed. This is great, but I run into a problem if I’m watching my LESS files at the same time, as each watcher will block. I’ve put together a quick Gruntfile that’ll allow you to run multiple watchers using grunt-concurrent, a Grunt task that’ll let us to run multiple blocking tasks at the same time.

Continue reading