Protractor is an end-to-end frontend test framework for Angular and AngularJS applications. Protractor runs tests against your application running in a real browser, interacting with it as a user would.

Protractor is built on top of WebDriverJS, which uses native events and browser-specific drivers to interact with your application as a user would. It supports Angular-specific locator strategies, which allows you to test Angular-specific elements without any setup effort on your part.

Prerequisites:

Protractor is a Node.js program. To run, you will need to have Node.js installed. You will download Protractor package using npm, which comes with Node.js. Check the version of Node.js you have by running node –version. Then, check the compatibility notes in the Protractor README to make sure your version of Node.js is compatible with Protractor.

By default, Protractor uses the Jasmine test framework for its testing interface. This tutorial assumes some familiarity with Jasmine, and we will use version 2.4.

This tutorial will set up a test using a local standalone Selenium Server to control browsers. You will need to have the Java Development Kit (JDK)installed to run the standalone Selenium Server. Check this by running java -version from the command line.

Protractor Installation Steps:

We assume you already have nodejs & npm installed on your local system, if not you then you can install nodejs as follows:

# install curl if not installed
$ sudo apt install curl

# install node 10.x repository to the system
$ curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -

# download & install nodejs 10.x along with npm
$ sudo apt install nodejs

Install protractor globally on the local machine

$ sudo npm install -g protractor

Webdriver is a helper tool to easily get an instance of a Selenium server running

$ sudo webdriver-manager-update

Required to install jdk only when jdk is not installed in local machine

$ sudo apt install default-jdk

How to run Protractor scripts:

Start the Selenium server and leave the server running while conducting the test sessions

$ sudo webdriver-manager start

Run the test

$ protractor conf.js

Sample Protractor Script:

Filename of the automated script: facebook_login.js

describe('Login to Facebook', function() {
    browser.driver.manage().window().maximize();
    // ---- Login to Facebook ---- //
    it('login successful', function() {
        browser.waitForAngularEnabled(false);
        browser.get('https://www.facebook.com/');
        element(by.name('email')).sendKeys('test@example.com');
        element(by.name('pass')).sendKeys('testpass');
        element(by.css('[type="submit"]')).click();
    });
});

Configuration file: conf.js

exports.config = {
  seleniumAddress: 'http://localhost:4444/wd/hub',
  specs: ['facebook_login.js']
};

Use of conf.js (configuration file):

conf.js (configuration file) is the file where it is defined to Protractor where the test files (specs) are, and to find the Selenium server. Using this file, it will run the tests and generate the reports of the failed and passed tests. In the config file, set selenium address to the address of the running server. This defaults to http://localhost:4444/wd/hub

Note: Google Chrome is the default browser for running the Protractor tests when the conf.js is executed