Hey Folks 😀 , 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 😀 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 😀 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.

 npm install -g protractor 

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

 protractor --version 

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.

 java -version 

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.

webdriver-manager update

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.

webdriver-manager start

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.. 😀

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 😉

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s