Book Image

Using Node.js for UI Testing

By : Pedro Teixeira
Book Image

Using Node.js for UI Testing

By: Pedro Teixeira

Overview of this book

<p>Automating tests for your user interfaces has always been the holy grail of programming. Now, using Zombie.js and Mocha you can create and quickly run your tests, allowing you to test even small changes. Increase your confidence in the code and minimize the number of times you have to use a real browser while you develop.</p> <p>"Using Node.js for UI Testing" is a quick and thorough guide on how to automatically test your web app, keeping it rock solid and bug-free. You will learn how to simulate complex user behaviour and verify that your application behaves correctly.</p> <p>You will create a web app in Node.js that uses complex user interactions and AJAX; by the end you will be able to fully test it from the command-line. Then you will start creating the user interface tests for this application using Mocha as a framework and Zombie.js as a headless browser.</p> <p>You will also create a complete test suite, module by module, testing simple and complex user interactions.</p>
Table of Contents (15 chapters)

Implementing drag-and-drop


Let's add some tests to the test/todos.js file.

  1. We start off by adding a new describe scope before the end of the Todo list scope:

    describe('When there are some items on the list', function() {

    This new scope allows us to setup a to-do item fixture list in the database before any test inside this scope is run.

  2. Now, let's add this new beforeEach hook inside the new scope:

    beforeEach(function(done) {
      // insert todo items
      db.insert(fixtures.todos, fixtures.user.email, done);
    });
  3. Then we start the test by logging in:

    it('should allow me to reorder items using drag and drop',
      login(function(browser, done) {
  4. We start the test by making sure that we have three to-do items in our item list page:

    var items = browser.queryAll('#todo-list tr');
    assert.equal(items.length, 3, 'Should have 3 items and has ' +
      items.length);
  5. Then we declare a helper function that will assist us in verifying the contents of that list:

    function expectOrder(order) {
      var itemTexts = browser.queryAll...