Telerik Test Studio

Web Testing

Pavel Pankov
QA Lead
Automated Testing Team

Telerik QA Academy
 Table of Contents
 Introduction to Telerik Test Studio
 Working With Projects
 Recording Tests
 Verification
 Extractions
 Logical Steps
 Test Organization
 Working With Test Results
 Web Application Tests
 Data Driven Tests
2
 Introduction to
Telerik Test Studio
 Telerik Test Studio
 Telerik Test Studio is an automated testing
tool
 Offers an intuitive, codeless and productive way
to test any web or WPF desktop application
 Test recording is performed extremely easy
 In the same manner as an end user would
accomplish these same tasks
 Web test recording is performed directly in the
browser

4
 Telerik Test Studio (2)
 Navigation, text entry, clicking links, drag-
and-drop, hovering the mouse are all recorded
as test steps
 Smart point-and-click wizards visually
highlight elements and automatically generate
"verifications" as test steps

5
 Test Studio Versions
 Test Studio offers two versions:
 Standalone version
 For QA professionals
 Formerly known as 'QA Edition'
 Visual Studio plugin
 For developers willing to perform functional
testing themselves
 Formerly 'Developer Edition' now known as 'Test
Studio Express'

6
 Test Studio Features
 Test Studio features:
 Rich highlighting surface
 DOM Explorer for HTML & Silverlight (Visual
tree)
 Element menu for rich on the spot recordings
 Quick tasks for dynamic verifications
 Data Driven Testing
 Silverlight support
 Ajax Support
7
 Test Studio Features (2)
 Test Studio features:
 Automatic Synchronization steps
 Command line execution support
 Build server integration (CruiseControl,
TeamBuildServer)
 Results management using a results calendar
 Test list management that supports ordering

8
 Test Studio
Tabs and Panes
Quick Demo
Tour
Working With Projects
 Project Files Pane
 The Project Files Pane uses visual cues to
indicate the current status of projects, folders
and tests
 Tests that are data bound display the database
icon as shown in the screenshot below

11
 Web vs. WPF Tests
 Test Studio provides convenient organization
of Web, WPF, and Manual tests in a single grid

12
 Team Foundation Server
Integration
 Test Studio can be integrated to Team
Foundation Server (TFS) (source control
system)

13
 Exporting Projects to Visual
Studio
 Test Studio projects can be exported in a form
that can be consumed by developers using
Visual Studio
 The Export to Visual Studio Ribbon Bar menu
item creates a Visual Studio 2008,2010 or 2012
project
 Available even
without TFS

14
 TeamPulse Integration
 Test Studio provides
 Enables linking between user stories and
acceptance test criteria in TeamPulse to
functional tests within Telerik Test Studio

15
 MS Test Manager Integration
 Test Studio provides integration with MS Test
Manager
 Supporting continuous integration

16
 Scheduling
 Test Studio allows users to quickly schedule
test lists
 Executed across all available workstations
 Completely independently of any external tools

17
Recording Web Tests
Using the Recording Surface Browser
 Recording Surface Browser
 The Recording Surface Browser provides the
ability to record all your actions against a web
page
 Allows identifying specific elements in the page
and handling many common dialogs that might
pop up

19
 Recording Surface Toolbar
 The Recording Surface toolbar controls your
interaction with the browser page
 Provides the following options:
 Back to Host
 Enable Highlighting
 Pause Recording
 Record
 Refresh Recorder
 Show DOM Explorer
20
 Elements Menu
 The Elements Menu provides quick access to
relevant functions right in the page you are
testing

21
 Browser Resolution
 Browser Resolution
 If the highlight appears offset from the element
it should be surrounding, make sure that your
browser zoom level is set to 100%
 In the screenshot below, the zoom level is 90%

22
 Common Tasks Menu
 The Common Tasks Menu allows you to
associate an element in the Recording Surface
to a common task
 You can add the element
to the Elements Explorer,
the 3D Viewer or the
DOM Explorer

23
 Test Steps
 The Steps Pane allows working with individual
steps in the test, the step's elements and any
code for the test

24
 Adding Test Steps Manually
 There are some steps that have to be added
specifically
 Test as Step lets you run another test as a single
step
 Script Step adds a coded
step to the test and
opens the code editor

25
 Additional Steps Options
 The More... button provides additional steps
to add to your test:
 Browser Capture,
 Desktop Capture
 Execution Delay
 Custom Annotations
 Clear Cookies
 Wait for Url
 Inspection Point
 Comment
 Manual Step
26
 Translators
 Translators are extensions that open up an
element to work with Test Studio
 The translator describes the actions of an
element that can be automated and
verifications that can be performed
 Test Studio ships with basic translators for
HTML and Silverlight, and translators built
specifically for AJAX and Silverlight
RadControls

27
 Drag and Drop
 Drag and drop of any element in a web page
can be automated
 I.e. simple HTML elements, RadControls for
ASP.NET AJAX and Silverlight elements
 There are two ways to automate a drag and
drop operation
 Dragging elements directly with the mouse in
the Recording Surface
 Using the Elements Menu Drag and Drop option

28
 HTML Popups
 HTML popups are detected by Test Studio
