Requirements

Prerequisite knowledge
Familiarity with basic test automation concepts will be helpful. Knowledge of Flex applications and Flash Builder will be needed to introduce a defect into the sample application.
 
User level
Intermediate
Required products
Flash Builder (Download trial)
Sample files
Calculator.zip
Additional required other products
 
RIATest 4
 
This article explains how to begin testing your Flex application with RIATest 4. RIATest (see Figure 1) is a multiplatform test automation tool that uses the Flex Automation Framework to automate user interactions with GUI components in Flex applications. It uses a simple scripting language that is similar to ActionScript. RIATest can automate Flex 2, Flex 3, Flex 4.x, and Flex 4.5.x applications. Both browser-based and desktop AIR applications are supported.
 
Figure 1. RIATest 4 after startup.
Figure 1. RIATest 4 after startup.

In this article, you are going to create and execute an automated test for a basic browser-based Calculator application, which is included with the sample files for this article.
 
To test a Flex application you need to perform the following four steps:
 
  1. Create a RIATest project.
  2. Record a test.
  3. Run the test.
  4. Check the result.

 
Creating a RIATest project

A set of test scripts for your application is called a project. The project defines the scripts themselves and in what order they will be executed. In RIATest, the Project View shows the Project Tree, which contains all scripts in the project. You can combine scripts into groups. You can change the ordering of the scripts (and thus the execution order) by dragging and dropping script items in the tree.
 
Before you create your first project, you'll need to set up a Flex application to test. Download the sample file for this article, Calculator.zip, and import it into Flash Builder.
 
Next, after downloading and installing RIATest, follow these steps to create your first project:
 
  1. Start RIATest 4 and choose File > New Project.
Figure 2. The New Project dialog box.
Figure 2. The New Project dialog box.
  1. In the New Project dialog box (see Figure 2), select Flex Application Testing as the Project Type.
  2. Type Calculator as the Project name.
  3. Specify a project folder, which will be used to store the project assets.
  4. Select In Browser, Using Local Loader as the Loading Type.
This is the simplest of the Loading Type options available for Flex applications. With this option selected, RIATest will open a special preloader called Runtime Loader in the browser, which will in turn load your application SWF file for testing.
 
  1. Select the application SWF file that you are going to test and the Flex SDK that you used to build it.
  2. Click OK.
A new RIATest project will be created at the specified location and an empty Startup.rts test script will be added to it (see Figure 3).
 
Figure 3. The new project with an empty Startup.rts script.
Figure 3. The new project with an empty Startup.rts script.

You can now launch the Flex application in preparation for recording your first test.
 
  1. Click the green Launch button from the toolbar.
The browser opens and the application is loaded. You can see the Calculator application in the browser, looking exactly as it would normally. In addition, the RIATest Agent toolbar is also visible. The Agent toolbar title indicates that RIATest is Ready (see Figure 4).
 
Figure 4. The application under test running in the browser.

Figure 4. The application under test running in the browser.

Recording a test

You can now start recording a test.
 
  1. Click the red Record button on the Agent Toolbar (see Figure 5).
Figure 5. The Record button in the Agent Toolbar.
Figure 5. The Record button in the Agent Toolbar.

At this point, you can start interacting with the Flex application just as if you were using it normally. All of your actions will be recorded. For this example, you'll calculate 12+15, and then convert it to hexadecimal using the Radix drop-down list.
 
  1. Click the 1, 2, +, 1, 5, and = buttons.
  2. Select Hex as the Radix.
  3. Click the Record button to stop recording, and return to the RIATest IDE to see what has been recorded (see Figure 6).
Figure 6. The recorded test script.
Figure 6. The recorded test script.

As you can see, several lines of script have been recorded. Each line corresponds to an action that you performed on the application. For example when you clicked the down arrow of the drop-down list, line 7 was recorded:
 
SparkDropDownList("radix")=>open();
This line says that an open action was performed on a SparkDropDownList component named radix .
 
Next, you'll add a verification statement to your test. Verification statements are normally added to your tests when you want RIATest to verify certain properties of the application's user interface components during execution of the test. Failures will be reported if the properties do not match the expected values. There are a number of different verification statements, which are documented in the RIATest manual. In this example, you'll use a basic verification statement to verify the result of the calculation.
 
  1. Go back to the Flex application and start recording again.
