Simplify your Protractor tests using Generator functions

Writing protractor tests can be quite difficult, because of all the asynchronous calls you have to deal with. Even promise-chaining does not help when your tests become longer and more complex. With Javascript generator functions it is possible to simplify your tests.


Example:

Let’s say we have a todo-app created in AngularJS with two pages: a page with a list of todos and a page where a user can create a todo-item. We have two page objects created that can communicate with the pages in our Protractor tests. This is an example of an actual testcase with the use of promise chaining:

todo.spec.js - with promises

todo.spec.js - with generators

As you can see, the testcode is much easier to understand when the generator method is used.

How does it work?

The generator method which is defined with the function*(){} syntax can be used together with the jasmine-co library.
jasmine-co wraps all methods and waits for each yield statement to be resolved before continuing to the next yield statement, even if this yield statement is resolved asynchronously.

Setup

1. Install jasmine-co dependency.

2. Install jasmine-co in the protractor.conf.js file.

Example protractor.conf.js

3. Start rewriting your tests incremently. Important: It is not necessary to rewrite all your tests to generators, so you can try it out on one test first.

Source code

Look at the complete source code https://github.com/baconcutter/protractor-generator-example.

One thought on “Simplify your Protractor tests using Generator functions

  1. Pingback: Simplify your Protractor tests using Generator functions - Angular News

Leave a Reply

Your email address will not be published. Required fields are marked *