Testing web applications by using the Web UI extension of Rational Test Workbench Eclipse Client 8.6
Record, edit, and run web UI tests and evaluate the results
Looking to test a website or a web application that you recently built? Then you have landed in the right place. This article will give you a detailed overview of the Web UI extension of IBM© Rational Test Workbench© Eclipse Client that offers automated capabilities for testing the functionality of your web application, for example, checking whether all the individual controls, such as forms used for receiving user inputs, work as expected.
An automated web UI test is a series of interactions with the web application; these interactions can be automatically executed as part of your testing process. With automated Web UI tests, you run the recorded tests to verify that the web application works as intended. Such automated tests help you accomplish your testing job faster and more efficiently.
These are the primary features of the Web UI extension:
- Automated test generation and end-to-end testing
- Recording, editing, playback, and evaluation of tests, all in one place
- Support for most popular browsers, such as Microsoft Internet Explorer, Mozilla Firefox, and Google Chrome on different platforms
- Logging and reporting of test results
This article will guide you through the process of creating of a Web UI test for a web application, editing it, running it, and generating reports. It will also introduce the concept of "unified testing", which means you can record a Web UI test on one supported browser on a desktop and play it back on another one, or even on a mobile device or emulator.
For testing with the Web UI extension of IBM Rational Test Workbench Eclipse Client 8.6, make sure your test setup meets the following prerequisites:
- Rational Test Workbench, version 8.6. Make sure you include the Web UI extension in the installation.
- Any of the following browsers:
- Microsoft Internet Explorer
- Mozilla Firefox
- Google Chrome
For information on the supported browser versions, see Software Product Compatibility Reports.
Phases in Web UI testing
Testing in the Rational Test Workbench Eclipse Client involves several phases:
Recording: You can record a Web UI test with any of the supported browsers. The Web UI extension records all of your interactions with the web application under test.
Editing: After recording, you can edit the test in a natural language editor. You can use the data view to display and select UI elements from the recorded application. You can add verification points and replace recorded test values with variable test data or add dynamic data to the test.
Executing: You can run automated tests to ensure that the application matches the expected behavior as defined in the verification points. During the run, the test workbench checks each verification point and provides a pass, fail, or inconclusive status. Information about each step is saved in the test results.
Evaluating: You can evaluate the test results through the performance and verification point reports that are generated with the recorded data. You can also design custom reports by using a wide range of counters. Functional reports provide a comprehensive view of the behavior of the web application under test. Performance reports also provide information on the response time for each step in the recording. You can export and validate the reports.
Recording a Web UI test
The IBM Rational Test Workbench helps you create a Web UI test on your desktop. The test workbench automatically enables web browsers and configures the test environment before you start recording tests for web applications.
Before you begin
- While recording a test, wait for each page to load completely. You can remove this extra time when you play back the test; thus, there will be no impact on the performance.
- If you are using Internet Explorer 9 or later:
- To ensure that the browser always loads the web pages in standard mode, add <!DOCTYPE html> to the HTML source.
- To prevent the web application from running in a compatibility mode internally, in Internet Explorer, click Tools > Compatibility View Settings and clear all three check boxes.
Complete the following steps to record a Web UI test:
- In the test workbench, click New > Test
From Recording. Alternatively, on the toolbar, click
New Test From Recording icon.
Figure 1. Recording session
- Click Create a test from a new recording and select Web UI Test.
- Optional: Click Select test type after recording to
first create the recording and, when prompted, select the type of test
to generate from that recording.
Note: This option is available only if you click File > New > Test From Recording.
- If you are recording sensitive data, click Recording Encryption Level and select the encryption level to record. Click Next.
- Click the Create the parent folder icon to create a test project.
- Enter a name for the test. Click Next.
- Select the web browser to use and click Next. The
type of client application defines the recorder to be used.
Figure 2. Recorder settings
- The preferences that you specify on the Recorder
Settings page depend on the browser you selected in the
previous step. Choose the options appropriately.
- If the server requires client SSL authentication, provide the
client certificate keystore for the proxy recorder to be
authenticated by the server as though the proxy recorder were
the client. Select the The server requires a specific
client certificate check box. Specify the file
name and password of the server certificate keystore. If
multiple certificates are required, click Multiple
certificate, and click Add to
specify a certificate keystore file name and password for each
host name and port.
- If you selected Mozilla Firefox or Microsoft Internet Explorer and you intend to also record the HTTP traffic using the HTTP recorder, click Save to add the RPT Trusted Root Certification Authority (IbmRptRootCA.cer) to the Trusted Root Certification Authorities (typically, in C:\Program Files (x86)\IBM\IBMIMShared\plugins\com.ibm.rational.test.lt.recorder.proxy_version\SSLCertificate).
- If you selected Mozilla Firefox, you can choose to use a temporary Firefox profile. This option starts Firefox without any bookmarks, plug-ins, or toolbars that might be associated with your usual profile. Select the Use an alternate Firefox profile check box, and then select Use a temporary Firefox profile.
- The Also record HTTP traffic check box in Advanced helps you capture the performance aspect of the application in the recording. Since you are primarily interested in testing the functional aspect of the application, clear the check box.
- Optionally, specify whether to use an HTTP or SOCKS proxy recorder to review and edit network connection settings that the browser uses, click Advanced and specify the proxy recorder.
- To specify advanced SSL authentication settings, click
Advanced. If you are using the SOCKS
recorder, the RptCertificate.jks certificate is used by default.
- Select The client requires a specific server certificate and click Add to specify the server hostname, port, certificate database path, and the certificate database password for each website that you are planning to test. If you select Generate certificate, for any IP address received by the SOCK proxy that is resolved by one the server hostnames that you listed, the SOCKS proxy uses a generated certificate signed by the RPT certificate authority, thereby ensuring a smooth recording
- If you select Override browser settings, select Accept SSL 3.0, or Accept TLS 1.0, or both.
- If the server requires client SSL authentication, provide the client certificate keystore for the proxy recorder to be authenticated by the server as though the proxy recorder were the client. Select the The server requires a specific client certificate check box. Specify the file name and password of the server certificate keystore. If multiple certificates are required, click Multiple certificate, and click Add to specify a certificate keystore file name and password for each host name and port.
- When the recording starts and the browser is launched, type the address of the web application to test in the browser address field.
- After you finish the user tasks in the browser, stop the recorder. You can stop the recorder by closing the web application under test or by clicking the Stop icon in the Recording Control view.
Editing the Web UI test
Rational Test Workbench has many features that you can use to enhance your test. For example, you can create variables, use datapool, split a test, use custom code, and more. In this article, you will learn how to use a datapool that consists of a list of products and use a loop to run the test multiple times to fetch each product from the datapool.
This is a sample datapool with two products listed.
Figure 3. Datapool editor
Now, associate the datapool with the step in the test where your user will enter the product name in the Search field.
To associate a datapool with the test:
- Select the step that is about a user entering a product name in the search field.
- In the User Action Details pane, select the product name.
Figure 4. Test editor with value that require substitution
- Right-click the name, click Substitute >
Select Data Source, and click
Figure 5. Select data source
- Select the column that contains the product names and click
Figure 6. Select datapool column
- In Select Data Source, select the datapool check box and click
Select. If you are prompted to continue find and
substitute other names, click No.
Notice that the product name is now highlighted in green indicating that the name will be substituted at run time.
Figure 7. Test editor with value that uses substitution
Now, add a loop to the test so that the test runs multiple times to fetch all of the values from the datapool.
To add a loop to the test:
- Select the Launch application node of the test.
- Click Insert > Loop.
- In the Loop Details area, set 3 for Iterations. This
value indicates that the test is set to iterate three times.
Figure 8. Loop editor
You have enhanced the test by adding a datapool and loop to the test. Now, run the test.
Running the Web UI test
Running a test helps you determine whether the application is behaving as expected. After you run a test, you can see a live Web UI report, a performance report, and the test log for the test. You can also generate a functional test report.
Tip: Run the test immediately after the recording and before you edit it, so that you can fix the errors that might result from the recording.
You can run a Web UI test from the same web browser that was used for the recording or from another supported web browsers. When you play back a test on other web browsers, you test the functionality of the app on those browsers. If the same app is to be rendered on a mobile device, you can play back the same test on a mobile device or emulator. Playing back the same test on different browsers, devices, and emulators ensures that the test coverage is complete in terms of the various modes through which the app can be accessed.
When you run a Web UI test on a mobile device, the Rational Test Workbench Mobile Web Recorder is used for playback. This is a browser that is used to play back tests for web apps on mobile devices. For iOS, you must install the Rational Test Workbench Mobile Web Recorder from the Apple store. For Android, when you tap Manage Web Applications on the home screen, you are prompted to install the Rational Test Workbench Mobile Web Recorder. To run a Web UI test on a mobile device or emulator, the device must be connected to the test workbench, must be in passive mode, and you must have run the test from the device at least once.
You can also run the test from a compound test or from IBM® Rational® Quality Manager.
To initiate a test run of a Web UI test from the workbench:
- From the Test Navigator view, double-click the test to open it.
- In the test editor, click Run Test.
- In the Run Configuration dialog box, in the
Run using column, select the web browser or
mobile device on which to run the test.
Figure 9. Run configuration
Only those web browsers that are installed on your computer and supported by the Web UI extension are displayed in the list.
- Click Finish. The selected web browser opens and the test is played back. If you are playing back on a mobile device, the test plays back on the device. Do not perform any action on the web browser or the mobile device while the test is playing back. The statistical and live reports display the live data as the test is played back.
After a test run, the Mobile and Web UI report and statistical report are displayed. The Mobile and Web UI report displays the status of the test run and of each step. If there are any failures, the report displays the failure for each step that failed.
Figure 10. Mobile and Web UI report
The statistical report displays the response times for all of the steps of the test.
Figure 11. Statistical report
The reports are located in the Results folder of Test Navigator view.
You learned how to record, edit, and run a web application test by using the Web UI extension of Rational Test Workbench.