automatically
 When an HTML popup is about to appear, Test
Studio allows you to automate the popup

29
 Win32 Dialogs
 You can respond to a number of common
Win32 dialogs using the Recording Surface
"Dialogs" drop down list

30
 Logon
 Some web pages may require a user name and
password to gain access
 The logon handler fills in the
user name and password and
then clicks the OK or Cancel
button to close the dialog

31
 Verification
Verifying Elements' State
 Verifications
 Test Studio verifications allow detecting if
elements are in a particular state (e.g. visible,
exist)
 Also that attributes and properties compare
with specific values
 Test Studio can verify:
 Content, attributes, styles, visibility, drop-down
list selections, checkboxes, radio buttons, tables
and Silverlight property values

33
 Verification Sentences
 Test Studio implements verification through
"sentences" that compare a portion of an
element to a value
 E.g., "textbox content is equal to 'order 8599'"
 "image path contains 'http://www.falafel.com'"

34
 Sentence Verification Builder
 The Sentence Verification Builder
 Allows interactive building of verification rules
and validating them against a live web
document

35
 Sentence Structure
 The structure of the "sentence" changes
according to verification type
 Here are the general structures for some of the
basic verification types used against HTML
elements
Verification Type Structure
Content Content Type-Compare-Value
Attribute Attribute Name-Compare-Value
IsVisible Value
Style Inline/Computed-Category-Attribute-Compare-Value
DropDown Attribute Name-Compare-Value

36
 Verification Types
 IsVisible
 Test Studio determines visibility by following
the CSS chain
 Analyzing "visibility" and "display" attributes
for an element

37
 Verification Types (2)
 Content verification
 Test some portion of element content against a
string of characters
 Content type
 Comparison
 Value

38
 Verification Types (3)
 Attribute verification
 Allows high flexibility against any attribute in
an element
 The attribute name drop down lists all the
attributes in the element
 When an attribute is selected, the Value will
automatically populate with appropriate
matching text

39
 Verification Types (4)
 Style verification
 Has a relatively complex sentence structure

 DropDown verification
 The DropDown verification has built-in
attribute types "ByIndex", "ByValue" and
"ByText"

40
 AJAX and Silverlight (5)
 Test Studio provide easy testing for AJAX and
Silverlight by way of the consistent Sentence
Verification Builder interface
 Instead of looking at the HTML DOM, we're
able to test against Silverlight elements in a
XAML (Extended Application Markup
Language) document

41
 3D Viewer
 3D Viewer
 The 3D Viewer is an innovation that saves time
by handling verifications for multiple elements
all at one time

42
 Extraction
 Extractions can be added in order to be reused
later in the tests
 Available form the "Quick Task“ menu

43
 Extraction
 Extracted parameter is stored in a variable
 We can name our stored variable
 We can refer to the variable by its name
Name used to
refer to the
variable

Name we give to
the variable

Referring to the
stored variable

44
 Logical Steps
 The flow control in Test Studio can be
implemented through logical steps
 If…else
 While…loop
 loop

45
 Elements Explorer
 The Elements Explorer is similar to the DOM
Explorer
 it displays a tree of elements
 Elements may be used in several tests and test
steps

46
Test Organization
Using Test Lists
 Test Lists
 Test Lists
 Useful for getting the best use of recorded tests
by allowing the reuse of tests in more than one
configuration
 E.g., using a small selection of tests as a "Smoke
Test"
 Collecting tests that a particular QA engineer is
responsible for
 Listing all the tests for a category of functionality

48
 Static Lists
 Static lists
 Can be manually built from existing tests and
manually set the order that the tests should run
 When the Test List executes, each test runs in
order, exactly as configured

49
 Dynamic Lists
 Dynamic Test Lists automatically select tests
from your project at the time of execution
 Using rules about properties of the individual
tests
 Warning – Dynamic Test Lists cannot be ordered
 Therefore only independent tests should be
grouped dynamically

50
 Editing Test List Settings
 Test Studio allows editing the following
properties:
 Annotation
 ASP.NET
 Browser
 Desktop
 Execution
 HttpProxy
 Log
 Navigation
 Silverlight
51
Working With Test Results
Analyzing and Sharing Test Results
 Test Results Calendar
 The calendar view of test results makes it easy
to see the tests that passed or failed in a
month, week or day

53
 Analyzing Test Results
 The TestResults panel allows traversing test
execution results, drilling down to the
individual test step and back up again to the
test list level

54
 Step Failure Details Dialog
 The Step Failure Details dialog collects all the
information related to a single failed test step,
including failure details, screenshots, and a
snapshot of the DOM

55
 Exporting Test Results
 Test results become truly useful when they are
pushed out to the members of your
organization
 The Export tools allow you to create Word or
Excel versions of the entire Test List
 With TFS a selected run result
can be made accessible to
others by pushing out the
results to TFS

56
Web Application Tests
Handling Issues of
Web Testing
 Web Application Tests
 Testing a web application is quite a bit more
difficult than testing the same functionality in
a Windows Desktop application
 Specific issues are encountered:
 Timing difficulties
 Differences between browsers
 New technologies make web browsing a rich, but
