Unit Testing in JavaScript

Last week a colleague asked for my help finding better unit test tools for Java Script. He’s done some digging on the state of the art with JavaScript unit tests and finds the whole lot wanting. His discoveries:

Tool Pros Cons
Jsunit: we already use it for some of our js code.
  • can be invoked from an ant build file
  • launches browser to run the tests
  • eclipse plug-in
  • Mailing list is still active
  • launches browser to run the tests
  • Does not support js file to write the unit test code: it has to embedded inside a html file
  • it has not be updated for a couple of years  – while there hasn’t been a release changes have been made to the source repository (perhaps minor) in the past year.
rhinounit
  • ant driven
  • supports js file
  • very simple to use
  • Simulation of JavaScript engine: not advanced enough to support our code: I tried to run test code working with jsunit: I encountered issue when loading our common JavaScript files.
crosscheck: Note: Crosscheck wasn’t tested with any code.
  • Can invoked from ant build file
  • Simulates real browser behaviour
  • Simulation of JavaScript engine from a limited number of browser versions.
  • No activity for 2 years: it does not support versions 2.x nor 3.x from Firefox.
jsspec
  • Runs on actual browser
  • JavaScript only framework: cannot be called from ant build file
jspec (no website – just a source tree)
  • Runs on actual browser
  • Does not seem to support our code:  I tried to run test code running with js unit: I encountered issue when loading our common JavaScript files.
  • JavaScript only framework: cannot be called from ant build file
Screw.unit (docs) Note: Not tested but it is very similar to jsspec and jspec.
  • Runs on actual browser
  • JavaScript only framework: cannot be called from ant build file

imageSo it seems to him that Jsunit is the only choice we have. It is not perfect though because it does not provide an easy way to apply  the TDD process for the following reasons:

  • It does not provide a simple and integrated way to run JavaScript unit test
  • It forces you to write the unit tests in a html file instead of a .js file.
  • It forces you to have a local installation of the jsunit framework in order to avoid absolute hard coded path to reference js unit files.

As a consequence, you have to switch back and forth from you IDE and all the browsers we want to support while "TDDing" in JavaScript. It is feasible but doesn’t seem very effective.

I tried asking about this on StackOverflow generated some interesting answers:

Asking on the Test Driven Mailing List got another batch of answers:

  • QUnit from jQuery (got several recommendations for this)
  • Mocking tool for JavaScript
  • Use GWT and do all your work in Java

In addition two people didn’t answer the question directly but instead sent my in the direction of some books:

Conclusions

There isn’t one good place to ask JavaScript/Unit Testing questions. The best so far seems StackOverflow.com seems to be the only real option.

Of the Unit Test Frameworks the real options seem to be:

I also did some digging for Mock Frameworks and have only come up with a list of tools:

  • JSMock – JSMock provides expectation recording and matching, and has the ability to return, throw, and stub on object method calls
  • Jack – The project aims to help developers write short and readable JavaScript tests.
  • MockMe – written because of Johanne’s dissatisfaction with other JavaScript Mock tools.
  • QMock – very new

There is some good writing that will give you a flavour of TDD with Javascript:

Best ongoing sources: Pathfinder Blog and Ajaxian seem to be good reading.

What tools did I miss? Are there any good JavaScript mailing lists where the participants discuss TDD?

Be Sociable, Share!

