Installing Protractor for End-to-End testing of Angular.js Apps

Hey Folks :D , I’m back to writing blog posts after a long time. And to end a dry spell I’m here with a flurry of posts, the first of many for Angular.js will be this post on Installing Protractor for angular.js application testing. Let’s quickly dive in to the tech stuff shall we?

So, what is Protractor? Protractor is an end-to-end test framework for testing Angular.js applications. You can use protractor to run end-to-end tests on your application running in a real browser and interact with your application as the same way a particular user would interact with it.

So now you may be asking, Dude, what is End-to-End testing?

End-to-end testing is a technique used to test whether the flow of an application right from start to finish is behaving as expected

When you Google for end-to-end testing, that is exactly what is says :D But, basically what it is, in my words is playing out a particular scenario that your end user will encounter when he/she interacts with your application. More details description on what end-to-end testing is and why it is important can be found in another post on End-to-End Testing which i will link to this post.

So, to use Protractor to run end-to-end tests on your angular.js application you need to have few things installed and running in your computer. First of course Protractor itself :D Obviously… You also need webdriver-manager which is a tool for running a Standalone Selenium Server in your development setup. But before you install both of these you need to have Node.js installed in your computer. Also protractor is a Node.js program so to run protractor you will need Node.js. So if you do not have Node.js installed, download node from the Node.js website and install it. For windows its easily bundled in to an installer. We need to use Node Package Manager (NPM) to install the dependencies so when you are done installing Node.js open up a command window and type in npm and hit enter to make sure that npm is added to the system path. It will show a list of usage commands. So if npm is working. Let’s move to the next step. :)

Installing Protractor

Open up a command line and type in the following command to install Protractor using npm.

[code language=”javascript”] npm install -g protractor [/code]

This will install protractor globally in your computer. Then in the command line type in,

[code language=”javascript”] protractor — version [/code]

this will display the protractor version currently installed and verify that protractor is working. The next step is to Install Selenium Server that acts as a proxy when we run out Protractor tests

Install Standalone Selenium Server

To run Selenium Server locally you need to have Java Development Kit (JDK) installed. If you don’t have it installed follow the link and install it now. If you need to check whether your computer have JDK installed, open up a command line and type in the following command.

[code language=”javascript”] java -version [/code]

This will display the java version that is installed and confirm that java is installed. Then in a command line type in the following command.

[code language=”javascript”]
webdriver-manager update
[/code]

This command will install the selenium server and the ChromeDriver so we can use chrome browser to run out tests. After the installation is complete run the following command to make sure everything starts.

[code language=”javascript”]
webdriver-manager start
[/code]

This will start the standalone server and you will see a bunch of log strings outputted to the command line. You need to run this command every time you start running tests and keep the command window open. You have the option to do this automatically when running the tests by modifying the test config file. But let’s talk about it on a later day.

So that’s it boys and girls, you are ready to do end-to-end testing on your Angular.js app using protractor. Congratulations. Let the testing commence.. :D

So folks, this will be the first of many posts on Protractor testing. I will make a series of posts related to this topic whenever I have time so keep a look out for that. So for now, Adios amigos ;)