difficult-to-test, experience

58
 JavaScript
 Test Studio can trigger specific JavaScript
events as test steps
 Use the Elements Menu,
JavaScript Events button
to invoke and choose from
available events

59
 AJAX
 One of the principal ways AJAX can be handled
in Test Studio is by waiting for a particular
element to reach some state
 E.g. "text content = '1234'"

60
 Setting "Wait" Steps
 Test Studio allows changing any verification
step to a "wait" step
 A wait step can be added from the Elements
Menu Quick Tasks
 Another way is by right-clicking the verification
test step and selecting Set as Wait from the
context menu

61
 Setting "Wait" Steps (2)
 The verification step, when acting as a wait,
has a few properties:
 CheckInterval
 The number of milliseconds between evaluations
of the verification
 Timeout
 The number of milliseconds before the test step
will fail when used as a wait

62
 Setting "Wait" Steps (3)
 The verification step, when acting as a wait,
has a few properties:
 WaitOnElements
 indicates that the test step should wait
WaitOnElementsTimeout milliseconds for step
elements to exist before executing the test step
 SupportsWait, IsWaitOnly and StepType
 Read-only properties that indicate the way this
test step can be used

63
 RadControls for ASP.NET AJAX
 Testing RadControls for ASP.NET AJAX is s bit
different from any other control
 Due to the translators provided by Telerik
 Test Studio provides set of verifications and
Quick Tasks for RadControls

64
 Silverlight
 Test Studio is the first scriptless record and
playback solution for Silverlight
 With Test Studio you can build a single test case
that interacts with both HTML and Silverlight
elements, even on the same page

65
 Silverlight
 How Does Test Studio address Silverlight
testing Issues?
 Identification
 Identifying and locating elements by criteria or
combination of criteria other than name – e.g.,
text, partial text or element type
 Synchronization
 Even animated elements can be waited and
checked
 Reveal Control Internals
66
Data Driven Tests
Driving Your Tests
Using Data Sources
 The Built-In Grid
 The built-in grid allows you to build simple, ad-
hoc, data-driven tests
 This functionality is very simple
 It is not expected to connect to an external
database
 Has multiple tables or provide fine tune control
over looping or branching

68
 Connecting to External Data
 Test Studio allows connecting to a variety of
data types
 Standard "*.csv" comma delimited files, Excel
"*.xls" files , XML files and database tables
 The main steps to drive a test with data are:
 Add a data source
 Bind the data source to a test as a whole
 Bind a specific piece or column of data to a
property in the test

69
 Data Driven Tests
Demo

 Using the built-in

 Connecting to
external data
 Telerik Test Studio

?
?
?
? ?

Questions?
?

?
?
?
?
?
 Exercises
1. Make a new test project called Telerik.
Record a new test called TelerikAcademy that
searches in Google with keyword Telerik Academy.
Verify the text "Telerik Academy" is present among
the search results. Click the link provided by the first
search results and navigate to the Telerik Academy
web page. Verify the presence of the text
"Предстоящи курсове".
Do not forget to enable the option "Hover over
highlighting" in the Recording Surface Toolbar
 Exercises (2)
2. Record a test that navigates to www.yahoo.com and
perform the following actions:
 Verify that the Yahoo! logo in the upper left corner is
presented - using its href attribute
 Verify that the mail link is presented on the page and
click it
 Enter wrong username and password and click on the
"Sign in" button
 Create a manual step to handle the captcha
 Verify the presence of the text "Invalid ID or password"
 Exercises (3)
3. Record a test that navigates to http://
www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSi
te/ValidatorCallout/ValidatorCallout.aspx
.
Enter the name "Petar Petrov" and phone (088) 888-
8888 in the fields of the ValidatorCallout
Demonstration. Press the "Submit" button.
Verify that the massage "Thanks Petar Petrov, we'll
give you a call at (088) 888-8888." appears.
The message is generated using AJAX so you have to
set "wait" steps
4. Try your own tests with some of the rest AJAX
 Exercises (4)
5. Record a test that navigates to the Telerik Silverlight
demo page http://demos.telerik.com/silverlight/#
ComboBox/FirstLook
Wait for the page to be loaded, verify the presence of
the "Online Book Store" header.
Verify the presence of the "Technology" drop-down
list. Choose one of the elements of the drop-down list
and after that verify that the same value appears as
chosen on the drop-down list button.
Repeat the last steps with the "category" drop-down
list.
 Exercises (5)
6. Try your own tests with some of the rest Silverlight
control samples.
7. Record a test that searches for a set of different
animals in Google and verifies the keyword is
present among the search results. Use the built-in
grid and create a database of keywords (animal
names) to be used for searching.
8. Group the tests recorded in the previous exercises in
test lists – make one static and one dynamic list.
Run the test lists and check the results in the test
calendar
 Exercises (6)
9. Read more about Telerik Test Studio from the
Telerik's web site:
http://
www.telerik.com/automated-testing-tools/support
/documentation.aspx
10. Watch the video tutorials about Telerik Test Studio
from here:
http://
www.telerik.com/automated-testing-tools/support/
videos.aspx