A TEST FRAMEWORK USING PROTRACTOR, CUCUMBER & CUCUMBER SANDWICH

Adonis Celestine

Panacea

Adonis Celestine

Adonis has more than 10 years of industry experience in Software Testing. He has good expertise on Software Test automation and consultation.Adonis is passionate about test innovations and making testing simpler and more interesting. He has implemented this framework for multiple projects on a large scale and in this presentation he shares the experience, best practices and challenges in using this framework.

ABOUT THE SPEAKER

0617468887email : adonis.sheeban@gmail.com Adonis Celestine

THE TOOLS

CUCUMBERCucumber is a leading BDD tool which lets software development teams describe how software should behave in a business readable domain specific language.

PROTRACTORProtractor is an E2E test tool developed by google to test Angular applications.

CUCUMBER SANDWICHCucumber Sandwich generates awesome html reports on the fly. It monitors your Cucumber json report directory for changes & generates the report.

Technology changes & responsive design

WHY NEW FRAMEWORK

Gaps in the current process

Something light and free

What are you testing

Test Reporting

A programmers mind

Travel(“market”);If(isPresent(“egg”)){ buyMilk(6);} else { buyMilk(1);}

More Collaboration

BEHAVIOUR DRIVEN DEVELOPMENT

Automated Acceptance Tests

WHEN– an event occursBDD

GIVEN– Some preconditions

THEN– you see an

outcome

Faster & High Quality

CUCUMBER & GHERKIN

Feature: Search on internet@Regression @SmokeScenario Outline:Search keywords protractor & cucumber

Given I open the search <engine> When I type <keyword> And I click search Then I see the search results

Examples:

|engine|keyword| |google|protractor| |google|angularjs| |bing|protractor|

BDD IS TDD done right It’s the language the business understands

Feature: Descriptive text of what is desired

Scenario Outline: Some determinable business situation

Given some precondition And some other precondition When some action by the actor And some other action Then some testable outcome is achieved And something else we can check happens too

Examples:Test Data

ng-binding, ng-repeat, ng-textarea, ng-model , WaitForAngular

PROTRACTOR

Multi browser capabilitiesAngular locators E2E Test the whole chain

System Under Test

Browser Driver

The glue code

Test ReportingBDD

The Feature file

Feature: Check the weather @chainScenario Outline:Check the weather of Amsterdam Given I open weather.com When I type Amsterdam in the search box And I click search Then I must be able to see the weather <overview>

Examples:

|overview| |Today| |5 Day| |10 Day| |Weekend| |Monthly|

PROTRACTOR IN AN ANGULAR PAGE

Demo

The Spec file

this.When(/^I type Amsterdam in the search box$/, function (callback) { browser.element(by.xpath(“(//input[@name=‘search’])”).sendKeys(“Amsterdam”).then(callback);});

The Config file

exports.config = { specs: ['test/SystemTest/features/*.feature' ],

framework: 'cucumber',

cucumberOpts: {

require: ['features/step_definitions/*_steps.js', 'features/support/*.js'], format: 'pretty' }, capabilities: { browserName: 'firefox‘ }};

PROTRACTOR IN A NON ANGULAR PAGE

Demo

PROTRACTOR ON MOBILE

capabilities: { browserName: 'chrome', 'appium-version': '1.0', platformName: 'Android', platformVersion: '4.4.2‘, deviceName: 'Android Emulator', }

The Config file

Appium

Selendroid

Mobile browsers

Doesn’t support native apps

Install Appium

Configure Protractor

Install android SDK

CUCUMBER SANDWICH

Demo

CHALLENGES

THE BEST PRACTICES & TIPS

THANK YOU!FOR YOUR ATTENTION

https://angular.github.io/protractor/https://cucumber.io/https://www.linkedin.com/profile/view?id=AAMAAAbro_EBdKrNNLuUAOzF3KxGRpDkWydxpuE&trk=hp-identity-namehttp://testautomation.applitools.com/post/94994807787/protractor-vs-selenium-which-is-easier

REFERENCES