Build a Web Test

This tutorial walks you through a simple web test from start to finish: create a web test solution, record a few actions, add a validation, run the test, and review the report.

Your test contains the following steps:

1. Start the browser and open the URL www.ranorex.com/web-testing-examples/
2. Check if the Ranorex Studio logo is displayed at the top.
   
3. Click Open dialog.
   
4. Click OK to confirm and close the dialog window.

Note
In automated tests, using the action Close application is usually more robust than closing an application “manually” by clicking the X in the application window. This is why the default web test project uses this action.

1. On the Ranorex Studio Start Page, click New test solution using wizard… or go to File > New > Solution using wizard…
2. Select Web..
3. Follow the wizard instructions:
   1. Name your solution (example: WebTest).
   2. Select a browser (the example uses Firefox).
   3. Set the URL to the sample web testing page: www.ranorex.com/web-testing-examples/ 

4. For recording behavior, choose:
   
   - When asked to select the recording behavior, select Add browsers to whitelist, as our test will only cover interactions with the previously selected browser. 

   - If you are going to interact with desktop applications and want this in your test,  select Do not use whitelisting.

5. Click Finish. Ranorex Studio opens the prepared solution.
   

The prebuilt web test looks like this:

1. Test suite view: This is where you build and control your tests.
2. The solution includes a test suite project with a simple prebuilt test suite structure. It contains a test case with three recording modules: OpenBrowser, which starts the browser and navigates to the URL; Recording1, which is empty and ready for you to record test actions; and CloseBrowser, which closes the browser.
3. Recording module view: In the recording module view of Recording1, you can record and manage test actions.
4. Empty actions table: This is where your recorded actions appear.

Before recording, ensure the selected browser is open, and the sample URL is already loaded www.ranorex.com/web-testing-examples/. Don’t record these steps if the project already includes them in the prepared modules

1. In the recording module view, click RECORD. Ranorex Studio minimizes.
2. The Recorder control panel appears in the bottom right.

Validate the logo

1. In the Recorder control panel, click Validate.
2. Select the Ranorex Studio logo and click it when the purple frame surrounds it.
   
3. The Select element window opens. Check if the correct image has been selected and click Next to confirm.
4. The Validation settings open. We’re checking that the logo exists and is visible. Both of these attributes should already be selected. Click OK to confirm.
   

Open and confirm the dialog window

1. In the browser, click Open dialog. A simple dialog window opens.
   
2. Click OK to confirm and close the dialog.
   
3. Finally, in the Recorder control panel, click Stop to finish the recording.

Results

The control panel disappears, and Ranorex Studio comes back into focus, showing the following:

1. Action table with three recorded actions.
2. Repository with repository items referencing the three UI elements interacted with during the recording.

Let’s run the test and review the test run report.

1. Close all instances of Firefox.
2. Click the tab WebTest.rxtst to switch to the test suite view and click RUN.

Report

Once the test run has finished, the report displays. In our case, it should look like this: