Browser Automation with Selenium WebDriver and Page Objects

30
Browser Automation with Selenium WebDriver and Page Objects Harsh Murari [email protected] Software Architect Rhoynar Software Consulting, Boulder, CO www.rhoynar.com Presented At SQuAD Colorado Meetup at Denver, Feb 09, 2016

Transcript of Browser Automation with Selenium WebDriver and Page Objects

Page 1: Browser Automation with Selenium WebDriver and Page Objects

Browser Automation with Selenium WebDriver and

Page ObjectsHarsh Murari

[email protected]

Software Architect

Rhoynar Software Consulting, Boulder, CO

www.rhoynar.com

Presented At SQuAD Colorado Meetup at Denver, Feb 09, 2016

Page 2: Browser Automation with Selenium WebDriver and Page Objects

About Me

• Co-founder and Software Architect at Rhoynar Software Consulting

• Co-founder and Principal Instructor at DestinationJ Software Technologies

• Working on Build, Infrastructure and Process Improvement Solutions

• 12+ years of Software Engineering Experience

Page 3: Browser Automation with Selenium WebDriver and Page Objects

About This Presentation: Objectives

• Understand Web Automation Testing Landscape

• Overview of Selenium WebDriver

• Moving from Manual Test to Selenium WebDriver

• Common Problems with Test Automation

• Understand Page Object Models Design Pattern

• Test Automation Best Practices

• Page Factories

• Test Auto-Generation

• Demo of Rhoynar’s AutoTestR Solution for Automatic Test Generation

Page 4: Browser Automation with Selenium WebDriver and Page Objects

Automation Testing Problems

• Automation Tests are hard to write – large initial investment

• Automation Tests are broken most of the time – large upkeep costs

• Changes to UI break tests – not sure if tests are broken or UI is broken

• Unsatisfactory Automation Quality – poorly written tests

• Scripts take too long to run

• Scripts can’t run unattended

• Reports are difficult to analyze

• Tests have no documentation

Page 5: Browser Automation with Selenium WebDriver and Page Objects

Manual Test Example – CRM Application

Page 6: Browser Automation with Selenium WebDriver and Page Objects

Manual Test Example – CRM ApplicationRequirements• Add a New Lead

• Import Leads

• View Leads

• View Lead Details

• Contact A Lead

• Contact Multiple Leads

• Update a Lead

• Delete a Lead

Tests• Add a New Lead

• Create a Valid Lead

• Create an Invalid Lead

• Create a Duplicate Lead

• Import Leads

• Valid Import

• Import with Duplicates

• Import with esoteric fields

• Support for different files like .csv, .xls, .xlsx etc.

• …

Page 7: Browser Automation with Selenium WebDriver and Page Objects

Manual Test Example – CRM Application

• Testing once – fine

• Efficient – no upfront investment

• Allows for exploratory testing

• Allows to look at general performance issues

• Testing multiple times – ???

• Testing at every major release?

• Testing at every minor release?

• Testing at every bug-fix?

• Testing at every pre-flight?

4hrs * 8 Modules = 4days

AUTOMATION

Page 8: Browser Automation with Selenium WebDriver and Page Objects

Selenium WebDriver Automation• What does Selenium WebDriver Provide?• Framework for Browser Automation

• Standards Compliant, Open Source, Free-to-use

• All Major Browsers Support

• All Major Operating Systems Support

• All Major Languages Support

• Remote Invocation Support

• Mobile Platforms Support

• Cross-browser compatible scripts

• Object oriented

Page 9: Browser Automation with Selenium WebDriver and Page Objects

Selenium WebDriver: How does it work

• Lead Creation

• Get a handle to the browser/window/tab

• Load the webpage

• Click on Leads Link

• Click on Create Leads

• Fill in the information (Text Boxes, Dropdowns, Check-Boxes etc.)

• Hit Save Button

Page 10: Browser Automation with Selenium WebDriver and Page Objects

Selenium WebDriver: How does it work

Page 11: Browser Automation with Selenium WebDriver and Page Objects

So What’s Wrong with this example

• Procedural/Repetitive

• Hard-Coded, no data providers

• Prone to break:• New fields are added

• Xpath Changes

• Field Name/Property name changes

• CSS properties change

• Not re-entrant

• Most times we are fixing tests to keep up with code…

Need for Abstraction on Top of WebDriver

Page 12: Browser Automation with Selenium WebDriver and Page Objects

Need For Abstraction – Page Objects

Page 13: Browser Automation with Selenium WebDriver and Page Objects

Need For Abstraction – Page Objects• Pages are people too, my

friend!

• Every page has feelings and emotions attributes and actions associated with it

• How these are implemented is abstracted

• What’s exported are the actions this webpage can perform

PAGE OBJECT MODEL

Page 14: Browser Automation with Selenium WebDriver and Page Objects

Need For Abstraction – Page Objects

• Separate Business Logic from Browser Handling

• Each Page has an Object

• Exported methods: Page’s Functionality

• Abstracted methods: Browser, UI, WebElement handling

TestCode

• Test/Business Logic

Page Objects

• Driver/Config/UI Logic

Browser • Browser

Page 15: Browser Automation with Selenium WebDriver and Page Objects

Page Objects - Example

Page 16: Browser Automation with Selenium WebDriver and Page Objects

