Web UI Tests: Introduce UI tests using Selenium

Test Client & User Interface
using Selenium
Peyman Fakharian
Hamed Salimian
Software Testing
Computer Department, Sharif University of Technology
2017-12
1

Web testing
 Automated testing is an extremely useful bug-killing tool
for the modern Web development
 Testing a Web application is a complex task
 several layers of logic
 test-execution framework
 Web testing main parts
 Database
 URL- Context
 HTTP requests
 Client/User Interface
2

Client Testing
 Simulate GET and POST requests on a URL and observe the
response
 See the chain of redirects (if any) and check the URL and
status code at each step.
 Test that a given request is rendered with a context that
contains certain values.
 HTTP-based Client tests vs. in-browser frameworks
3

HTTP-based Testing
 Get/POST requests
 API
 Login/Register
 Search
 Status codes
4

HTTP-based Testing (cont.)
 Let’s see in action!
5

Selenium
 So what is Selenium?
 Selenium automates browsers
 automating web applications for testing purposes
 automating Boring web-based administration tasks
 Selenium Web Driver
 create robust, browser-based regression automation suites and tests
 Previously known as Selenium RC (Remote Control)
 Selenium IDE
 create quick bug reproduction scripts
 Firefox add-on
6
Selenium available
languages

Selenium WebDriver
 Driving a browser natively as a user would either locally or
on a remote machine
 An API driven browser
 Chrome
 Firefox,
 Safari
 IE
 PhantomJS Driver
 Remote web Driver
7

Selenium (cont.)
 So why we need selenium?
 Simulate user interactions
 Test in different browsers
 AJAX applications
 DO all things a user could do in a browser! Not just http
requests, any thing!
 Selenium is humanized!
 Not only your code
 Also your interactions!
 Integration with different web frameworks
8

Getting started!
 Walk through the selenium docs example
9

Testing forms
Let’s try
this
example
step by
step!
10

Testing form fields
a simple regex to detect
phone numbers with
exact 11 digits
11

Navigation Utilities
 Selenium provides different navigation utilities
 Click links
 Submit forms
 Drag and drop
 Moving between windows
 Browser history
 Also provides cookies
 So you can use session
 Login, authentication, authorization, … made easy now!
Drag & drop from selenium documentation
12

Locating Elements
 Let’s see through an example
13

Waits capability
 most of the web apps are using AJAX
 if an element is not yet present in the DOM, a locate
function will raise an ElementNotVisibleException exception
 Waiting provides some slack between actions performed
 Implicit (makes WebDriver poll the DOM for a certain amount
of time)
 Explicit (certain condition)
 Let’s see in action!
14

Test design
 Types of tests
 Static content
 Links
 Function tests
 Ajax tests
 Locating strategy
 Dynamic elements
 User interface mapping
 makes script maintenance more efficient
 more human-readable names
 Database Validation
15

Data driven testing
 using the same test (or tests) multiple times with varying
data
 data sets are often from external files i.e. .csv
 validate an application against many varying inputs
 Let’s write some codes!
16

Page object design pattern
 A page object represents an area in the web application user
interface that your test is interacting.
 Benefits of using page object pattern:
 Creating reusable code that can be shared across multiple test
cases
 improve readability
 Reducing the amount of duplicated code
 If the user interface changes, the fix needs changes in only one
place
 creating an object for each web page
 create robust, browser-based regression automation suites and
tests
 By following this technique a layer of separation between the
test code and technical implementation is created
17

(cont.)
Image source: blazemeter tech. blog
18

(cont.)
 Consist of two/three/four main parts:
 Locators
 Elements
 Pages
 Tests
 Page object design pattern has been evolved in screenplay
pattern.
 Let’s execute some codes!
19

Selenium grid
 Selenium-Grid allows you run your tests on different machines
against different browsers in parallel.
 support distributed test execution
 When you should use selenium grid?
 To reduce the time it takes for the test suite to complete
 To run your tests against multiple browsers, multiple versions of
browser, and browsers running on different operating systems.
 Steps:
 Install selenium server/grid (jar file)
 Run selenium server and create a hub
 Create multiple nodes as you want
20

Notable features
 Use proxy for browser startup
 Action chains
 Key up, hover, key down, enter, move, etc.
 Remote web-driver
 Desired Capabilities
 Color support
Example of desired capacities
21

Notable features (cont.)
 Save/download/upload files
 Custom Firefox profile
 Take screenshot
 All user navigations
 Selenium Web Driver
Custom Firefox profile
22

Other Selenium applications
 Not only for test automation
 Crawl/scrape ajax based pages
 Monitoring/Metric collections
Examples of Yektanet ads
23

Selenium project has a
conference!
 The Official 2017 European Selenium Conference
 Berlin, Germany | 9–10 October
 You can watch the talks in selenium YouTube channel
 https://www.youtube.com/user/seleniumconf/videos
24

Conclusion
 Selenium automates browsers
 automating web applications for testing purposes
 You can do anything a real user does on your website
 Simulate various type/version of the browsers
 Great features, human readable
 Introduce/develop some test design patterns
25

Web UI Tests: Introduce UI tests using Selenium

More Related Content

What's hot (20)

Similar to Web UI Tests: Introduce UI tests using Selenium (20)

Recently uploaded (20)

Web UI Tests: Introduce UI tests using Selenium