#2 First Trace


This tutorial shows you how to automate testing for one of the most critical functionalities on a web site - the login. If login doesn’t work, users cannot access their accounts on the site.

Section outline:

1. Set The Base URL & Open Editor

Target the Base URL (1) to the web site you would like to test. In this tutorial we’ll use http://testsite.usetrace.com.

Open the editor by clicking “New Trace” (2).

2. Editor

This is the Editor where you create and maintain the traces for your test automation.

3. Virtual Browser

The large box is the Virtual Browser which opens the web page that we just defined (Base URL). The Virtual Browser runs in the Usetrace cloud and you can use it like a regular internet browser. For example you can change the address, browse the site, click, type, scroll, open the developer tools etc.

Above the Virtual Browser window, you can select which type of browser to run the trace with.

4. Trace Steps

On the left, you see the trace. A trace consists of steps starting from top to bottom. Now we only have the first step which opens our site. Below it we see a box which says ‘Start Recording’. This box is called the Pointer.

5. Pointer

The Pointer adds steps to its location in the trace. In the Pointer you can choose which type of step to add. The default mode is to record steps automatically.

You can also add steps to Hover with mouse, Check content, Open Email and Wait (see editor/steps).

6. Navigating to Login Form

Now, click login link with your mouse on the web page.

7. Filling Form

Fill out the form with “john.doe@example.com”. As we interact with the site, the Pointer adds steps to our trace (2). After clicking the login button, you’ll see that the completed form is shown as a single step.

8. Adding Check

To verify that we are logged in after submitting the correct credentials, add a check step to see if the “Logged in as” text is present.

Select check mode from the pointer (1) and click on the “Logged in” text on the web page (2).

9. Running Trace

Run the trace to make sure it works. To run the trace with Chrome, click on the Chrome icon (1).


After the run is finished the result is indicated at the end of the last step (2).

10. Change Trace’s Name

Finally, we’ll name the trace by clicking the current name “Trace 1” and typing the new name “Login”.

Now we have created a trace that can automatically test the login functionality on a web site with all the supported browsers.