---
title: Automatically Reload the Browser for Javascript Tests
teaser:
tags: web,javascript,testing
author: Dylan Griffin
published_on: 2012-09-29
---

Fast tests mean a fast feedback loop when doing TDD. Let's make our tests fast with [Guard](https://github.com/guard/guard).

A [Jasmine](http://pivotal.github.com/jasmine/) spec in [CoffeeScript](http://coffeescript.org/):

    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.