#261 Testing JavaScript with Jasmine. Froots/jasmine-sinon - GitHub. Testing Backbone applications with Jasmine and Sinon – Part 1 – Tinned Fruit. Overview This is the first in a series of articles demonstrating how to test a Backbone.js application, employing the Jasmine BDD test framework and the Sinon.JS spying, stubbing and mocking library.
In this part, we’ll take a brief look at Backbone, and then move on to an introduction to some of the features of Jasmine and Sinon.JS. Along the way we’ll look at why these tools are a such good fit for testing Backbone applications. If you have never written any JavaScript tests before, you might like to take a look at Christian Johansen’s recent series of articles over at scriptjunkie. Backbone everywhere In the last few months, Backbone.js has received a fair bit of exposure, with a number of tutorials and one or two high profile implementations.
Backbone’s popularity is understandable. Backbone’s MVC structure lends itself very nicely to bottom-up unit testing. About Jasmine BDD BDD emphasises shared language amongst developers and stakeholders. Specs Suites beforeEach() and afterEach() Spies. Test Driven Websites (TDD and BDD in RoR and JS) Testing events on jQuery objects with Jasmine « Perdido is Lost!
HTML fixtures in Jasmine (using jasmine-jquery) « Test Driven Websites (TDD and BDD in RoR and JS) My comparison of JavaScript BDD frameworks resulted in choosing Jasmine to be my JS testing framework of choice. However, I’m doing a lot of jQuery based development, while Jasmine by design tries to stay DOM agnostic. It is not that big problem, as Jasmine is really flexible and open (I’ll show in a moment how to manipulate DOM with jQuery using plain-vanilla Jasmine), but with a couple of tweaks packed into my jasmine-jquery plugin, jQuery users can make their life even easier. First, let’s start with the simplest approach possible to test jQuery code in your Jasmine specs. The most straightforward way is just to create a “fixture” jQuery element inside your spec, invoke your plugin on it and then set your expectations against the fixture element (to verify if the plugin modified fixture element correctly): Of course, for any non trivial plugin you’ll need more than one spec to fully test its behavior, so the above example in reality will look more like this: And that’s all.
Like this: Velesin/jasmine-jquery - GitHub. JavaScript testing with Jasmine. Pragmatic JavaScript Testing with Jasmine. As more and more parts of our applications are written in JavaScript, its important to have them covered with automated tests. Fortunately, there are numerous JavaScript testing tools available. As a BDD fan, the RSpec inspired Jasmine is currently my go-to. The Basics For developers coming from RSpec, Jasmine will feel very familiar. Here’s a simple spec that demonstrates most of the basics: Use #beforeEach for setup, #describe to group related specs and #it for your examples. The last example uses #xit to mark the example as pending. The abundance of anonymous functions in Jasmine specs can seem a bit strange and verbose but if you’ve done a fair share of JavaScript you’ll quickly get used to it. Specifying jQuery With the basics out of the way let’s look at specifying something you’re likely to encounter in every app: jQuery.
Jasmine-jquery gives us HTML fixtures and jQuery specific matchers. Here’s a sample: This spec is for a #change event handler for a <select> element. Specifying Ajax.