Automatically Reload the Browser for Javascript Tests

Automatically Reload the Browser for Javascript Tests

Fast tests mean a fast feedback loop when doing TDD. Let’s make our tests fast with Guard.

A Jasmine spec in CoffeeScript:

describe 'A suite', ->
  it 'contains spec with an expectation', ->
    expect(true).toBe(true)

Gemfile:

source 'https://rubygems.org'

gem 'jasmine'
gem 'guard'
gem 'guard-coffeescript'
gem 'guard-livereload'

Guardfile:

guard :coffeescript, output: 'javascripts' do
  watch(%r{^src/(.*)\.coffee})
end

guard :coffeescript, output: 'spec/javascripts' do
  watch(%r{^spec/src/(.*)\.coffee})
end

guard 'livereload' do
  watch(%r{^spec/javascripts/.*/(.*)\.js})
  watch(%r{^spec/javascripts/(.*)\.js})
  watch(%r{^javascripts/.*/(.*)\.js})
  watch(%r{^javascripts/(.*)\.js})
end

This compiles CoffeeScript, watches our specs or Javascript files for changes, and reloads our browser automatically.

Start a jasmine server:

rake jasmine

Visit localhost:8888. See the results of the specs.

Change the specs or Javascript files and the browser will automatically reload.

Dylan Griffin Developer

Hound reviews Ruby and CoffeeScript code for style violations and comments on your GitHub pull requests. Free for open source repos.