Overview
Transition.js is an in-browser testing framework designed to make testing asynchronous web applications easier.
I had the following goals when I created Transition.js:
- To run on mobile devices (iPhone, Android Phones) with minimal manual intervention
- Make testing asynchronous web applications easier
- To run headless execution of the test suite to support CI
A First Example
Transition.js comes with an example application, Engineyard’s Todo App in Sinatra. There is a small test suite which tests the Todo application.
This test adds a Todo List and asserts that it is visible:
/*jslint browser: true, maxerr: 50, indent: 2, nomen: false, regexp: false, newcap:false */
/*global window, jQuery, _, Backbone, console, Transition */
"use strict";
(function () {
this.addTest({
name: 'Add a List',
states: [
this.newState('init', this.navigateTo_('/'))
.to('deleteTestList').when('li a:contains("Test")')
.to('mainPage') .when('!li a:contains("Test")'),
this.newState('deleteTestList', 'deleteTestList')
.to('deleteTestList').when('li a:contains("Test")')
.to('mainPage') .when('!li a:contains("Test")'),
this.newState('mainPage', this.navigateTo_('/'))
.to('createList') .when('input[name="list[name]"]:visible'),
this.newState('createList', 'createTestList')
.to('success') .when('li a:contains("Test")')
],
deleteTestList: function () {
var old = parent.frames.main.confirm;
parent.frames.main.confirm = function () {
return true;
};
parent.frames.main.$('a[data-method=delete]').click();
parent.frames.main.confirm = old;
},
createTestList: function () {
this.find('input[name="list[name]"]').val('Test');
this.find('input[type=submit]:visible').click();
}
});
}.call(Transition));
Ready to get started?
Begin with the installation instructions then browse the Documentation.