introduction to protractor - habilelabs

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

Upload: habilelabs

Post on 24-Jan-2018

50 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: Introduction to Protractor - Habilelabs

HABILELABS PVT. LTD.YOUR INTEREST OUR INTELLIGENCE

VIKASH GUPTADeveloper

Page 2: Introduction to Protractor - Habilelabs

ProtractorAn end-to-end test framework

Let`s start!

Page 3: Introduction to Protractor - Habilelabs

ET

P

1

2

3

4

What is Testing?Basics of Testing with some example.

What is End-to-End Testing?

About ProtractorQuick story behind development of Protractor

How Protractor works?Behind the scenes..

Page 4: Introduction to Protractor - Habilelabs

5

6

7

Installation and Configuration How to get up and running with Protractor

Live Demo on Protractor TestingA Quick Demo

Why Protractor?This will make you feel better

End of presentation with a Question?Thank you for your attention

Page 5: Introduction to Protractor - Habilelabs

TestingWhat is Testing ?

Page 6: Introduction to Protractor - Habilelabs

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

Page 7: Introduction to Protractor - Habilelabs

End-to-End TestingWhat is e2e Testing ?

Page 8: Introduction to Protractor - Habilelabs

What is End-to-End TestingLet’s talk about End-to-End..

• The purpose of carrying out end-to-end tests is to identifysystem dependencies and to ensure that the right informationis passed between various system components and systems.

“test whether the flow of an application is performing as designed from start to finish. ..”

Page 9: Introduction to Protractor - Habilelabs

Step 3 Expect some Output For Success

Check for some element, presence of those elementmeans 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

Page 10: Introduction to Protractor - Habilelabs

About ProtractorA end-2-end testing tool

Page 11: Introduction to Protractor - Habilelabs

What is ProtractorLet’s talk about Protractor..

• Protractor is an end-to-end test frameworkfor AngularJS applications.

• It use Jasmine framework for it’s syntax.

• Developed by Julie Ralph in 2013, (same team as Angular) atGoogle.

• Protractor is built on top of WebDriverJS.

• WebDriverJS provide the browser-specific nativeevent libraries.

• In process, Selenium server work as Interpreter.

Page 12: Introduction to Protractor - Habilelabs

SSynchronization 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.

Page 13: Introduction to Protractor - Habilelabs

InstallationLet’s install Protractor

Page 14: Introduction to Protractor - Habilelabs

N J P W

1. Node jsInstall windows executable file

2. JDKFrom Java Website

3. Protractornpm install –g protractor

4. WebDriver ManagerWebdriver-manager update

Protractor InstallationLet’s install protractor

• Protractor is a Node.js program. To run, you will need to haveNode.js installed.

• Protractor use Selenium to control browser automatically, thisneeds Java.

Page 15: Introduction to Protractor - Habilelabs

Live DemoLet’s see It live

Page 16: Introduction to Protractor - Habilelabs

Live Demo on ProtractorLet’s play around Protractor..

• For Demo purpose of Testing, clone the angular project

https://github.com/juliemr/protractor-demo.

Page 17: Introduction to Protractor - Habilelabs

Why ProtractorLet’s know Reasons

Page 18: Introduction to Protractor - Habilelabs

For Angular AppsProtractor supports Angular-specific locator strategies, which allows you to test Angular-specific elements without any setup effort on your part.

Automatic WaitingYou 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 ObjectEasy to set up page objects. Protractor does not perform WebDriver commands till an action is needed

Support for Selenium ServerProtractor provide support for chrome and firefoxbrowser 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

Page 19: Introduction to Protractor - Habilelabs

Contact Us

Address: 4th Floor, IGM School Campus, Jaipur

Website: www.habilelabs.io

Contact no: +91-9828247415

mail id: [email protected]