ntbixw
Last Updated: February 25, 2016
·
34.69K
· afeld
5e6ceef905d14ade228ea22c445d57bc

JavaScript test framework comparison

A friend was recently deciding on a test framework for client-side JavaScript, and asked for advice on which to use. There are many to choose from, and it's tough to decide, since they all do basically the same thing:

  1. Describe what you're testing
  2. Set up what you're going to test
  3. Assert whether the thing did what you expect

The differentiating factors are really in the details. I have used a few of the most popular JS test frameworks (Jasmine, Mocha, and QUnit) across different projects, though there are many more. Here is how they compare.

Differences

Includes the latest version, at time of writing.

Jasmine (v2.0.1)

Jasmine seems to be the most popular of the three (based on discussions with other programmers, and from number of stars on the repository). It also has runners in Python and Ruby, which is incredibly useful if you want to run your client-side tests alongside your server-side ones.

I was going to write a gripe about Jasmine's asynchronous testing syntax, but it looks like it has been changed in 2.0, and now is very close to that of QUnit and Mocha. Hooray!

Mocha (v1.20.1)

Mocha doesn't have an assertion library built in, so it requires an additional 3rd-party library to be added. While I appreciate the flexibility, this adds some unnecessary friction for first-time users, who need to pick one without a lot of context about why one would be a better choice than the other. (The answer is that "it makes zero difference – it's just a matter of picking the syntax you like".) One awesome (more advanced) thing about Mocha is that it has built-in support for Promises.

QUnit (v1.14.0)

QUnit is the easiest of the three to set up – it only requires a JS file, a CSS file, and a single DOM element:

<div id="qunit"></div>

My first issue with QUnit is that, in an effort to reduce the number of global functions created, QUnit is more verbose than the others, using methods like QUnit.test() instead of simply it(). One other complaint is how it handles grouping of tests. QUnit provides a module() method:

QUnit.module('parent thing - child1');
// test child1

QUnit.module('parent thing - child2');
// test child 2

whereas Jasmine and Mocha both have (the same) syntax for nesting test blocks:

describe('parent thing', function(){
  describe('child1', function(){
    // test child1
  });

  describe('child2', function(){
    // test child2
  });
});

While sometimes more verbose, I like that the nestable describe() functions make the grouping clearer.

Update: @yozlet pointed out that qunit-bdd adds the nestable describe() behavior to QUnit.

Similarities

  • All can be run in a browser page
    • Note: Debugging JS in a browser is a lot easier than debugging in a command-line, so having that option is very nice
  • All can be run from command-line, via Node.js/PhantomJS
  • Most things

In conclusion, don't stress a ton about picking – people's testing framework of choice is mostly arbitrary. Just focus on the much harder problem of writing good tests :-)

See also

5 Responses
Add your response

15766
263cde71709be665db6ce1d2c0d8e532

This is great! Really helpful!!

over 1 year ago ·
15767
263cde71709be665db6ce1d2c0d8e532

Awesome roundup. Really helpful!

over 1 year ago ·
15781
Steven wilson pen and ink by ergasterd d4syzje

Thank you

over 1 year ago ·
15809
Avatar

Might want to add Testium https://github.com/groupon-testium/testium :)

over 1 year ago ·
15827
5e6ceef905d14ade228ea22c445d57bc

just3ws: Seems to be a runner for Mocha, so the info above would apply.

over 1 year ago ·