Protractor - Automation Testing Tool
Parameshwar Ramanan (252624)
‹#›
Agenda
What is Protractor
Why Protractor
Selenium-Java vs Protractor - JS
Prerequisites & Protractor installation
Javascript Concepts (relative to protractor)
Element Locator Strategy
Jasmine Framework
Configuration File
Specification File
Demo
2 TCS Internal
What is Protractor
Developed by Google and released to Opensource
E2E Automation Testing Tool
Specialized for AngularJS based Web Applications
Javascript package in npm, Package Manager for NodeJs Run Time Environment
Runs on Selenium WebdriverJs
Uses Jasmine framework as default
3 TCS Internal
Why Protractor?
Webpages are transitioning from traditional multipage approach to Angular based Single Page
Applications
Provides Angular Specific Locator Strategies
PageObject Model Implementation
Faster Execution by reducing explicit waits
Uses same language as the application development language
Uses Test Framework which is most commonly used for AngularJs Unit Tests
4 TCS Internal
Selenium-Java vs Protractor-JS
Selenium Java Protractor JS
• Uses Webdriver • Uses WebDriverJS
• Synchronous Execution • Asynchronous Execution
• Ease to use control flow • Need to understand control flow
• Primarily for Non-Angular Web pages • Primarily for Angular Web pages
• Depends on non angular locator • Angular Exclusive Locator Strategies
strategies for Angular Pages for Angular Apps and can support Non
Angular Pages with traditional element
• Numerous Framework locators
Implementations
• Limited Framework Implementations
• Easier Learning Curve with online
support • Comparatively steeper Learning Curve
5 TCS Internal
Prerequisites
Nodejs
– Run node --version in cmd prompt to verify installation
– Add node path to Environment variables
Java
– Run java -version in cmd prompt to verify installation
– Add jdk bin path to Environment variables path and jdk JAVA_HOME variable
6 TCS Internal
Protractor Installation
Ensure npm is installed once nodejs installation is complete
– Run npm –version in command prompt
If you are behind a proxy server, Setup proxy:
– use "username:password" if your password contains @ character
– npm config set proxy http://username:password@proxyurl:portnumber
– npm config set https-proxy http://username:password@proxyurl:portnumber
– npm config set http-proxy http://username:password@proxyurl:portnumber
– npm set registry https://registry.npmjs.org/
Protractor Global Installation
– npm install –g protractor in cmd prompt (Use npm install –g protractor@<<version>> to install any particular version)
– Installs the protractor package in node_modules folder in C:\Users\<<Username>>\AppData\Roaming\npm folder
Protractor local Installation
– Navigate to directory via cmd prompt where protractor installation is needed
– npm install protractor in cmd prompt (Can use the same variant as above for installing specific version)
Installing Webdrivers for browsers
– If behind a proxy, run webdriver-manager --proxy http://username:password@proxyurl:portnumber update
– If not, webdriver-manager update
– Installs selenium standalone driver, chromedriver & geckodriver for firefox
– webdriver-manager --proxy http://username:password@proxyurl:portnumber update –ie for installing internet explorer driver
– webdriver-manager update --ie if not behind a proxy
Note: Any installation issues due to proxy, reach out to IDM to get the tools & drivers installed via CR
7 TCS Internal
Screenshots
8 TCS Internal
Javascript Concepts (relative to Protractor)
Variable declarations
– var is the generic datatype
– Eg: var text, var number
Conditional Statements
– If-else, If-else If
Loops
– Prefer forEach over traditional for loop
Methods
– Write and invoke functions
File Read/Write
– Utilize the fs npm package
Promise
– Handling promises to control execution flow
9 TCS Internal
Element Locator Strategy
by object for locators
– Eg: by.id, by.name, by.model, by.css, by.binding
element function to invoke the webelement
– Eg: element(by.id(“idvalue”))
To get multiple elements – element.all
– Eg: to get all buttons in the page – element.all(by.tagName(“button”))
Can chain multiple element calls to reach a particular web element
– Eg: element(by.tagName(“button”)).element(by.tagName(“span”))
Reference:
http://www.protractortest.org/#/api
10 TCS Internal
Jasmine Framework
Behavior driven framework for Javascript
Test Suites & Test Cases are considered as functions
Test cases are called as specs
Test Suites defined by describe function
Specs are defined by it function
Assertions are done via expect statement with checks like toEqual, not.toEqual, toContain, toBeLessThan
beforeLaunch & afterLaunch functions to run a block of code before/after the execution
beforeEach & afterEach functions to run a block of code before/after every test spec
Reference: https://jasmine.github.io/2.0/introduction.html (for Jasmine 2) [Latest stable release Jasmine 3.4]
11 TCS Internal
Configuration file
If set to true, it runs on any port.
If commented, need to run
webdriver-manager start command
to start the selenium server
Browser capabilities
Framework Details
Address where the selenium
server runs
Test Suite to execute
Timeout value for each of the spec
12 TCS Internal
Specification file (Test Suite)
Test Suite
Test Spec 1
Test Spec 2
Test Spec 3
Test Spec 4
13 TCS Internal
Sample Automation Demo
‹#›
Thank You