Introduction to Protractor
It is every tester’s dream to get a test framework that is user friendly and provides a simple syntax for writing tests. Well, this dream can be made real through the Google-managed testing framework called Protractor. Key advantages like high testing speed, easy to locate elements of angular JS with HTML attributes, and many others are provided by Protractor. We will learn more about them in this post.
Nowadays JavaScript is widely used for the development of most applications. Testing becomes more and more difficult as it becomes lengthier. Protractor provides an apt testing framework to manage these issues.
In this post, we will understand in detail what is Protractor and what its key attributes are. We will also look into its limitation and see how it is used in angular JS website applications.
Table of Content:
- What is Protractor?
- Why Protractor is needed on top of Selenium web driver?
- What are the key attributes of Protractor?
- Testing using Protractor
- Wrapping Up
What is Protractor?
‘Protractor’ is an automation tool used for testing various website applications. It is created by the integration of Jasmine, Selenium Webdriver, Node.js, and other such technologies.
Experts cite it as an end to end behavior-driven testing tool. It is outlined for Angular JS applications but it works equally well even with non-angular JS applications. Apart from using it for testing angular and non-angular JS applications, it is also used for regression testing. The beauty of Protractor is that it allows testing of an application in a way as if testing is done by a real user. And all the tests of Protractor are run in a real browser.
Now Protractor is a program of Node.js and it supports the below frameworks that are behavior-driven –
- Jasmine: This test framework appears by default after the installation of Protractor is complete. Jasmine is a development framework used to write test cases for the JavaScript code. It is considered to be an extremely easy framework to write test cases.
- Mocha: This is a JavaScript test framework that needs to be set up with Protractor before use.
And remember Protractor has been designed for apps running on the Angular framework and is structured to act as a wrapper for the WebDriver JS. It works along with Selenium to provide an automated test infrastructure.
Why Protractor is needed on top of Selenium web driver?
Now that we have understood what is Protractor, let us now see why Protractor is needed. Nowadays for development, almost every application uses JavaScript. As JavaScript increases in size, it becomes more and more difficult to test it. And most Angular JS applications use HTML syntax to demonstrate elements or components of website applications.
Now one might think why not use the Selenium web driver for locating these Angular JS web elements. The problem is extended HTML attributes like ng-repeater, ng-controller, ng-model, etc are not incorporated in the locators of Selenium. This is where protractor comes into play. The protractor can locate and control these HTML elements of angular JS applications which Selenium cannot locate. So to summarize, Protractor can operate on top of Selenium and gives an upper hand in handling angular JS applications.
What are the key attributes of Protractor?
Some of the salient features and benefits of Protractor are:
- Installation and set up of Protractor is easy and user friendly.
- The syntax for writing tests is simple to understand and implement in Protractor.
- It supports Jasmine, Mocha, and other developments that are behavior-driven.
- While writing the tests sleeps or waits need not be added.
- It can locate the elements of angular JS applications that have HTML attributes.
- It uses the Selenium grid to run multiple browsers at once.
- It allows the same code to run on laptop browsers as well as mobile browsers without the need to develop separate codes.
- It removes the possibility of facing the synchronization issue generally faced while using angular JS website applications i.e. it provides the advantage of auto-synchronization.
- It supports Chrome, Firefox, Internet Explorer, and many other browsers.
- It provides excellent testing speed.
Every coin has two sides, similarly, Protractor has negatives too. Here are the two key limitations that you will experience in Protractor -
- It is a UI driven testing framework so it only provides front end testing.
- It can be used in JavaScript only so any user has to be sound with the concepts of JavaScript.
Testing using Protractor
Before you begin testing with Protractor, make sure:
You have Node.js installed.
You have Protractor installed and setup is complete in your machine. Use npm to install Protractor -
npm install -g [email protected]A web browser and stable Internet connectivity.
JavaScript Code with the test cases
The tests to be conducted are written in the file Tests.js mentioned below. Here we access a URL and check if the title page is the same as the text we enter. Here are the key components in it -
- Describe & it: The entire end to end flow is written in the describe block. “it” block contains the various test cases. There can be multiple “it” blocks.
- Expect: Used to compare website title with the user-defined text.
- ignoreSynchronization: This tag is used to work with either angular or non-angular websites. In case we have to work with non-angular websites, this tag is set to “False”.
JavaScript code with the configuration
The configuration file mentions the framework and browser to be used to run the test. It links the file to be tested using the “specs” keyword.
Wrapping Up
Now you know how the Protractor testing tool works and what are the benefits that we get while using it. So go ahead and use the features provided by the Protractor for testing angular JS and non-angular JS website applications.