Certified ScrumMaster TrainingIf you enjoyed this post take a look at Certified ScrumMaster Training. We currently have courses scheduled in Ottawa, Montreal, Toronto and Edmonton.


  • http://www.nczonline.net/ Nicholas C. Zakas

    Just FYI, a mock object utility is in the works for YUI Test and will be available as part of YUI 3.0 Preview Release 2. If you have any questions about YUI Test, please check out the YUI discussion list or email me directly.

  • http://nlsmith.com/ Nathan L Smith

    Scriptaculous also includes a basic unit testing framework: http://github.com/madrobby/scriptaculous/wikis/unit-testing

    It’s also included in Prototype’s repository.

  • kky
  • masya

    I think you’ve missed THE testing tool – Selenium. Take a look here:
    http://extjs.com/blog/2008/11/03/testing-ext-js-ext-gwt-applications-with-selenium/

  • http://choangalvez.nom.es choan

    There’s a port of the Scriptaculous/Protototype testing framework with no dependencies on prototype. JsUnitTest: http://jsunittest.com/

    On top of that, you can use jShoulda (http://jshoulda.scriptia.net/) that provides nexted contexts and other niceties.

  • http://profile.typepad.com/mlevison Mark Levison

    maysa – I’m familiar with Selenium but thought it was really a functional testing tool and not a unit testing tool. Did I miss something critical?

    choan, kky, Nathan and Nicholas thanks for the additional frameworks.

  • http://qooxdoo.org Andreas Ecker

    You might also be interested in the unit testing framework that is part of qooxdoo, an open source RIA framework similar to Dojo, ExtJS, etc. but with quite a comprehensive tool chain.

    Try the online version of the testrunner. Hint: hit the gray arrow at the top left (should be made more obvious). It’s a “play” button that runs the selected tests.

    To find out more about the JS classes that let you define your unit tests, see the online API viewer.

    For automated UI testing (based on Selenium RC), check out the Simulator project.

  • http://theruntime.com/ Jay Kimble

    One you missed is excmaunit… sort of jsunit, but in browser.

    I’d give you the URL, but I’m not sure of it… (google it yourself)

  • http://theruntime.com/ Jay Kimble

    BTW, I fat fingered that… it’s EcmaUnit –> http://kupu.oscom.org/download/ecmaunit-0.3.html

    Last update is a long time ago, so if you want something recent this isn’t the animal for you

  • http://www.maciaszek.pl Radek Maciaszek

    There is a fork of JSUnit which doesn’t seem to have all the cons you mentioned (can be run using Rhino, doesn’t have to embedded into Html and seems to have some recent releases): http://jsunit.berlios.de/

  • http://rhinounit.googlecode.com Tiest Vilee

    hi!

    I’m lead developer for RhinoUnit, and I’d love to know how I can improve the library for you. If you could let me know what problems you had I could look into fixing them for you.

    You mention that you tried to run test code from JSUnit in it – this isn’t really how RhinoUnit works. I’ve tried to make it as javascript fluent as possible, rather than trying to mimic SUnit. Consequently I use Functions rather than objects, and I test for more JS specific things like forgetting VARs, running JSLint, ensuring that functions get called an so on.

    Basically the framework developed out of real world requirements rather than just copying someone elses.

  • http://profile.typepad.com/mlevison Mark Levison

    Tiest – In fact I wasn’t the one who had done the work testing the frameworks, I was just doing research on behalf of a colleague who had. I’ve passed your notes along to him.

  • Korny

    A great list – very useful.

    Another mocking library I discovered – amok http://code.google.com/p/amok/ – just because you don’t have enough options already!

  • http://jonkruger.com/blog Jon Kruger

    I’ve used JSSpec and it worked pretty good for me.

    I wrote up a series of posts about writing JavaScript tests – http://jonkruger.com/blog/2008/11/25/unit-testing-javascript-introduction-javascript-basics/.

    Here is a good post on integrating QUnit tests with TeamCity builds… http://www.lostechies.com/blogs/joshuaflanagan/archive/2008/09/18/running-jquery-qunit-tests-under-continuous-integration.aspx

  • http://vision-media.ca TJ

    JSpec has come along way, its syntax is far better than the rest, check it out http://gist.github.com/92283 http://visionmedia.github.com/jspec/

  • http://github.com/Xian Christian Williams

    Also check out Jasmine — http://github.com/pivotal/jasmine — an easy, framework-agnostic behavior-driven development environment for JavaScript.

  • Pingback: Interessante Links im Netz 11 | DaRaFF's Blog

  • Pingback: YUI unit testing - Programmers Goodies