This document provides an overview of end-to-end testing with Protractor. It defines end-to-end testing as testing whether the flow of an application performs as designed from start to finish. The document then discusses Protractor, an end-to-end test framework for AngularJS, how it works by using WebDriverJS and Selenium, and its advantages like automatic waiting and support for page objects. Finally, the document provides instructions on installing Protractor and a demo of running tests.

1. HABILELABS PVT. LTD.
YOUR INTEREST OUR INTELLIGENCE
VIKASH GUPTA
Developer

2. Protractor
An end-to-end test framework
Let`s start!

3. ET
P
1
2
3
4
What is Testing?
Basics of Testing with some example.
What is End-to-End Testing?
About Protractor
Quick story behind development of Protractor
How Protractor works?
Behind the scenes..

4. 5
6
7
Installation and Configuration
How to get up and running with Protractor
Live Demo on Protractor Testing
A Quick Demo
Why Protractor?
This will make you feel better
End of presentation with a Question?
Thank you for your attention

5. Testing
What is Testing ?

6. What is TestingLet’s clear some basics about testing.
1. Unit Testing
“Verification of Product before take on to online network..”
“Validate the separate units of source code remains working or not
“Integrate/combine the unit tested module one by one and test behavior”
2. Integration Testing

7. End-to-End Testing
What is e2e Testing ?

8. What is End-to-End TestingLet’s talk about End-to-End..
• The purpose of carrying out end-to-end tests is to identify
system dependencies and to ensure that the right information
is passed between various system components and systems.
“test whether the flow of an application is performing as designed from
start to finish. ..”

9. Step 3 Expect some Output For Success
Check for some element, presence of those element
means your test got succeed or failed.
Step 2Provide Input to the page
It includes the operations like provide input for TextBox,
clicking on buttons or checkboxes etc.
Expect some page for Input
How End-to-End Test WorksWork Flow of End-to-End Tests.
IDEA
Step 1

10. About Protractor
A end-2-end testing tool

11. What is ProtractorLet’s talk about Protractor..
• Protractor is an end-to-end test framework
for AngularJS applications.
• It use Jasmine framework for it’s syntax.
• Developed by Julie Ralph in 2013, (same team as Angular) at
Google.
• Protractor is built on top of WebDriverJS.
• WebDriverJS provide the browser-specific native
event libraries.
• In process, Selenium server work as Interpreter.

12. S
Synchronization issue.
As you know, Almost web application uses javascript as its
primary component and Javascript is asynchronus in nature.
In Complex UI applications, It become hard to find element by
css and id. So at the end, use xpath
ElementFinder issues
How Protractor came into Picture
IDEA
So Protractor uses angular models, binding, expressions as
element finder, that makes End-to-End testing more
promising.
Angular have got power of directives
S
Protractor use promises to maintain control flow
For Angular apps, Protractor will wait until the Angular Zone
stabilizes. This means Protractor waits until there are no pending
asynchronous tasks in your Angular application. This means that all
timeouts and http requests are finished.

13. Installation
Let’s install Protractor

14. N J P W
1. Node js
Install windows executable file
2. JDK
From Java Website
3. Protractor
npm install –g protractor
4. WebDriver Manager
Webdriver-manager update
Protractor InstallationLet’s install protractor
• Protractor is a Node.js program. To run, you will need to have
Node.js installed.
• Protractor use Selenium to control browser automatically, this
needs Java.

15. Live Demo
Let’s see It live

16. Live Demo on ProtractorLet’s play around Protractor..
• For Demo purpose of Testing, clone the angular project
https://github.com/juliemr/protractor-demo.

17. Why Protractor
Let’s know Reasons

18. For Angular Apps
Protractor supports Angular-specific locator strategies,
which allows you to test Angular-specific elements
without any setup effort on your part.
Automatic Waiting
You no longer need to add waits and sleeps to your
test. Protractor can automatically execute the next
step in your test the moment the webpage finishes
pending tasks
Page Object
Easy to set up page objects. Protractor does not
perform WebDriver commands till an action is needed
Support for Selenium Server
Protractor provide support for chrome and firefox
browser with webdriver-manager. That makes test
fast.
Concept of Custom locator.
You can make element-locator specific to your language.
Why ProtractorReasons to use protractor
IDEA

19. Contact Us
Address: 4th Floor, IGM School Campus, Jaipur
Website: www.habilelabs.io
Contact no: +91-9828247415
mail id: info@habilelabs.io