Page Objects – Few Things to Note

• Notes:

• Annotations: Object is assumed to be initialized through PageFactory.

• @FindBy can support: id, name, tagName, linkText, partialLinkText, css, xpath

• @CacheLookup annotation: Object is assumed to never change in the DOM.

• All buttons/actions are usually translated into functions.

• Functions use data providers to provide configurable, re-entrant data.

Att

ribut

esA

ctio

ns

Page 17: Browser Automation with Selenium WebDriver and Page Objects

Page Object Paradigm

• Expose the service you’re interacting with, not the implementation.- Selenium Wiki

• If you’re using WebDriver API in your test methods… You are doing it wrong.

- Simon Stewart

Page 18: Browser Automation with Selenium WebDriver and Page Objects

Business Logic Driver Logic

Page 19: Browser Automation with Selenium WebDriver and Page Objects

Return value for exported services

public class LoginPage {public void login(){

//Selenium Code}

}

public class AccountsPage {public void viewAccountDetails(){

//Selenium Code}

}

public class LoginPage {public AccountsPage login(){

//Selenium Code}

}

public class AccountsPage {public AccountsDetailsPage viewAccountDetails(){//Selenium Code

}}

Service Methods Returning void

Service Methods Returning correct Object

Page 20: Browser Automation with Selenium WebDriver and Page Objects

Return Value - continued

• Return a generic Page Interface Object Instead

public class LoginPage {public AccountsPage login(){

//Selenium Code}

}

Accounts Page

Login Page

Page 21: Browser Automation with Selenium WebDriver and Page Objects

Timeouts

void testApplication() {loginPage = new LoginPage();accountsPage = loginPage.login();

Thread.sleep(3000);

accountsPage.viewAccounts();}

void testApplication() {loginPage = new LoginPage();accountsPage = loginPage.login();

accountsPage.waitForPage();

accountsPage.viewAccounts();}

Page 22: Browser Automation with Selenium WebDriver and Page Objects

Page Factory public class LoginPage {private WebElement email;private WebElement password;

//Constructorpublic LoginPage(WebDriver driver){

driver.findById(“email”);driver.findById(“password”);

}}

public class LoginPage {@FindBy(id = “email”)private WebElement email;

@FindBy(id = “password”)private WebElement password;

//Constructorpublic LoginPage(WebDriver driver){

PageFactory.initElement(driver, this);}

}

Page 23: Browser Automation with Selenium WebDriver and Page Objects

Where do we stand?

Web App

Page Object Page ObjectData Provider

Page ObjectData ProviderData Provider

Test/Business Logic

Auto Generated!

Page 24: Browser Automation with Selenium WebDriver and Page Objects

Auto Generation of Page Object Code• An advantage of putting structure to the

process gives us a model for auto-generating object test code

• AutoTestR uses node.js framework to parse the DOM for the page and generate corresponding test object code.

Page 25: Browser Automation with Selenium WebDriver and Page Objects

One step further…- Each node represents a page-object

(or rather business object)- Each node specifies what are its

exported interfaces, what are its next states

- Based on this graph, AutoTestR auto-generates test case skeletons as well!

- Example Test Cases:- Login->Unregistered Page- Login->Main Page->CreateUser->End- Login->Main Page->SearchUser->End- Login->Main Page->DeleteUser->End- Login->Main Page->Unregistered Page

Page 26: Browser Automation with Selenium WebDriver and Page Objects

Auto Generated Test Cases: AutoTestR Demo

Page 27: Browser Automation with Selenium WebDriver and Page Objects

CI with AutoTestR

Page 28: Browser Automation with Selenium WebDriver and Page Objects

AutoTestR – Roadmap and Upcoming Features

• Open-source and release a community version by end of the year.

• More graph based intelligent testing, configurable edge weights.

• Integrating with Cloud Based Testing Infrastructure

• Separate Test Assertions from Auto-Generated Code

• Support for business logic testing

• Auto generate TestNG files for regression and performance testing

• Database based test key-value generation

Page 29: Browser Automation with Selenium WebDriver and Page Objects

Summary

• Separate Business Logic from Implementation Logic

• Return the Page Object (generic Page superclass) from exported services

• Page Load Wait time is a property of the page – keep it in the page object!

• Keep common utilities in the base class

• Use Data Providers

• Keep Exported methods Re-entrant

• AutoTestR – To Auto Generate Page Objects and Test Cases

Page 30: Browser Automation with Selenium WebDriver and Page Objects

Contact Us:Rhoynar Software ConsultingWeb: www.rhoynar.comPh.: +1-855-5-RHOYNAREmail: [email protected]

Contact Us:DestinationJ Software TechnologiesWeb: www.destinationj.comPh.: +1-303-408-9848Email: [email protected]

Services:- QA Automation Consulting- Continuous Integration- Web and Mobile Testing- Security Testing- IOT Testing- QA Staffing- Web Development (MEAN stack)- Mobile App Development (iOS/Android)

Courses:- QA Masters (Manual testing, HP ALM/QC,

Selenium IDE, SQL) - QA Advanced (Java, SQL, Selenium WebDriver,

POM, BDD, Cucumber)- Full-Stack Web Development using NodeJS,

AngularJS, ExpressJS and MongoDB- Corporate training (various topics) (1-5 days)