How to Run Your First Test Using Protractor?

What is Protractor?

• Protractor is an end-to-end testing framework for AngularJS applications.
• It combines various tools and technologies such as NodeJS, Selenium WebDriver, Jasmine, Cucumber, and Mocha.
• We can test Angular-specific elements without any setup effort on our part as Protractor supports Angular-specific locator strategies.
• It avoids the need for a lot of sleeps and waits in our tests, as it optimizes sleep and wait times. Hence, speeds up the testing.
• Tests are organized based on Jasmine.
• Tests can be run on both real and headless browsers.

Installation

• Install NodeJS from http://nodejs.org

• Check NodeJS installation

• Check npm installation

• Install npm globally using the command: npm install –g express

• Install protractor globally using the command npm install –g protractor. This will install two command line tools,protractor and webdriver-manager

• Check Protractor version

• webdriver-manager will get an instance of a Selenium Server running. Download the necessary binaries with command webdriver-manager update.

Starting Selenium Server

• Run selenium server using the command webdriver-manager start

As seen in the above image, this will start up a Selenium Server and will output a bunch of info logs. The Protractor test will send requests to this server to control a local browser. Information about the status of the server can be seen at http://localhost:4444/wd/hub.

Writing Your Test

Create a new folder for testing. For e.g. I created a new folder named “testprotractorframework”. Now we need to add two files: a spec file and oneconfiguration file. Let’s name the two files as test_spec.js and test_conf.js respectively.

Write the following code in the test_spec.js file:

The describe and it syntax is from the Jasmine framework (behavior-driven development framework for testing JavaScript code). browser is a global function created by Protractor.

Now we will create the configuration file. For this, add the following code in test_conf.js file:

Now run the test with following command “protractor conf.js” as shown below:

Once the test is complete, you will see the following output:

If we want to test against multiple browsers, then we have to use the multiCapabilitiesconfiguration option. If multiCapabilities is defined, the runner will ignore the capabilities configuration. Let’s test this by updating test_conf.js file as shown below:

Now run the test again with command “protractor conf.js”. It will show the output as below: