In this lesson, we take a look at the transaction Step Editor, and we explore the different options for creating and editing your transaction scripts using the Step editor. In the next lesson, we will have a step-by-step example to show you how to use the Step Editor and test your transactions.

For those of you confident in scripting, you can also use our scripting text editor or API to manage your scripts.

Remember, if you become uncomfortable anywhere in this process, you can always contact support and ask for help. You can also ask them to refine and test the script for you. (Now that is easy!) You will want to make sure you're familiar with the script review policy if you choose to use the Full-service Transactions scripting option.

Steps and Actions

When you open a transaction monitor or create a new transaction monitor, you'll notice a tab called, Steps (see figure below). You refine and test your transaction script in the Steps tab, or you can write your script from scratch here as well.

If you imported your script from the Transaction Recorder, you should see one or more steps with actions already defined (see figure below). If you're creating your script from scratch, you will build out each step in your transaction using the step editor or the text editor. (Use the Transaction Recorder; why do all of that extra work?)

Your transaction script is made up of steps and actions. Let's take a closer look at what we mean by steps and actions.

screenshot: steps tab
Note: Each monitor uses a certain number of transaction credits. Uptrends uses transaction credits to price your transaction monitor. Some actions or options use transaction credits, and you'll notice we point them out as we move forward. You can find a full explanation of how Uptrends calculates the number of credits you need for a transaction monitor in the Knowledge Base.

What is a Step?

When you import your script from the Transaction Recorder, Uptrends automatically defines your steps for you, but what are steps? A step is an arbitrary grouping of actions in your transaction script. Typically, you want to group actions into steps that end with a server request such as a form submit. Grouping actions by server submits/requests helps with troubleshooting and performance reporting.

You could also think of a step as a state transition in the browser, i.e., an action that results in a new page or refreshes the page with new content.  But really, you can set up your steps to reflect whatever grouping makes sense to your use case and your reporting needs.

Step settings/options

Clicking on the arrow > next to a step name allows you to access the step settings (see below).

Screenshot: Step settings dialog

Within each step, you have several settings, most settings are optional.

  • Waterfall: You can add an optional waterfall report to any step to see the performance for the page load. Each waterfall report added to a transaction script uses one transaction step credit.
  • Screenshot: An optional screenshot lets you see the screen as experienced by your user at the end of the step. A screenshot uses one transaction step credit.
  • Name: Each step needs a name. The more descriptive you make the name, the better. For example, "Add to cart," "Log in," or "Request appointment time."
  • Error handling: Sometimes, you don't want page errors to stop your script. By checking the box, Uptrends continues to the next step regardless of the result from the current step. Your check detail report shows the error, but the transaction continues despite the error.
 

Adding Steps

To add a new step to your script:

  1. Scroll to the bottom of the Steps tab.
  2. Click the Add step button.
  3. Name the new and currently empty step.
  4. Drag the step to the location in the script where you would like the step to take place in your script.

    Animation: move a step
  5. Add actions. (We're getting there next.)

What is an action?

Actions are your user interactions, content checks, and browser interactions that happen within a step. Each step may have many actions. Actions include user interactions such as:

  • Hovering over a page element.
  • Clicking on a page element.
  • Typing in a text box or field.
  • Checking a checkbox or selecting a radio button.
  • Opening a drop-down.
  • Clicking a button.

Actions also include conditional checks or tests such as:

  • Verifying an element or content is or isn't in the page document (learn more).
  • Verify that a page element does or doesn't contain specific content (learn more).
  • Tell the monitor to wait for an element (not dependent on element content) to appear on the page (learn more).

Actions may also direct the monitor to:

  • Take a screenshot.
  • Switch browser tabs, windows, and iFrames.
  • Scroll to a page element.

Adding an action

When you click on the Add action button, you get an interactive list of the available actions (see below). Hovering over the action option gives you more information about that action. Clicking the action adds the action to your step. 

Screenshot: The Actions menu

Once you've added an action to the step, you can drag the action to a different place in the step or to another step.

Animation: move action

Selecting an Action type

Actions fall into three categories as you saw above. The following is a brief description of the available actions. For a complete description and their uses, you will find more in-depth information in the Knowledge base.

  • Interaction
    • Navigate: go to a specific URL (learn more).
    • Click: Locates a page element (buttons, checkboxes, radio buttons) and perform a mouse click. (learn more).
    • Set: locate and fill a text field, text area, password field, etc (learn more).
    • Hover: Find an element and hover the cursor over the element to reveal other hidden page elements (learn more).
  • Test
    • Element content: Find and check an element for specific content (learn more).
    • Document content: Checks the entire page document for specified content (learn more).
    • Wait for element: This looks for and waits for a specified page element (learn more).
  • Control
    • Screenshot: Make a screenshot of the current screen (uses one transaction credit).
    • Switch browser tab: If your page opened another browser window, the switch browser tab action lets you give focus to the new window/tab.
    • Switch frame: Allows you to switch between iFrames on your page.
    • Scroll: Finds a page element and scrolls to the position on the page (especially helpful when using screenshots).

CSS Selectors and XPath queries

The CSS Selectors or XPath queries tell the transaction monitor exactly which screen element it needs to interact with to complete the action. If you used the Transaction Recorder, it has already decided the best method for locating an element on your page (learn more). If you're hand coding your transaction, you need to decide which method is best for your page and write the queries yourself. Learn more about CSS selectors or XPath queries.

Occasionally you may need to alter the values in these fields. If you're comfortable working with CSS selectors or XPath queries, you may attempt to alter the selector or query yourself. If you're not comfortable with CSS selectors and XPath queries, we suggest that you contact support to have them make the needed changes.

If you would like to know more about the algorithm Uptrends uses to decide the best selector for your element, we have an article just for you. 

Action Settings

Your actions have different settings based on the action type. None of the action settings are required.

  • Sensitive values: Hides the value in your test results. Use this for authentication and other information you don't want showing in your check details. (Learn more)
  • Description: A description of what the action does is always helpful when debugging a script. 
  • Failure message: Message you want to be displayed in your test results if this action fails.
  • Error handling: Ignore the error and continue with the transaction. 
  • Wait until: Set conditions on and element before proceeding with the test. (Learn more)
  • Wait timeout: How long should the monitor wait for the condition above before timing out. Learn more.
  • Ignore new browser tabs: New windows, tabs, or popups automatically switch the focus to them. By checking this box, you tell the monitor to ignore those events and stay with the current window. 

Screenshot: Action settings

 

Scripting source code directly

You can always write your scripts in a different editor or environment and cut and paste the script (or write the script directly in our text editor). Use the Toggle to script button at the top of the Steps tab to open the text editor.

Animation: toggle to script text editor

 

Use the Transaction API

You may wish to use the Uptrends' API to create monitors, upload scripts, alter scripts, and check your monitor's status. To learn about all of the available methods please see our article in the Knowledge Base (Documentation coming soon).