DailyJS

JSpec

Alex R. Young

Subscribe

@dailyjs

Facebook

Google+

testing

JSpec

Posted by Alex R. Young on .
Featured

testing

JSpec

Posted by Alex R. Young on .

We recently posted a unit test
roundup
, so I noticed that
JSpec has been updated to version 3. This version introduces several interesting updates (see the full
change list):

  • Rhino's jar is included so console tests can work without installing extra stuff
  • Added a jspec stats command
  • Subcommand hooks -- checks for spec/commands/*_command.rb
  • Ruby server is now a Sinatra app

JSpec is now version 3.0 and currently has over 200 followers on GitHub,
so it's worth checking out.

Syntax Examples

JSpec tests can be written using a custom DSL or a grammar-less
JavaScript syntax. When using the DSL in browser-based tests, be sure to
use JSpec.exec() to run tests rather than including the
code in script tags (more details are in the README).

Tests written with the DSL look like this:

describe 'ShoppingCart'
  before_each
    cart = new ShoppingCart
  end

  describe 'addProducts'
    it 'should add several products'
      cart.addProduct('cookie')
      cart.addProduct('icecream')
      cart.should.have 2, 'products'
    end
  end

  describe 'checkout'
    it 'should throw an error when checking out with no products'
      -{ cart.clear().checkout() }.should.throw_error EmptyCart
    end
  end
end

JavaScript equivalent:

JSpec.describe('ShoppingCart', function(){
  before_each(function{
    cart = new ShoppingCart
  })

  describe('addProducts', function(){
    it ('should add several products', function(){
      cart.addProducts('cookie')
      cart.addProducts('icecream')
      expect(cart).to(have, 2, 'products')
    })
  })

  describe('checkout', function(){
    it ('should throw an error when checking out with no products', function(){
      expect(function(){ cart.clear().checkout() }).to(throw_error, EmptyCart)
    })
  })
})

Custom Matchers

Custom matchers can be defined using JSpec.addMatchers.
It's possible to control the error messages. It's also possible to
create sets of macros with similar names:

JSpec.addMatchers({
  'be disabled selected checked' : function(attr) {
    return 'jQuery(actual).attr("' + attr + '")'
  },

  'have type id title alt href src sel rev name target' : function(attr) {
    return function(actual, value) {
      return value ? jQuery(actual).attr(attr) ## value:
                     jQuery(actual).attr(attr)
    }
  }
})

Other Features

JSpec includes a command-line tool that can initialise project
templates, as well as auto-testing when files are changed. It can also
work with Growl in Mac OS X. It includes lots of familiar matchers and
works well in a browser and console.

Installation

To try JSpec out, you can install it with
RubyGems -- gem install jspec and read the docs on
github.com/visionmedia/jspec.