To add a verification for the calculation result field, you use the RIATest Inspect function and point to the result field that you want to verify.
 
  1. Click the Inspect button on the Agent Control bar.
  2. Move your mouse pointer to the result field. You can see that as you move the pointer, various components are highlighted.
  3. For this example, click the result component, SparkTextInput("editNum") . The RIATest Object Inspector (see Figure 7) appears.
Figure 7. The RIATest Object Inspector window.
Figure 7. The RIATest Object Inspector window.

You can see the tree of GUI components on the left, with the editNum field selected and the properties of the component listed on the right.
 
Next, you'll add a verification for the text property of the result field to ensure that it has the value 1B .
 
  1. Click the green Verify button.
Another window appears that lists the properties of the result text field (see Figure 8).
 
  1. Select the properties that you want to be verified during the test. By default, the text property is selected for verification so simply click OK.
Figure 8. The interface for selecting properties to verify.
Figure 8. The interface for selecting properties to verify.
  1. Return to the RIATest IDE.
You can see that a verifyEqual statement has been created (see Figure 9). This statement will verify the text property of the editNum element during the playback of the test.
 
Figure 9. The new verifyEqual statement.
Figure 9. The new verifyEqual statement.

You have finished recording your first test.
 
  1. Stop recording and click the Terminate button to close the browser.

 
Running tests and checking results

You have created a project and recorded the first test. Now you're ready to run the test and see the results.
 
  1. Click the Run button in RIATest.
The browser window opens, the application is loaded, and the actions that you recorded are performed on the application. Wait until the test is finished and the browser window is closed.
 
The results of the test are shown in the RIATest IDE. You can see the duration of the test and that the overall result is ALL OK (see Figure 10).
 
Note: If you are using the trial version of RIATest, you will see WARNINGS FOUND instead of ALL OK, and in the execution log you'll see a warning that reminds you when the trial will expire.
 
The results also include statistics for startup, shutdown, and each script in the project. In this case, there is only one script in the project. You can see that 8 actions and 1 verification were performed.
 
Figure 9. The new verifyEqual statement.
Figure 10. The test results.
  1. Click the script name (Startup.rts) to see the execution details for the script (see Figure 11).
You can see the actions and the one verification that you defined. If you click a line number, RIATest will show the actual script line that corresponds to the message.
 
  1. Click Line 9.
You can see that the verification was generated by the verifyEqual statement that you created earlier.
 
Figure 11. The execution log for the script.
Figure 11. The execution log for the script.

To see how RIATest reports errors, you'll need to change the application so that it no longer works correctly.
 
  1. Start by opening the Calculator.mxml file in Flash Builder.
  2. Locate the following line in the Calc() function:
case '+': res = lastVal + val; break;
 
  1. Replace that line with this:
case '+': res = lastVal + val + 1; break;
 
  1. Build the application.
Now you can run the test again and see how RIATest identifies the problem in the application.
 
  1. In RIATest, click the Run button.
The test starts running and then the RIATest IDE appears (see Figure 12). You can see that the execution is suspended on the verifyEqual statement and an error message is displayed. The message says that the text of the editNum field does not match the expected value.
 
Figure 12. The error identified in RIATest.
Figure 12. The error identified in RIATest.
  1. To continue execution, click the Run button once again.
The results of the test now indicate that errors were found (see Figure 13).
 
Figure 13. Execution results for the failed test.
Figure 13. Execution results for the failed test.
  1. Scroll down, and you'll see that line 9 generated the error.

 
Where to go from here

That's all there is to it. You have successfully created a simple RIATest project, recorded a test, run the test, and checked the results.
 
Take a few minutes to explore RIATest further. You can create a new test by right-clicking the project and selecting Add New Script. You may want to create another project and start testing your own Flex application.
 
Functional testing and regression testing can be time-consuming and error-prone when performed manually. Automating these tests using RIATest is a straightforward way to save time and ensure your tests are completed accurately every time.
 
For more information on RIATest, visit www.riatest.com.