Rating: 4 out of 5 stars
Website: www.telerik.com
Price: $1,499 for Developer Edition, $2,499 for QA Edition
The latest version of Telerik's WebUI Test Studio, 2.0, includes a number of enhancements and new features that make revisiting the product worthwhile. (See my review of version 1.0, "Telerik WebUI Test Studio.") I'll look at the key new features in version 2.0, which include the addition of Silverlight support and a number of other improvements.
Silverlight Integration
WebUI Test Studio 2.0 supports automated testing of Silverlight applications, in addition to the product's support for ASP.NET testing. With the addition of Silverlight support, testing of a Silverlight application can recorded and automated using the WebUI Test Studio Design Canvas. Here's a summary of the key new features.
Silverlight Verification Builder. The Verification Builder performs a large share of the process of verifying elements on a page. Using the Verification Builder, the Design Canvas can now recognize Silverlight elements—that is, it can identify an element's nature and therefore its characteristics. The Verification Builder recognizes these element types:
• XAML elements: attributes, visibility, style, content, and property
• text blocks: text block content, property, visibility, and location
• passwords: verifying password and/or password masking character
• check boxes: state, property, visibility, and location
• radio button: state, property, visibility, and location
• list boxes: ListBox (selected index), property, visibility, and location
• combo boxes: ComboBox text, ComboBox number (count and selected index), and ComboBox Editable
• slider: slider values (value, selection start, selection end, small change, large change)
• tab Item: TabItem Text, TabItem Index, and TabItem State (selected, break, hovered)
Unit Testing Frameworks
WebUI Test Studio 1.0 supported NUnit and Visual Studio unit tests. WebUI Test Studio 2.0 now supports XUnit and MbUnit unit tests. With one click you can use any of these supported unit test frameworks for your WebUI tests.
Web Abstraction and New Find Logic
One of WebUI Test Studio's advantages is that it makes test maintenance easy. Web Abstraction is one of the features that make this possible because it enables abstraction of Web Page elements, involved in your Test Explorer actions, to become an entry in your Element Explorer. If, at any point, you need to edit the element entry, you can do so from one place to immediately reflect on all recorded steps that refer to it—which facilitates maintenance.
The Web Page element, when registered, will carry its find expression that specifies the "how" to find the element itself. WebUI Test Studio implicitly does this for you in an optimized way. If you need to edit the find expression, you can do so by right-clicking the element from the Element Explorer. The following components are part of in the find expression:
• element type
• comparison type
• value
• AND/THEN conjunctions:
o AND: The entire ANDed expression must evaluate to true for the element to be successfully found.
o THEN: The find logic targets at finding the element that satisfies the successive find expressions joined by THEN. It then resumes the search on the children of that element.
For flexibility, other actions are provided, such as adding, validating, discarding, or deleting find logic expressions.
Support for Three Browsers
WebUI Test Studio 2.0 now supports Safari, in addition to Internet Explorer and Mozilla Firefox. Let's say you want to automate compatibility testing on different browser types. You can, if you choose, automate your test cases against three browser types by recording your steps once and watching them run against any or all of the three supported browsers.
Robustness
Telerik has made changes in WebUI Test Studio 2.0 that improve the product's robustness. Following is an overview of these improvements.
Handling of pop-up dialogs. One of the main complexities faced in automated testing is the handling of pop-ups and message boxes that hinder the execution of recorded tests. WebUI Test Studio provides several ways to help handle pop-up dialogs and message boxes in your testing automation.
One major enhancement in version 2.0 that helps in this regard is HTML pop-ups handling. In automated testing, a problem occurs when HTML pop-ups cluster within the same browser instance hosted inside Visual Studio. This is because pop-ups, upon opening, tend to capture themselves inside the parent browser instance—so closing them will attempt to close the whole browser instance. Moreover, another problem lies in the inability to transfer information between pop-ups and the main application hosted inside the Visual Studio browser.
WebUI Test Studio 2.0 solves the problem of pop-ups by opening them in a different browser instance, so that they are not confined in the hosted browser. But how can you automate this standalone instance? A Design Canvas recorder tool attaches itself to the independent browser instance, allowing the automation of steps to be appended to Test Explorer actions. The recorder tool consists of the following three buttons:
• the Automation Overlay Surface
• the DOM Explorer
• the Recorder
While recording, when the browser detects an HTML window attempting to pop up, WebUI Test Studio 2.0 asks you whether you want to connect to the pop-up. After you click Yes, a connect to the HTML pop-up step will be added to your test explorer. You'll want to edit the properties of this step to make sure they are correct.
Clearing cookies. In web application software testing, the ability to test state-related problems including cookies is crucial. WebUI Test Studio provides you with the option to clear cookies before or within Test Explorer Actions.
WaitForUrl. The WaitforUrl action is useful when redirecting the flow of your steps to another URL. For instance, you would want to make sure loading is completed before actions on the redirected web page begin execution. To use the WaitforUrl action, in Test Explorer click the Add button in the menu bar. You can customize this step to specify the URL to wait for and the amount of time to wait before reporting a test failure.
Inspection points. At runtime, the inspection points examine the location of the DOM element in the DOM tree. WebUI Test Studio will suspend running of automated test cases until the DOM Explorer is closed. You access this option through the Test Explorer Add button's drop-down menu.
Element Explorer. The Element Explorer detects all Silverlight applications hosted on a single web page. After an action on a control in an application has been recorded, the Element Explorer adds a node to the parent container of the selected control specifying the Silverlight application that it belongs to.
Silverlight timeout setting. When your application is taking a long time to load, you can extend the time for Design Canvas to wait before allowing connection timeout.
Silverlight playback. In WebUI Test Studio, WaitonElement now is available for Silverlight applications, as well as ASP.NET. WaitonElement stalls the execution of test cases for a preset time period, allowing time for the element to become visible on the web page. Additionally, WaitForNoMotion will pause until the element stops its animation in order not to fail execution.
Enriching the Testing Experience
The Design Canvas in WebUI Test Studio 2.0 features has a new skin design and provides a number of enhancements to the overall user experience. Here's an overview of key improvements in this area.
Automation Overlay Surface (AOS). WebUI Test Studio's AOS is a helpful tool in automating testing tasks. Version 2.0 includes improvements that make it easier to work with elements in Design Canvas. Once you've activated the AOS, hovering over any element places it in a rectangle, which denotes the recognition of this element as a specific control. Then, instead of going through the usual practice of right-clicking the element to explore the actions available for it, an element menu, shown in Figure 1, is displayed.
Figure 1: Automation Overlay Surface element context menu
This context menu includes nine buttons (six represent features in the previous version of WebUI Test Studio, three are new features):
• Add element to project element
• Locate element in DOM Explorer
• Open sentence verification builder
• Quick tasks
• JavaScript event
• mouse actions
• drag and drop
• scroll element
• Open element in 3D viewer
Drag and drop. You can drag and drop elements with WebUI Test Studio. To do so, click the Overlay button, which will highlight the target element when you mouse over it. A blue nub pops up to show the element menu. Click the Drag & Drop button to trigger drag-and-drop steps. You have a choice of three actions:
• Choose Element or Window to specify whether you want the coordinates' calculation to be with respect to an element or window.
• Position the crosshairs on the end point.
• Add to project Test Explorer.
Scroll element. The Scroll Element feature is available from the target element's Element Menu. It has two options:
• To Page Top: Scroll the element until it reaches the top of the web page.
• To Page Bottom: Scroll the element until it reaches the bottom of the web page.
3D viewer. The 3D viewer provides these functionalities to improve automated testing:
• display of the element hierarchy through which you can navigate in an image set each of which is specific to an element in the hierarchy
• ability to lock the AOS on any element contained in the hierarchy to access its element menu
• verifications where you can build, filter, or add verification to the Test Explorer list
Working with WebUI Test Studio 2.0
To get a feel for working with WebUI Test Studio 2.0, I'll walk through using the Bug Tracker Demo application provided by the Telerik support team to perform some automated tests and also demonstrate the product's Silverlight integration. The application consists of the following elements:
• a left panel showing the teams and their constituent members
• a middle RadTabControl displaying a bug detail
• a middle panel for viewing bugs
• a right panel comparing assigned bugs for different teams
Automating drag and drop. WebUI Test Studio enables the use of drag and drop within and across TreeViews over tabs and other controls. Let's look at how to use drag and drop for automated testing in the Bug Tracker Demo application.
1. Choose the Martha Clifford entry from the RadTreeView in the left panel to be dropped with respect to an element.
2. Position the crosshairs between the rows of the RadGridView.
3. Add the entry to the Test Explorer project; Figure 2 shows the result.
Figure 2: Adding an entry in Test Explorer
The Browser option in the Test Explorer menu bar allows you to smoothly switch between browser types and run your tests. Figure 3 shows the automated drag-and-drop execution, where the automatic annotation provided by the tool takes you step by step by annotating the coordinates along the way.
Figure 3: Drag-and-drop execution
Ease of locating controls. WebUI Test Studio provides different tools that make it easy to locate controls. The following examples demonstrate using the Hover Over highlighting button, the DOM Explorer, and the 3D-View.
In Figure 4, you can see the use of the Hover Over highlighting button.
Figure 4: Using the Hover Over highlighting button to capture a check box element
The recognition of the check box element is captured. Notice how the embedding of the element inside the parent controls is denoted. The check box occupies the RadTreeViewItem, which in turn occupies a single item of the RadTreeView; correspondingly each has its independent context menu.
Figure 5 shows the DOM Explorer displaying the hierarchy of the previously mentioned elements.
Figure 5: DOM Explorer showing hierarchy of elements
Figures 6A through 6C show, navigating from left to right, the check box element in 3D View.
Figure 6A: Navigating the check box element in 3D View, screen 1
Figure 6B: Navigating the check box element in 3D View, screen 2
Figure 6C: Navigating the check box element in 3D View, screen 3
A Worthy Successor
Telerik's WebUI Test Studio 2.0 is a worthy successor to version 1.0, offering a number of new and enhanced features that make it easier to run your test cases. To check out these features yourself, you can download a trial version of the product on Telerik's website.
Rawane Madi ([email protected]) is a computer science graduate of the American University of Beirut. She started her career as a QC engineer, focusing on software testing for web and Windows applications, at CCC, a multinational construction company based in Athens, Greece.
