menu

Testing AngularJS apps with Protractor

If you are developing an AngularJS application, use Protractor to test it! Why?

  • Protractor is an end-to-end testing framework for AngularJS applications and works as a solution integrator - combining powerful tools and technologies such as NodeJS, Selenium, webDriver, Jasmine, Cucumber and Mocha.

  • It has a bunch of customizations from Selenium to easily create tests for AngularJS applications.

  • Protractor also speeds up your testing as it avoids the need for a lot of “sleeps” and “waits” in your tests, as it optimizes sleep and wait times.

  • As it is based on AngularJS concepts, that makes it easy to learn Protractor if you already know about AngularJS and vice versa.

  • Protractor allows tests to be organized based on Jasmine, thus allowing you to write both unit and functional tests on Jasmine.

  • It runs on real browsers and headless browsers.

What else you need from a framework to automate tests?

Deep-diving into Protractor

The first version of Protractor was released in July, 2013, when the framework was basically a prototype of a testing framework. However, Google, with the support of the testing community, is evolving the framework to follow the evolution of AngularJS and to meet the needs of the community that is using AngularJS.

The Protractor project is public in Github and you can follow the issues in the project, add issues you think are interesting, comment on issues opened by others, do a pull request to help the project, etc. Anyone interested in supporting the growth of the project is welcome!

Protractor is a framework for automation of functional tests, so its intention isn't to be the only way to test an AngularJS application, but to cover the acceptance criteria required by the user. Even if there are tests that run in the UI level with Protractor, unit and integration tests are still needed. It runs on top of the Selenium, and thus provides all the benefits and advantages from Selenium. In addition, it provides customizable features to test AngularJS applications. It is also possible to use some drivers which implement WebDriver's wire protocol like ChromeDriver and GhostDriver, as Protractor runs on top of the Selenium. In the case of ChromeDriver it is possible to run tests without the Selenium Server. However to run tests using GhostDriver you need to use PhantomJS which uses GhostDriver to run tests in Headless mode.

The framework integrated with Jasmine can be used to create and organize tests and user expectations. Jasmine is compatible with Protractor due to which all resources that are extracted from browsers can be used to make tests as promises. Those promises are resolved internally by using the “expect” command from Jasmine. That way the promises work smoothly while creating tests.

Protractor’s documentation in the past years has been poor and risked getting obsolete quickly due Protractor's constant evolution. However, in the recent months the community has collaborated a lot and Protractor's documentation has been updated. This has happened because it is easy to send questions and collaborate through the public project on Github. There is only one caveat and that is sign a digital contract as Google's collaborator.

How do you test your AngularjS applications? What has your experience been with Protractor?