Getting started with the protractor

As an automation QA Engineer, I always try to work on areas where I can work with pace and efficiency, technology doesn’t matter. As the world is moving towards scripting language We as a QA also work together.

I am talking about the AngularJS, ReactJS applications which are highly acceptable and readily used in today’s world be it a Banking app or a CRM based. One can connect to all the application with frontend as a JS app and backend can be anything C# , Java ,etc. Here the role of QA is to identify the best fit he/she can apply to quickly automate all the cases in a highly compatible language which supports the Frontend application.

Here, I am talking about protractor. For one of my applications which is written in Aurelia (FE tool to create an application similar to AngularJS) we decided to work upon protractor, let’s talk about it in this blog how we managed to do it.

When it comes to testing applications, there are two main types of tests one wants to cover: Unit and E2E . End to end usually refers to the QA testing and unit mainly for the developers to take ownership of.

I will be focussing on the e2e in this post at a glance.

Protractor?

End-to-end testing framework for web applications and built on top of WebDriverJS.
Uses Jasmine framework for its syntax as default framework. Node.js .

Protractor , a wrapper on top of Selenium Webdriver can help us a lot. what is protractor?

Why to use protractor?

Support for Angular based Apps
Automatic Waiting
Page Object Model Support
Support for Selenium Server without it
The concept of the Custom locator

Who uses protractor?

The whole Scrum team.

Setting up Protractor

nodeJs to run protractor commands.
JDK – protractor needs Selenium to control browser automatically, which needs Java Protractor
Webdriver Manager

But, how to execute?

– `npm run e2e` – run tests via plain Protractor `node_modules/.bin/protractor conf.js` – run tests `npm test` (runs via flake, which re-runs failed tests) important commands

Adding dependency via package.json

name": "e2e",
"version": "0.0.1",
"scripts": {
"test": "protractor protractorConf.js --params.login.url=https://localhost:8080",
"webdriver:update": "webdriver-manager update",
"webdriver:start": "webdriver-manager start",
"watch": "npm-watch"
},
"devDependencies": {
"@types/chai": "^4.1.7",
"@types/chai-as-promised": "^7.1.0",
"@types/jasminewd2": "^2.0.6",
"@types/node": "^8.0.10",
"jasmine": "^3.4.0",
"jasmine-allure-reporter": "^1.0.2",
"jasmine-core": "2.5.2",
"jasmine-data-provider": "2.2.0",
"jasmine-expect": "^3.8.4",
"jasmine-spec-reporter": "^2.5.0",
"jasminewd2": "^2.2.0",
"protractor": "^5.4.1",
"protractor-beautiful-reporter": "^1.2.7",
"protractor-testability-plugin": "^1.2.0",
"selenium-webdriver": "3.0.1",
"ts-node": "^2.0.0",
"typescript": "^2.3.4",
"webdriver-manager": "^12.1.1",
},

Maintaining test data

export class siteUrls {
testurl = "https://test.com";
}

export class userInfo{

static product_oversight_requirement = [
                        "BCP/DR Review",
                        "Contract Review",
                        "Cyber Security Review",
                    ];
static dropDownSelectYear = [
                        "2018",
                        "2019",
                        "2020",
                        "2021",
                        "2022",
                        "2023",
                        "2024",
                        "2025",
                        "2026",
                        "2027",
                        "2028"
                    ];
}

Managing configuration

exports.config = {
params: {
login: {
url: 'localhost:8080',
}
},
specs: ["./e2e/com.poc.specs/dashboard/User.ts"],
beforeLaunch: () => {
require("ts-node").register({
project: "e2e"
});
},
};

#jasmine #Selenium #angularJS #protractor #npm #e2e