SlideShare a Scribd company logo
1 of 49
Improving Your Selenium
WebDriver Tests
Roy de Kleijn
Technical Test Consultant
Email: roy.dekleijn@the-future-group.com
Twitter: @TheWebTester
Website: http://www.rdekleijn.nl
Github: https://github.com/roydekleijn
© 2016 The Future Group - http://bit.ly/2eDaWio
Question #1
What makes your Selenium WebDriver tests suck?
© 2016 The Future Group - http://bit.ly/2eDaWio
Answer #1
Depending on third-party data
Synchronization issues
Cross-browser issues
Hard to locate elements
testdata
Slow feedback cycle
Flaky tests
High maintenance costs
© 2016 The Future Group - http://bit.ly/2eDaWio
Lack of confidence
Results in …
© 2016 The Future Group - http://bit.ly/2eDaWio
Contents
19:00 - 20:00 Part 1
• Introduction
• Element locator tips & tricks
• Speed-up and stabilize your tests (demo)
• Implementing the Page Object Model
• Utilize Data Objects
• Handle synchronization
20:00 - 20:15 Coffee
20:15 - 21:15 Part 2
• Handle synchronization
• Play with objects
• What we have learned
We will start with an actual Page Object Model implementation today
© 2016 The Future Group - http://bit.ly/2eDaWio
Maintenance test
Maintenanceeffort
Time
Reality: code ends up into unmaintainable spaghetti
wish
© 2016 The Future Group - http://bit.ly/2eDaWio
Testing Pyramid
unit
UI
API
feedback-cycle
- Extremely fast
- Smallest units of the application / isolates failure
- Executed during build time
- No dependency on data
- Extremely slow
- Requires running application
- Will change frequently
- Dependency on data
- Fast
- Covering boundary conditions
- Start early in SD process
- Requires running application
- (some) dependency on data
© 2016 The Future Group - http://bit.ly/2eDaWio
Mock External Interfaces
application
Interface 1
Interface 2
Interface 3
application
Interface 1
Interface 2
Interface 3
mock
© 2016 The Future Group - http://bit.ly/2eDaWio
Contents
19:00 - 20:00 Part 1
• Introduction
• Element locator tips & tricks
• Speed-up and stabilize your tests (demo)
• Implementing the Page Object Model
• Utilize Data Objects
20:00 - 20:15 Coffee
20:15 - 21:15 Part 2
• Handle synchronization
• Play with objects
• What we have learned
We will start with an actual Page Object Model implementation today
© 2016 The Future Group - http://bit.ly/2eDaWio
Question #2
What is wrong with these locators?
#1
.//*[@id='wx-header-wrap']/div/div/div/div[2]/div[2]/div/section/div/form/input
#2
.//*[@id='gnav-header-inner']/div/ul/li[2]/a
© 2016 The Future Group - http://bit.ly/2eDaWio
Answer #2
They contain too much information about the location
© 2016 The Future Group - http://bit.ly/2eDaWio
Closer look #1
© 2016 The Future Group - http://bit.ly/2eDaWio
Closer look #1
.//*[@id='wx-header-wrap']/div/div/div/div[2]/div[2]/div/section/div/form/input
What if the location of this element will change over time?
It can be written like this:
input[class = ‘input--search’]
Or
input.input—search
Or
input[name = ‘search’]
© 2016 The Future Group - http://bit.ly/2eDaWio
Closer look #2
© 2016 The Future Group - http://bit.ly/2eDaWio
Closer look #2
.//*[@id='gnav-header-inner']/div/ul/li[2]/a
What if the order of the links will change over time ?
It can be written like this:
a[id=register]
Or
a#register
© 2016 The Future Group - http://bit.ly/2eDaWio
Attribute selectors
css xpath
Equals e[a=v] //e[@a=v]
Contains e[a*=v] //e[contains(@a, ‘v’)]
Starts-with e[a^=v] //e[starts-with(@a,
‘v’)]
Ends-with e[a$=v] //e[ends-with(@a, ‘v’)]
© 2016 The Future Group - http://bit.ly/2eDaWio
Tip: only use Xpath…
If you need to walk up the DOM
Demo
file://localhost/Users/roydekleijn/Documents/whenXpath.html
© 2016 The Future Group - http://bit.ly/2eDaWio
AngularJS - elements
• Different way of locating elements
• Binding
• Model
• Repeat
• ngWebDriver library (create by Paul Hammant)
• https://github.com/paul-hammant/ngWebDriver
• Logic from Protractor project
© 2016 The Future Group - http://bit.ly/2eDaWio
• Enable debug info
• Call angular.reloadWithDebugInfo(); in your browser debug console
• Execute the following snippet to reveal all the elements:
§
© 2016 The Future Group - http://bit.ly/2eDaWio
Contents
19:00 - 20:00 Part 1
• Introduction
• Element locator tips & tricks
• Speed-up and stabilize your tests (demo)
• Implementing the Page Object Model
• Utilize Data Objects
20:00 - 20:15 Coffee
20:15 - 21:15 Part 2
• Handle synchronization
• Play with objects
• What we have learned
We will start with an actual Page Object Model implementation today
© 2016 The Future Group - http://bit.ly/2eDaWio
Speed-up and stabilize your tests
Windows 7
IE
FF
Chrome
Windows vista
IE
FF
Ubuntu
FF
Opera
Mac OS
FF
Chrome
Opera
…
Nodes
Hub
Specification
HUB
Test Scripts
© 2016 The Future Group - http://bit.ly/2eDaWio
Docker Selenium
• Disposable Selenium Grid (in seconds)
• Autoscaling features
• https://hub.docker.com/r/selenium/
© 2016 The Future Group - http://bit.ly/2eDaWio
Docker-compose
seleniumhub:
image: selenium/hub
ports:
- 4444:4444
firefoxnode:
image: selenium/node-firefox
environment:
SCREEN_WIDTH: 2880
SCREEN_HEIGHT: 1800
ports:
- 5900
links:
- seleniumhub:hub
chromenode:
image: selenium/node-chrome
environment:
SCREEN_WIDTH: 2880
SCREEN_HEIGHT: 1800
ports:
- 5900
links:
- seleniumhub:hub
© 2016 The Future Group - http://bit.ly/2eDaWio
Docker commands
Start containers:
docker-compose up –d
-d: Run containers in the background
--force-recreate: Recreate containers entirely
IP of docker engine:
docker-machine ip
Autoscaling:
docker-compose scale firefoxnode=5 chromenode=1
© 2016 The Future Group - http://bit.ly/2eDaWio
Contents
19:00 - 20:00 Part 1
• Introduction
• Element locator tips & tricks
• Speed-up and stabilize your tests (demo)
• Implementing the Page Object Model
• Utilize Data Objects
20:00 - 20:15 Coffee
20:15 - 21:15 Part 2
• Handle synchronization
• Play with objects
• What we have learned
We will start with an actual Page Object Model implementation today
© 2016 The Future Group - http://bit.ly/2eDaWio
Problems that arise
• Unmaintainable
• Unreadable test scripts
• Creation of test scripts is time consuming
• Code duplication
© 2016 The Future Group - http://bit.ly/2eDaWio
From problem to solution
© 2016 The Future Group - http://bit.ly/2eDaWio
Solution
Each page contains only a part of the total functionality available on
the website
Put page specific functionality in a class with a corresponding name
© 2016 The Future Group - http://bit.ly/2eDaWio
Step-by-step plan
1. Identify necessary WebElements
2. Create a class
3. Define WebElements in corresponding classes
4. Model the functionality of a page into methods
5. Model the page flow by setting returntypes
© 2016 The Future Group - http://bit.ly/2eDaWio
Identify necessary WebElements
© 2016 The Future Group - http://bit.ly/2eDaWio
Create a class
A class with the name of the page extending from
LoadableComponent
public class HomePage extends LoadableComponent<HomePage> {
private WebDriver driver;
public HomePage(WebDriver driver) {
this.driver = driver;
PageFactory.initElements(driver, this);
}
© 2016 The Future Group - http://bit.ly/2eDaWio
Define WebElements
On class level (above the methods)
@FindBy(css = "a.login")
private WebElement loginLink;
© 2016 The Future Group - http://bit.ly/2eDaWio
Model the functionality
public LoginPage clickOnLoginLink() {
loginLink.click();
return new LoginPage(driver);
}
© 2016 The Future Group - http://bit.ly/2eDaWio
Model the page flow
• Prerequisite:
• Multiple pages are modelled
• Modify returntype
• The returntype is the name of the page (class) where you are navigating
towards
• Use the current class name, if you stay on the same page
© 2016 The Future Group - http://bit.ly/2eDaWio
Model the page flow
public LoginPage clickOnLoginLink() {
loginLink.click();
return new LoginPage(driver);
}
Returning page
© 2016 The Future Group - http://bit.ly/2eDaWio
Contents
19:00 - 20:00 Part 1
• Introduction
• Element locator tips & tricks
• Speed-up and stabilize your tests (demo)
• Implementing the Page Object Model
• Utilize Data Objects
20:00 - 20:15 Coffee
20:15 - 21:15 Part 2
• Handle synchronization
• Play with objects
• What we have learned
We will start with an actual Page Object Model implementation today
© 2016 The Future Group - http://bit.ly/2eDaWio
Data Objects
final CustomerAccount account = new
CustomerAccount.CustomerAccountBuilder("test@test.com","1qazxsw2").build();
Access data:
account.getEmail()
account.getPassword()
© 2016 The Future Group - http://bit.ly/2eDaWio
Data Objects - Complex
final Order order = new Order.OrderBuilder()//
.withInvoiceAddress(new Address.AddressBuilder("abc street", "1234ab").build())//
.withShippingAddress(new Address.AddressBuilder("shipstreet”,
"4321ab").withCountry("The Netherlands").build())//
.build();
// Retrieve data from the object
System.out.println(order.getInvoiceAddress().getStreet());
System.out.println(order.getShippingAddress().getCountry());
© 2016 The Future Group - http://bit.ly/2eDaWio
Contents
19:00 - 20:00 Part 1
• Introduction
• Element locator tips & tricks
• Speed-up and stabilize your tests (demo)
• Implementing the Page Object Model
• Utilize Data Objects
20:00 - 20:15 Coffee
20:15 - 21:15 Part 2
• Handle synchronization
• Play with objects
• What we have learned
We will start with an actual Page Object Model implementation today
© 2016 The Future Group - http://bit.ly/2eDaWio
Synchronization issues
• Browser has to start
• Page has to load
• AJAX request need to be finished
• Or, loader should be gone before we can continue
© 2016 The Future Group - http://bit.ly/2eDaWio
What NOT to do …
NEVER, use Thread.sleep();
• It will probably make your test unnecessary slow
• You never know if you wait exactly long enough
© 2016 The Future Group - http://bit.ly/2eDaWio
What to do…
• WebDriver build in wait mechanisms
• implicitlyWait: poll till element is present
• Is not inline with fail-fast principle
• setScriptTimeout: time to wait for an asynchronous script to finish
• pageLoadTimeout: time to wait for a page load to complete
• ngWebDriver
• waitForAngularRequestsToFinish – wait for outstanding angular requests
• Custom (gist)
• checkPendingRequests – wait for all HTTP requests to be finished
© 2016 The Future Group - http://bit.ly/2eDaWio
Example 1
Wait for element to be clickable
@Test
public void waitForElementToBeClickable() {
new WebDriverWait(driver, 20,100) //
.until(ExpectedConditions.elementToBeClickable(
By.cssSelector("a.login")));
}
© 2016 The Future Group - http://bit.ly/2eDaWio
Example 2
Wait for loader to be invisible
@Test
public void waitForElementNotToBeVisable() {
new WebDriverWait(driver, 20, 100) //
.until(ExpectedConditions.invisibilityOfElementLocated(
By.cssSelector("loader")));
}
© 2016 The Future Group - http://bit.ly/2eDaWio
Contents
19:00 - 20:00 Part 1
• Introduction
• Element locator tips & tricks
• Speed-up and stabilize your tests (demo)
• Implementing the Page Object Model
• Utilize Data Objects
20:00 - 20:15 Coffee
20:15 - 21:15 Part 2
• Handle synchronization
• Play with objects
• What we have learned
We will start with an actual Page Object Model implementation today
© 2016 The Future Group - http://bit.ly/2eDaWio
Play with Objects
Download sources from: https://github.com/roydekleijn/webdriver-
workshop
Or
http://bit.ly/2eDaWio
Website under test: http://demo.rdekleijn.nl
- Create Register test (model is in place)
- Implement Search test (model not in place)
- Implement Order test (if there is time left..)
© 2016 The Future Group - http://bit.ly/2eDaWio
Contents
19:00 - 20:00 Part 1
• Introduction
• Element locator tips & tricks
• Speed-up and stabilize your tests (demo)
• Implementing the Page Object Model
• Utilize Data Objects
20:00 - 20:15 Coffee
20:15 - 21:15 Part 2
• Handle synchronization
• Play with objects
• What we have learned
We will start with an actual Page Object Model implementation today
© 2016 The Future Group - http://bit.ly/2eDaWio
What we have learned today
Depending on third-party data
Cross-browser issues
Hard to locate elements
testdata
Slow feedback cycle
Flaky tests
High maintenance costs
Synchronization issues
Avoid Thread.sleep()
or other hardcoded
waits
Utilize Page Object
Model
id > name > css >
xpath > angular
Mock interfaces
Run tests in parallel
Mock interfaces
Mock interfaces, setup
clean environments,
implement page object
model
© 2016 The Future Group - http://bit.ly/2eDaWio
Thank you…
Roy de Kleijn
Technical Test Consultant
Email: roy.dekleijn@the-future-group.com
Twitter: @TheWebTester
Website: http://www.rdekleijn.nl
Github: https://github.com/roydekleijn
© 2016 The Future Group - http://bit.ly/2eDaWio

More Related Content

What's hot

Google Developer DAy 2010 Japan: HTML5 についての最新情報 (マイク スミス)
Google Developer DAy 2010 Japan: HTML5 についての最新情報 (マイク スミス)Google Developer DAy 2010 Japan: HTML5 についての最新情報 (マイク スミス)
Google Developer DAy 2010 Japan: HTML5 についての最新情報 (マイク スミス)Google Developer Relations Team
 
An Introduction to Django Web Framework
An Introduction to Django Web FrameworkAn Introduction to Django Web Framework
An Introduction to Django Web FrameworkDavid Gibbons
 
The web - What it has, what it lacks and where it must go - Istanbul
The web - What it has, what it lacks and where it must go - IstanbulThe web - What it has, what it lacks and where it must go - Istanbul
The web - What it has, what it lacks and where it must go - IstanbulRobert Nyman
 
Vaadin and Spring at Devoxx UK 2015
Vaadin and Spring at Devoxx UK 2015Vaadin and Spring at Devoxx UK 2015
Vaadin and Spring at Devoxx UK 2015Sami Ekblad
 
Google Developer Day 2010 Japan: 新 SocialWeb: 全てはオープンスタンダードの元に (ティモシー ジョーダン)
Google Developer Day 2010 Japan: 新 SocialWeb: 全てはオープンスタンダードの元に (ティモシー ジョーダン)Google Developer Day 2010 Japan: 新 SocialWeb: 全てはオープンスタンダードの元に (ティモシー ジョーダン)
Google Developer Day 2010 Japan: 新 SocialWeb: 全てはオープンスタンダードの元に (ティモシー ジョーダン)Google Developer Relations Team
 
How to Webpack your Django!
How to Webpack your Django!How to Webpack your Django!
How to Webpack your Django!David Gibbons
 
Should you use HTML5 to build your product? The pros & cons of using current ...
Should you use HTML5 to build your product? The pros & cons of using current ...Should you use HTML5 to build your product? The pros & cons of using current ...
Should you use HTML5 to build your product? The pros & cons of using current ...boxuno
 
Usability in the GeoWeb
Usability in the GeoWebUsability in the GeoWeb
Usability in the GeoWebDave Bouwman
 
Web Components mit Polymer und AngularJS 1.x
Web Components mit Polymer und AngularJS 1.xWeb Components mit Polymer und AngularJS 1.x
Web Components mit Polymer und AngularJS 1.xPatrickHillert
 
Web Components for Java Developers
Web Components for Java DevelopersWeb Components for Java Developers
Web Components for Java DevelopersJoonas Lehtinen
 
Vaadin Flow - JavaLand 2018
Vaadin Flow - JavaLand 2018Vaadin Flow - JavaLand 2018
Vaadin Flow - JavaLand 2018Peter Lehto
 
SharePoint Silverlight Sandboxed solutions
SharePoint Silverlight Sandboxed solutionsSharePoint Silverlight Sandboxed solutions
SharePoint Silverlight Sandboxed solutionsPhil Wicklund
 
Aleksey Bogachuk - "Offline Second"
Aleksey Bogachuk - "Offline Second"Aleksey Bogachuk - "Offline Second"
Aleksey Bogachuk - "Offline Second"IT Event
 

What's hot (15)

Google Developer DAy 2010 Japan: HTML5 についての最新情報 (マイク スミス)
Google Developer DAy 2010 Japan: HTML5 についての最新情報 (マイク スミス)Google Developer DAy 2010 Japan: HTML5 についての最新情報 (マイク スミス)
Google Developer DAy 2010 Japan: HTML5 についての最新情報 (マイク スミス)
 
An Introduction to Django Web Framework
An Introduction to Django Web FrameworkAn Introduction to Django Web Framework
An Introduction to Django Web Framework
 
Vaadin & Web Components
Vaadin & Web ComponentsVaadin & Web Components
Vaadin & Web Components
 
The web - What it has, what it lacks and where it must go - Istanbul
The web - What it has, what it lacks and where it must go - IstanbulThe web - What it has, what it lacks and where it must go - Istanbul
The web - What it has, what it lacks and where it must go - Istanbul
 
Vaadin and Spring at Devoxx UK 2015
Vaadin and Spring at Devoxx UK 2015Vaadin and Spring at Devoxx UK 2015
Vaadin and Spring at Devoxx UK 2015
 
Google Developer Day 2010 Japan: 新 SocialWeb: 全てはオープンスタンダードの元に (ティモシー ジョーダン)
Google Developer Day 2010 Japan: 新 SocialWeb: 全てはオープンスタンダードの元に (ティモシー ジョーダン)Google Developer Day 2010 Japan: 新 SocialWeb: 全てはオープンスタンダードの元に (ティモシー ジョーダン)
Google Developer Day 2010 Japan: 新 SocialWeb: 全てはオープンスタンダードの元に (ティモシー ジョーダン)
 
How to Webpack your Django!
How to Webpack your Django!How to Webpack your Django!
How to Webpack your Django!
 
Should you use HTML5 to build your product? The pros & cons of using current ...
Should you use HTML5 to build your product? The pros & cons of using current ...Should you use HTML5 to build your product? The pros & cons of using current ...
Should you use HTML5 to build your product? The pros & cons of using current ...
 
Usability in the GeoWeb
Usability in the GeoWebUsability in the GeoWeb
Usability in the GeoWeb
 
Web Components mit Polymer und AngularJS 1.x
Web Components mit Polymer und AngularJS 1.xWeb Components mit Polymer und AngularJS 1.x
Web Components mit Polymer und AngularJS 1.x
 
Web Components for Java Developers
Web Components for Java DevelopersWeb Components for Java Developers
Web Components for Java Developers
 
Vaadin Flow - JavaLand 2018
Vaadin Flow - JavaLand 2018Vaadin Flow - JavaLand 2018
Vaadin Flow - JavaLand 2018
 
Vue.js
Vue.jsVue.js
Vue.js
 
SharePoint Silverlight Sandboxed solutions
SharePoint Silverlight Sandboxed solutionsSharePoint Silverlight Sandboxed solutions
SharePoint Silverlight Sandboxed solutions
 
Aleksey Bogachuk - "Offline Second"
Aleksey Bogachuk - "Offline Second"Aleksey Bogachuk - "Offline Second"
Aleksey Bogachuk - "Offline Second"
 

Viewers also liked

Curso adm 195 planificación y control de proyectos
Curso adm 195   planificación y control de proyectosCurso adm 195   planificación y control de proyectos
Curso adm 195 planificación y control de proyectosProcasecapacita
 
UNION TRIBUNE 8 6 2003
UNION TRIBUNE 8 6 2003UNION TRIBUNE 8 6 2003
UNION TRIBUNE 8 6 2003Curt Howard
 
JOHN SMALL RECOMENDATION
JOHN SMALL RECOMENDATIONJOHN SMALL RECOMENDATION
JOHN SMALL RECOMENDATIONCurt Howard
 
Unit testing and test driven development using vs
Unit testing and test driven development using vsUnit testing and test driven development using vs
Unit testing and test driven development using vsAbhimanyu Singhal
 
And Then There Was One
And Then There Was OneAnd Then There Was One
And Then There Was OneLoretto Leary
 
10 interview tips for green card visa applicants
10 interview tips for green card visa applicants10 interview tips for green card visa applicants
10 interview tips for green card visa applicantsilexlaw pllc
 
T-38 TALON MOVE
T-38 TALON MOVE T-38 TALON MOVE
T-38 TALON MOVE Curt Howard
 
electronics-embedded-project-topics-list-softroniics
electronics-embedded-project-topics-list-softroniicselectronics-embedded-project-topics-list-softroniics
electronics-embedded-project-topics-list-softroniicsshanofa sanu
 
екскурзия до плевенEr point presentation (2)
екскурзия до плевенEr point presentation (2)екскурзия до плевенEr point presentation (2)
екскурзия до плевенEr point presentation (2)Ivanka Lekova
 

Viewers also liked (12)

Curso adm 195 planificación y control de proyectos
Curso adm 195   planificación y control de proyectosCurso adm 195   planificación y control de proyectos
Curso adm 195 planificación y control de proyectos
 
Abstract 3
Abstract 3Abstract 3
Abstract 3
 
UNION TRIBUNE 8 6 2003
UNION TRIBUNE 8 6 2003UNION TRIBUNE 8 6 2003
UNION TRIBUNE 8 6 2003
 
JOHN SMALL RECOMENDATION
JOHN SMALL RECOMENDATIONJOHN SMALL RECOMENDATION
JOHN SMALL RECOMENDATION
 
Unit testing and test driven development using vs
Unit testing and test driven development using vsUnit testing and test driven development using vs
Unit testing and test driven development using vs
 
And Then There Was One
And Then There Was OneAnd Then There Was One
And Then There Was One
 
10 interview tips for green card visa applicants
10 interview tips for green card visa applicants10 interview tips for green card visa applicants
10 interview tips for green card visa applicants
 
T-38 TALON MOVE
T-38 TALON MOVE T-38 TALON MOVE
T-38 TALON MOVE
 
Numeros
NumerosNumeros
Numeros
 
METRO MAGAZINE
METRO MAGAZINE METRO MAGAZINE
METRO MAGAZINE
 
electronics-embedded-project-topics-list-softroniics
electronics-embedded-project-topics-list-softroniicselectronics-embedded-project-topics-list-softroniics
electronics-embedded-project-topics-list-softroniics
 
екскурзия до плевенEr point presentation (2)
екскурзия до плевенEr point presentation (2)екскурзия до плевенEr point presentation (2)
екскурзия до плевенEr point presentation (2)
 

Similar to TestNet 2016 - Improving Your Selenium WebDriver Tests

Improving Your Selenium WebDriver Tests - Belgium testing days_2016
Improving Your Selenium WebDriver Tests - Belgium testing days_2016Improving Your Selenium WebDriver Tests - Belgium testing days_2016
Improving Your Selenium WebDriver Tests - Belgium testing days_2016Roy de Kleijn
 
03 integrate webapisignalr
03 integrate webapisignalr03 integrate webapisignalr
03 integrate webapisignalrErhwen Kuo
 
Front End Development for Back End Java Developers - Jfokus 2020
Front End Development for Back End Java Developers - Jfokus 2020Front End Development for Back End Java Developers - Jfokus 2020
Front End Development for Back End Java Developers - Jfokus 2020Matt Raible
 
Disrupting the application eco system with progressive web applications
Disrupting the application eco system with progressive web applicationsDisrupting the application eco system with progressive web applications
Disrupting the application eco system with progressive web applicationsChris Love
 
夜宴42期《Gadgets》
夜宴42期《Gadgets》夜宴42期《Gadgets》
夜宴42期《Gadgets》Koubei Banquet
 
SadikulIslamDotNetResume
SadikulIslamDotNetResumeSadikulIslamDotNetResume
SadikulIslamDotNetResumeSadikul Islam
 
Server rendering-talk
Server rendering-talkServer rendering-talk
Server rendering-talkDaiwei Lu
 
Introduction to Web Components & Polymer Workshop - JS Interactive
Introduction to Web Components & Polymer Workshop - JS InteractiveIntroduction to Web Components & Polymer Workshop - JS Interactive
Introduction to Web Components & Polymer Workshop - JS InteractiveJohn Riviello
 
Utilizing jQuery in SharePoint: Get More Done Faster
Utilizing jQuery in SharePoint: Get More Done FasterUtilizing jQuery in SharePoint: Get More Done Faster
Utilizing jQuery in SharePoint: Get More Done FasterMark Rackley
 
Week 05 Web, App and Javascript_Brandon, S.H. Wu
Week 05 Web, App and Javascript_Brandon, S.H. WuWeek 05 Web, App and Javascript_Brandon, S.H. Wu
Week 05 Web, App and Javascript_Brandon, S.H. WuAppUniverz Org
 
H2O World - Building a Smarter Application - Tom Kraljevic
H2O World - Building a Smarter Application - Tom KraljevicH2O World - Building a Smarter Application - Tom Kraljevic
H2O World - Building a Smarter Application - Tom KraljevicSri Ambati
 
Django app deployment in Azure By Saurabh Agarwal
Django app deployment in Azure By Saurabh AgarwalDjango app deployment in Azure By Saurabh Agarwal
Django app deployment in Azure By Saurabh Agarwalratneshsinghparihar
 
WordPress Theme Performance - WP Vienna meetup 8.6.2016
WordPress Theme Performance - WP Vienna meetup 8.6.2016WordPress Theme Performance - WP Vienna meetup 8.6.2016
WordPress Theme Performance - WP Vienna meetup 8.6.2016jancbeck
 
MS PowerPoint format
MS PowerPoint formatMS PowerPoint format
MS PowerPoint formatwebhostingguy
 

Similar to TestNet 2016 - Improving Your Selenium WebDriver Tests (20)

Improving Your Selenium WebDriver Tests - Belgium testing days_2016
Improving Your Selenium WebDriver Tests - Belgium testing days_2016Improving Your Selenium WebDriver Tests - Belgium testing days_2016
Improving Your Selenium WebDriver Tests - Belgium testing days_2016
 
03 integrate webapisignalr
03 integrate webapisignalr03 integrate webapisignalr
03 integrate webapisignalr
 
Front End Development for Back End Java Developers - Jfokus 2020
Front End Development for Back End Java Developers - Jfokus 2020Front End Development for Back End Java Developers - Jfokus 2020
Front End Development for Back End Java Developers - Jfokus 2020
 
Web components api + Vuejs
Web components api + VuejsWeb components api + Vuejs
Web components api + Vuejs
 
Introducción al SharePoint Framework SPFx
Introducción al SharePoint Framework SPFxIntroducción al SharePoint Framework SPFx
Introducción al SharePoint Framework SPFx
 
Resume
ResumeResume
Resume
 
Disrupting the application eco system with progressive web applications
Disrupting the application eco system with progressive web applicationsDisrupting the application eco system with progressive web applications
Disrupting the application eco system with progressive web applications
 
Html5 Future of WEB
Html5 Future of WEBHtml5 Future of WEB
Html5 Future of WEB
 
Banquet 42
Banquet 42Banquet 42
Banquet 42
 
夜宴42期《Gadgets》
夜宴42期《Gadgets》夜宴42期《Gadgets》
夜宴42期《Gadgets》
 
SadikulIslamDotNetResume
SadikulIslamDotNetResumeSadikulIslamDotNetResume
SadikulIslamDotNetResume
 
Server rendering-talk
Server rendering-talkServer rendering-talk
Server rendering-talk
 
Introduction to Web Components & Polymer Workshop - JS Interactive
Introduction to Web Components & Polymer Workshop - JS InteractiveIntroduction to Web Components & Polymer Workshop - JS Interactive
Introduction to Web Components & Polymer Workshop - JS Interactive
 
Utilizing jQuery in SharePoint: Get More Done Faster
Utilizing jQuery in SharePoint: Get More Done FasterUtilizing jQuery in SharePoint: Get More Done Faster
Utilizing jQuery in SharePoint: Get More Done Faster
 
Week 05 Web, App and Javascript_Brandon, S.H. Wu
Week 05 Web, App and Javascript_Brandon, S.H. WuWeek 05 Web, App and Javascript_Brandon, S.H. Wu
Week 05 Web, App and Javascript_Brandon, S.H. Wu
 
H2O World - Building a Smarter Application - Tom Kraljevic
H2O World - Building a Smarter Application - Tom KraljevicH2O World - Building a Smarter Application - Tom Kraljevic
H2O World - Building a Smarter Application - Tom Kraljevic
 
DEVICE CHANNELS
DEVICE CHANNELSDEVICE CHANNELS
DEVICE CHANNELS
 
Django app deployment in Azure By Saurabh Agarwal
Django app deployment in Azure By Saurabh AgarwalDjango app deployment in Azure By Saurabh Agarwal
Django app deployment in Azure By Saurabh Agarwal
 
WordPress Theme Performance - WP Vienna meetup 8.6.2016
WordPress Theme Performance - WP Vienna meetup 8.6.2016WordPress Theme Performance - WP Vienna meetup 8.6.2016
WordPress Theme Performance - WP Vienna meetup 8.6.2016
 
MS PowerPoint format
MS PowerPoint formatMS PowerPoint format
MS PowerPoint format
 

Recently uploaded

Post Quantum Cryptography – The Impact on Identity
Post Quantum Cryptography – The Impact on IdentityPost Quantum Cryptography – The Impact on Identity
Post Quantum Cryptography – The Impact on Identityteam-WIBU
 
Introduction to Firebase Workshop Slides
Introduction to Firebase Workshop SlidesIntroduction to Firebase Workshop Slides
Introduction to Firebase Workshop Slidesvaideheekore1
 
Leveraging AI for Mobile App Testing on Real Devices | Applitools + Kobiton
Leveraging AI for Mobile App Testing on Real Devices | Applitools + KobitonLeveraging AI for Mobile App Testing on Real Devices | Applitools + Kobiton
Leveraging AI for Mobile App Testing on Real Devices | Applitools + KobitonApplitools
 
UI5ers live - Custom Controls wrapping 3rd-party libs.pptx
UI5ers live - Custom Controls wrapping 3rd-party libs.pptxUI5ers live - Custom Controls wrapping 3rd-party libs.pptx
UI5ers live - Custom Controls wrapping 3rd-party libs.pptxAndreas Kunz
 
Exploring Selenium_Appium Frameworks for Seamless Integration with HeadSpin.pdf
Exploring Selenium_Appium Frameworks for Seamless Integration with HeadSpin.pdfExploring Selenium_Appium Frameworks for Seamless Integration with HeadSpin.pdf
Exploring Selenium_Appium Frameworks for Seamless Integration with HeadSpin.pdfkalichargn70th171
 
Odoo 14 - eLearning Module In Odoo 14 Enterprise
Odoo 14 - eLearning Module In Odoo 14 EnterpriseOdoo 14 - eLearning Module In Odoo 14 Enterprise
Odoo 14 - eLearning Module In Odoo 14 Enterprisepreethippts
 
Catch the Wave: SAP Event-Driven and Data Streaming for the Intelligence Ente...
Catch the Wave: SAP Event-Driven and Data Streaming for the Intelligence Ente...Catch the Wave: SAP Event-Driven and Data Streaming for the Intelligence Ente...
Catch the Wave: SAP Event-Driven and Data Streaming for the Intelligence Ente...confluent
 
VK Business Profile - provides IT solutions and Web Development
VK Business Profile - provides IT solutions and Web DevelopmentVK Business Profile - provides IT solutions and Web Development
VK Business Profile - provides IT solutions and Web Developmentvyaparkranti
 
Machine Learning Software Engineering Patterns and Their Engineering
Machine Learning Software Engineering Patterns and Their EngineeringMachine Learning Software Engineering Patterns and Their Engineering
Machine Learning Software Engineering Patterns and Their EngineeringHironori Washizaki
 
What is Advanced Excel and what are some best practices for designing and cre...
What is Advanced Excel and what are some best practices for designing and cre...What is Advanced Excel and what are some best practices for designing and cre...
What is Advanced Excel and what are some best practices for designing and cre...Technogeeks
 
SuccessFactors 1H 2024 Release - Sneak-Peek by Deloitte Germany
SuccessFactors 1H 2024 Release - Sneak-Peek by Deloitte GermanySuccessFactors 1H 2024 Release - Sneak-Peek by Deloitte Germany
SuccessFactors 1H 2024 Release - Sneak-Peek by Deloitte GermanyChristoph Pohl
 
SpotFlow: Tracking Method Calls and States at Runtime
SpotFlow: Tracking Method Calls and States at RuntimeSpotFlow: Tracking Method Calls and States at Runtime
SpotFlow: Tracking Method Calls and States at Runtimeandrehoraa
 
Not a Kubernetes fan? The state of PaaS in 2024
Not a Kubernetes fan? The state of PaaS in 2024Not a Kubernetes fan? The state of PaaS in 2024
Not a Kubernetes fan? The state of PaaS in 2024Anthony Dahanne
 
Precise and Complete Requirements? An Elusive Goal
Precise and Complete Requirements? An Elusive GoalPrecise and Complete Requirements? An Elusive Goal
Precise and Complete Requirements? An Elusive GoalLionel Briand
 
CRM Contender Series: HubSpot vs. Salesforce
CRM Contender Series: HubSpot vs. SalesforceCRM Contender Series: HubSpot vs. Salesforce
CRM Contender Series: HubSpot vs. SalesforceBrainSell Technologies
 
Simplifying Microservices & Apps - The art of effortless development - Meetup...
Simplifying Microservices & Apps - The art of effortless development - Meetup...Simplifying Microservices & Apps - The art of effortless development - Meetup...
Simplifying Microservices & Apps - The art of effortless development - Meetup...Rob Geurden
 
Sending Calendar Invites on SES and Calendarsnack.pdf
Sending Calendar Invites on SES and Calendarsnack.pdfSending Calendar Invites on SES and Calendarsnack.pdf
Sending Calendar Invites on SES and Calendarsnack.pdf31events.com
 
Real-time Tracking and Monitoring with Cargo Cloud Solutions.pptx
Real-time Tracking and Monitoring with Cargo Cloud Solutions.pptxReal-time Tracking and Monitoring with Cargo Cloud Solutions.pptx
Real-time Tracking and Monitoring with Cargo Cloud Solutions.pptxRTS corp
 
Amazon Bedrock in Action - presentation of the Bedrock's capabilities
Amazon Bedrock in Action - presentation of the Bedrock's capabilitiesAmazon Bedrock in Action - presentation of the Bedrock's capabilities
Amazon Bedrock in Action - presentation of the Bedrock's capabilitiesKrzysztofKkol1
 
OpenChain Education Work Group Monthly Meeting - 2024-04-10 - Full Recording
OpenChain Education Work Group Monthly Meeting - 2024-04-10 - Full RecordingOpenChain Education Work Group Monthly Meeting - 2024-04-10 - Full Recording
OpenChain Education Work Group Monthly Meeting - 2024-04-10 - Full RecordingShane Coughlan
 

Recently uploaded (20)

Post Quantum Cryptography – The Impact on Identity
Post Quantum Cryptography – The Impact on IdentityPost Quantum Cryptography – The Impact on Identity
Post Quantum Cryptography – The Impact on Identity
 
Introduction to Firebase Workshop Slides
Introduction to Firebase Workshop SlidesIntroduction to Firebase Workshop Slides
Introduction to Firebase Workshop Slides
 
Leveraging AI for Mobile App Testing on Real Devices | Applitools + Kobiton
Leveraging AI for Mobile App Testing on Real Devices | Applitools + KobitonLeveraging AI for Mobile App Testing on Real Devices | Applitools + Kobiton
Leveraging AI for Mobile App Testing on Real Devices | Applitools + Kobiton
 
UI5ers live - Custom Controls wrapping 3rd-party libs.pptx
UI5ers live - Custom Controls wrapping 3rd-party libs.pptxUI5ers live - Custom Controls wrapping 3rd-party libs.pptx
UI5ers live - Custom Controls wrapping 3rd-party libs.pptx
 
Exploring Selenium_Appium Frameworks for Seamless Integration with HeadSpin.pdf
Exploring Selenium_Appium Frameworks for Seamless Integration with HeadSpin.pdfExploring Selenium_Appium Frameworks for Seamless Integration with HeadSpin.pdf
Exploring Selenium_Appium Frameworks for Seamless Integration with HeadSpin.pdf
 
Odoo 14 - eLearning Module In Odoo 14 Enterprise
Odoo 14 - eLearning Module In Odoo 14 EnterpriseOdoo 14 - eLearning Module In Odoo 14 Enterprise
Odoo 14 - eLearning Module In Odoo 14 Enterprise
 
Catch the Wave: SAP Event-Driven and Data Streaming for the Intelligence Ente...
Catch the Wave: SAP Event-Driven and Data Streaming for the Intelligence Ente...Catch the Wave: SAP Event-Driven and Data Streaming for the Intelligence Ente...
Catch the Wave: SAP Event-Driven and Data Streaming for the Intelligence Ente...
 
VK Business Profile - provides IT solutions and Web Development
VK Business Profile - provides IT solutions and Web DevelopmentVK Business Profile - provides IT solutions and Web Development
VK Business Profile - provides IT solutions and Web Development
 
Machine Learning Software Engineering Patterns and Their Engineering
Machine Learning Software Engineering Patterns and Their EngineeringMachine Learning Software Engineering Patterns and Their Engineering
Machine Learning Software Engineering Patterns and Their Engineering
 
What is Advanced Excel and what are some best practices for designing and cre...
What is Advanced Excel and what are some best practices for designing and cre...What is Advanced Excel and what are some best practices for designing and cre...
What is Advanced Excel and what are some best practices for designing and cre...
 
SuccessFactors 1H 2024 Release - Sneak-Peek by Deloitte Germany
SuccessFactors 1H 2024 Release - Sneak-Peek by Deloitte GermanySuccessFactors 1H 2024 Release - Sneak-Peek by Deloitte Germany
SuccessFactors 1H 2024 Release - Sneak-Peek by Deloitte Germany
 
SpotFlow: Tracking Method Calls and States at Runtime
SpotFlow: Tracking Method Calls and States at RuntimeSpotFlow: Tracking Method Calls and States at Runtime
SpotFlow: Tracking Method Calls and States at Runtime
 
Not a Kubernetes fan? The state of PaaS in 2024
Not a Kubernetes fan? The state of PaaS in 2024Not a Kubernetes fan? The state of PaaS in 2024
Not a Kubernetes fan? The state of PaaS in 2024
 
Precise and Complete Requirements? An Elusive Goal
Precise and Complete Requirements? An Elusive GoalPrecise and Complete Requirements? An Elusive Goal
Precise and Complete Requirements? An Elusive Goal
 
CRM Contender Series: HubSpot vs. Salesforce
CRM Contender Series: HubSpot vs. SalesforceCRM Contender Series: HubSpot vs. Salesforce
CRM Contender Series: HubSpot vs. Salesforce
 
Simplifying Microservices & Apps - The art of effortless development - Meetup...
Simplifying Microservices & Apps - The art of effortless development - Meetup...Simplifying Microservices & Apps - The art of effortless development - Meetup...
Simplifying Microservices & Apps - The art of effortless development - Meetup...
 
Sending Calendar Invites on SES and Calendarsnack.pdf
Sending Calendar Invites on SES and Calendarsnack.pdfSending Calendar Invites on SES and Calendarsnack.pdf
Sending Calendar Invites on SES and Calendarsnack.pdf
 
Real-time Tracking and Monitoring with Cargo Cloud Solutions.pptx
Real-time Tracking and Monitoring with Cargo Cloud Solutions.pptxReal-time Tracking and Monitoring with Cargo Cloud Solutions.pptx
Real-time Tracking and Monitoring with Cargo Cloud Solutions.pptx
 
Amazon Bedrock in Action - presentation of the Bedrock's capabilities
Amazon Bedrock in Action - presentation of the Bedrock's capabilitiesAmazon Bedrock in Action - presentation of the Bedrock's capabilities
Amazon Bedrock in Action - presentation of the Bedrock's capabilities
 
OpenChain Education Work Group Monthly Meeting - 2024-04-10 - Full Recording
OpenChain Education Work Group Monthly Meeting - 2024-04-10 - Full RecordingOpenChain Education Work Group Monthly Meeting - 2024-04-10 - Full Recording
OpenChain Education Work Group Monthly Meeting - 2024-04-10 - Full Recording
 

TestNet 2016 - Improving Your Selenium WebDriver Tests

  • 1. Improving Your Selenium WebDriver Tests Roy de Kleijn Technical Test Consultant Email: roy.dekleijn@the-future-group.com Twitter: @TheWebTester Website: http://www.rdekleijn.nl Github: https://github.com/roydekleijn © 2016 The Future Group - http://bit.ly/2eDaWio
  • 2. Question #1 What makes your Selenium WebDriver tests suck? © 2016 The Future Group - http://bit.ly/2eDaWio
  • 3. Answer #1 Depending on third-party data Synchronization issues Cross-browser issues Hard to locate elements testdata Slow feedback cycle Flaky tests High maintenance costs © 2016 The Future Group - http://bit.ly/2eDaWio
  • 4. Lack of confidence Results in … © 2016 The Future Group - http://bit.ly/2eDaWio
  • 5. Contents 19:00 - 20:00 Part 1 • Introduction • Element locator tips & tricks • Speed-up and stabilize your tests (demo) • Implementing the Page Object Model • Utilize Data Objects • Handle synchronization 20:00 - 20:15 Coffee 20:15 - 21:15 Part 2 • Handle synchronization • Play with objects • What we have learned We will start with an actual Page Object Model implementation today © 2016 The Future Group - http://bit.ly/2eDaWio
  • 6. Maintenance test Maintenanceeffort Time Reality: code ends up into unmaintainable spaghetti wish © 2016 The Future Group - http://bit.ly/2eDaWio
  • 7. Testing Pyramid unit UI API feedback-cycle - Extremely fast - Smallest units of the application / isolates failure - Executed during build time - No dependency on data - Extremely slow - Requires running application - Will change frequently - Dependency on data - Fast - Covering boundary conditions - Start early in SD process - Requires running application - (some) dependency on data © 2016 The Future Group - http://bit.ly/2eDaWio
  • 8. Mock External Interfaces application Interface 1 Interface 2 Interface 3 application Interface 1 Interface 2 Interface 3 mock © 2016 The Future Group - http://bit.ly/2eDaWio
  • 9. Contents 19:00 - 20:00 Part 1 • Introduction • Element locator tips & tricks • Speed-up and stabilize your tests (demo) • Implementing the Page Object Model • Utilize Data Objects 20:00 - 20:15 Coffee 20:15 - 21:15 Part 2 • Handle synchronization • Play with objects • What we have learned We will start with an actual Page Object Model implementation today © 2016 The Future Group - http://bit.ly/2eDaWio
  • 10. Question #2 What is wrong with these locators? #1 .//*[@id='wx-header-wrap']/div/div/div/div[2]/div[2]/div/section/div/form/input #2 .//*[@id='gnav-header-inner']/div/ul/li[2]/a © 2016 The Future Group - http://bit.ly/2eDaWio
  • 11. Answer #2 They contain too much information about the location © 2016 The Future Group - http://bit.ly/2eDaWio
  • 12. Closer look #1 © 2016 The Future Group - http://bit.ly/2eDaWio
  • 13. Closer look #1 .//*[@id='wx-header-wrap']/div/div/div/div[2]/div[2]/div/section/div/form/input What if the location of this element will change over time? It can be written like this: input[class = ‘input--search’] Or input.input—search Or input[name = ‘search’] © 2016 The Future Group - http://bit.ly/2eDaWio
  • 14. Closer look #2 © 2016 The Future Group - http://bit.ly/2eDaWio
  • 15. Closer look #2 .//*[@id='gnav-header-inner']/div/ul/li[2]/a What if the order of the links will change over time ? It can be written like this: a[id=register] Or a#register © 2016 The Future Group - http://bit.ly/2eDaWio
  • 16. Attribute selectors css xpath Equals e[a=v] //e[@a=v] Contains e[a*=v] //e[contains(@a, ‘v’)] Starts-with e[a^=v] //e[starts-with(@a, ‘v’)] Ends-with e[a$=v] //e[ends-with(@a, ‘v’)] © 2016 The Future Group - http://bit.ly/2eDaWio
  • 17. Tip: only use Xpath… If you need to walk up the DOM Demo file://localhost/Users/roydekleijn/Documents/whenXpath.html © 2016 The Future Group - http://bit.ly/2eDaWio
  • 18. AngularJS - elements • Different way of locating elements • Binding • Model • Repeat • ngWebDriver library (create by Paul Hammant) • https://github.com/paul-hammant/ngWebDriver • Logic from Protractor project © 2016 The Future Group - http://bit.ly/2eDaWio
  • 19. • Enable debug info • Call angular.reloadWithDebugInfo(); in your browser debug console • Execute the following snippet to reveal all the elements: § © 2016 The Future Group - http://bit.ly/2eDaWio
  • 20. Contents 19:00 - 20:00 Part 1 • Introduction • Element locator tips & tricks • Speed-up and stabilize your tests (demo) • Implementing the Page Object Model • Utilize Data Objects 20:00 - 20:15 Coffee 20:15 - 21:15 Part 2 • Handle synchronization • Play with objects • What we have learned We will start with an actual Page Object Model implementation today © 2016 The Future Group - http://bit.ly/2eDaWio
  • 21. Speed-up and stabilize your tests Windows 7 IE FF Chrome Windows vista IE FF Ubuntu FF Opera Mac OS FF Chrome Opera … Nodes Hub Specification HUB Test Scripts © 2016 The Future Group - http://bit.ly/2eDaWio
  • 22. Docker Selenium • Disposable Selenium Grid (in seconds) • Autoscaling features • https://hub.docker.com/r/selenium/ © 2016 The Future Group - http://bit.ly/2eDaWio
  • 23. Docker-compose seleniumhub: image: selenium/hub ports: - 4444:4444 firefoxnode: image: selenium/node-firefox environment: SCREEN_WIDTH: 2880 SCREEN_HEIGHT: 1800 ports: - 5900 links: - seleniumhub:hub chromenode: image: selenium/node-chrome environment: SCREEN_WIDTH: 2880 SCREEN_HEIGHT: 1800 ports: - 5900 links: - seleniumhub:hub © 2016 The Future Group - http://bit.ly/2eDaWio
  • 24. Docker commands Start containers: docker-compose up –d -d: Run containers in the background --force-recreate: Recreate containers entirely IP of docker engine: docker-machine ip Autoscaling: docker-compose scale firefoxnode=5 chromenode=1 © 2016 The Future Group - http://bit.ly/2eDaWio
  • 25. Contents 19:00 - 20:00 Part 1 • Introduction • Element locator tips & tricks • Speed-up and stabilize your tests (demo) • Implementing the Page Object Model • Utilize Data Objects 20:00 - 20:15 Coffee 20:15 - 21:15 Part 2 • Handle synchronization • Play with objects • What we have learned We will start with an actual Page Object Model implementation today © 2016 The Future Group - http://bit.ly/2eDaWio
  • 26. Problems that arise • Unmaintainable • Unreadable test scripts • Creation of test scripts is time consuming • Code duplication © 2016 The Future Group - http://bit.ly/2eDaWio
  • 27. From problem to solution © 2016 The Future Group - http://bit.ly/2eDaWio
  • 28. Solution Each page contains only a part of the total functionality available on the website Put page specific functionality in a class with a corresponding name © 2016 The Future Group - http://bit.ly/2eDaWio
  • 29. Step-by-step plan 1. Identify necessary WebElements 2. Create a class 3. Define WebElements in corresponding classes 4. Model the functionality of a page into methods 5. Model the page flow by setting returntypes © 2016 The Future Group - http://bit.ly/2eDaWio
  • 30. Identify necessary WebElements © 2016 The Future Group - http://bit.ly/2eDaWio
  • 31. Create a class A class with the name of the page extending from LoadableComponent public class HomePage extends LoadableComponent<HomePage> { private WebDriver driver; public HomePage(WebDriver driver) { this.driver = driver; PageFactory.initElements(driver, this); } © 2016 The Future Group - http://bit.ly/2eDaWio
  • 32. Define WebElements On class level (above the methods) @FindBy(css = "a.login") private WebElement loginLink; © 2016 The Future Group - http://bit.ly/2eDaWio
  • 33. Model the functionality public LoginPage clickOnLoginLink() { loginLink.click(); return new LoginPage(driver); } © 2016 The Future Group - http://bit.ly/2eDaWio
  • 34. Model the page flow • Prerequisite: • Multiple pages are modelled • Modify returntype • The returntype is the name of the page (class) where you are navigating towards • Use the current class name, if you stay on the same page © 2016 The Future Group - http://bit.ly/2eDaWio
  • 35. Model the page flow public LoginPage clickOnLoginLink() { loginLink.click(); return new LoginPage(driver); } Returning page © 2016 The Future Group - http://bit.ly/2eDaWio
  • 36. Contents 19:00 - 20:00 Part 1 • Introduction • Element locator tips & tricks • Speed-up and stabilize your tests (demo) • Implementing the Page Object Model • Utilize Data Objects 20:00 - 20:15 Coffee 20:15 - 21:15 Part 2 • Handle synchronization • Play with objects • What we have learned We will start with an actual Page Object Model implementation today © 2016 The Future Group - http://bit.ly/2eDaWio
  • 37. Data Objects final CustomerAccount account = new CustomerAccount.CustomerAccountBuilder("test@test.com","1qazxsw2").build(); Access data: account.getEmail() account.getPassword() © 2016 The Future Group - http://bit.ly/2eDaWio
  • 38. Data Objects - Complex final Order order = new Order.OrderBuilder()// .withInvoiceAddress(new Address.AddressBuilder("abc street", "1234ab").build())// .withShippingAddress(new Address.AddressBuilder("shipstreet”, "4321ab").withCountry("The Netherlands").build())// .build(); // Retrieve data from the object System.out.println(order.getInvoiceAddress().getStreet()); System.out.println(order.getShippingAddress().getCountry()); © 2016 The Future Group - http://bit.ly/2eDaWio
  • 39. Contents 19:00 - 20:00 Part 1 • Introduction • Element locator tips & tricks • Speed-up and stabilize your tests (demo) • Implementing the Page Object Model • Utilize Data Objects 20:00 - 20:15 Coffee 20:15 - 21:15 Part 2 • Handle synchronization • Play with objects • What we have learned We will start with an actual Page Object Model implementation today © 2016 The Future Group - http://bit.ly/2eDaWio
  • 40. Synchronization issues • Browser has to start • Page has to load • AJAX request need to be finished • Or, loader should be gone before we can continue © 2016 The Future Group - http://bit.ly/2eDaWio
  • 41. What NOT to do … NEVER, use Thread.sleep(); • It will probably make your test unnecessary slow • You never know if you wait exactly long enough © 2016 The Future Group - http://bit.ly/2eDaWio
  • 42. What to do… • WebDriver build in wait mechanisms • implicitlyWait: poll till element is present • Is not inline with fail-fast principle • setScriptTimeout: time to wait for an asynchronous script to finish • pageLoadTimeout: time to wait for a page load to complete • ngWebDriver • waitForAngularRequestsToFinish – wait for outstanding angular requests • Custom (gist) • checkPendingRequests – wait for all HTTP requests to be finished © 2016 The Future Group - http://bit.ly/2eDaWio
  • 43. Example 1 Wait for element to be clickable @Test public void waitForElementToBeClickable() { new WebDriverWait(driver, 20,100) // .until(ExpectedConditions.elementToBeClickable( By.cssSelector("a.login"))); } © 2016 The Future Group - http://bit.ly/2eDaWio
  • 44. Example 2 Wait for loader to be invisible @Test public void waitForElementNotToBeVisable() { new WebDriverWait(driver, 20, 100) // .until(ExpectedConditions.invisibilityOfElementLocated( By.cssSelector("loader"))); } © 2016 The Future Group - http://bit.ly/2eDaWio
  • 45. Contents 19:00 - 20:00 Part 1 • Introduction • Element locator tips & tricks • Speed-up and stabilize your tests (demo) • Implementing the Page Object Model • Utilize Data Objects 20:00 - 20:15 Coffee 20:15 - 21:15 Part 2 • Handle synchronization • Play with objects • What we have learned We will start with an actual Page Object Model implementation today © 2016 The Future Group - http://bit.ly/2eDaWio
  • 46. Play with Objects Download sources from: https://github.com/roydekleijn/webdriver- workshop Or http://bit.ly/2eDaWio Website under test: http://demo.rdekleijn.nl - Create Register test (model is in place) - Implement Search test (model not in place) - Implement Order test (if there is time left..) © 2016 The Future Group - http://bit.ly/2eDaWio
  • 47. Contents 19:00 - 20:00 Part 1 • Introduction • Element locator tips & tricks • Speed-up and stabilize your tests (demo) • Implementing the Page Object Model • Utilize Data Objects 20:00 - 20:15 Coffee 20:15 - 21:15 Part 2 • Handle synchronization • Play with objects • What we have learned We will start with an actual Page Object Model implementation today © 2016 The Future Group - http://bit.ly/2eDaWio
  • 48. What we have learned today Depending on third-party data Cross-browser issues Hard to locate elements testdata Slow feedback cycle Flaky tests High maintenance costs Synchronization issues Avoid Thread.sleep() or other hardcoded waits Utilize Page Object Model id > name > css > xpath > angular Mock interfaces Run tests in parallel Mock interfaces Mock interfaces, setup clean environments, implement page object model © 2016 The Future Group - http://bit.ly/2eDaWio
  • 49. Thank you… Roy de Kleijn Technical Test Consultant Email: roy.dekleijn@the-future-group.com Twitter: @TheWebTester Website: http://www.rdekleijn.nl Github: https://github.com/roydekleijn © 2016 The Future Group - http://bit.ly/2eDaWio

Editor's Notes

  1. Selenium WebDriver is a popular tool for driving the browsers for test automation. Many companies with browser-based applications have taken steps towards including Selenium WebDriver in their repertoire. There’s also a lot of reports on challenges: brittleness of tests with tests passing and failing randomly, trouble with maintenance as the test suites get bigger and difficulties working with Angular or Ajax enriched applications. If you can’t trust your tests, maintaining them takes a lot of time or your application feels to disagree with being easy to test, your tests might not be adding value. In this workshop, we focus on Selenium WebDriver tests as code, and look into practices to overcome these common problems. We start with existing tests on an open source application, and we change them through refactoring to improve them. Join this session to improve your ability to create more maintainable and valuable tests with Selenium WebDriver.
  2. Let me start with a question..
  3. In this workshop we are going to cover some of these topics - Some of these answers are highly related to each other and can be resolved in one go..
  4. Some time ago I have drawn a graph of how a project evolves over time.
  5. Why we do this ?? To speed up testing, to be able to run more tests in parallel We need to do this carefully, because data can change the state of the application and will influence other tests
  6. Tests bevatten veel driver specieke syntax, waardoor je onleesbare scripts krijgt. Het maken van scripts duurt vrij lang en wordt als lastig ervaren
  7. Hoe kom je nu tot deze oplossing. Ik heb een 4 stappenplan bedacht om tot een werkbare abstractie te komen. In sommige gevallen kan het wenselijk zijn om voor een hoger abstractie niveau te kiezen. (als bijvoorbeeld veel functionaliteit op de website hetzelfde is en de pagina’s erg op elkaar lijken). Je kan dan “parent classes” maken en deze laten erfen. OF Maken van veel voorkomende componenten en deze gebruiken op de specifieke pagina’s.
  8. Voorbeeld van een loginscript van Wehkamp.nl
  9. Zoals we eerder hebben gezien kunnen we webelementen benaderen aan de hand van een locator. Het is aan te raden om deze 1x boven in de class te definieren. De logische naam (tweede regel) kun je dan gebruiken in alle onderliggende methodes. Dit bevorderd de onderhoudbaarheid, omdat je de naam van de locator maar op 1 plek hoeft aan te passen bij een wijziging.
  10. Het idee is om methoded te maken die de functionaliteit van de pagine representeren. Er kan voor gekozen worden om meerdere acties te groeperen in 1 functie. Dit hangt samen met het soort test cases dat gemaakt gaat worden.
  11. Zie vorige sheet.
  12. Selenium WebDriver is a popular tool for driving the browsers for test automation. Many companies with browser-based applications have taken steps towards including Selenium WebDriver in their repertoire. There’s also a lot of reports on challenges: brittleness of tests with tests passing and failing randomly, trouble with maintenance as the test suites get bigger and difficulties working with Angular or Ajax enriched applications. If you can’t trust your tests, maintaining them takes a lot of time or your application feels to disagree with being easy to test, your tests might not be adding value. In this workshop, we focus on Selenium WebDriver tests as code, and look into practices to overcome these common problems. We start with existing tests on an open source application, and we change them through refactoring to improve them. Join this session to improve your ability to create more maintainable and valuable tests with Selenium WebDriver.