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.
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.
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.
Clicking on the arrow > next to a step name allows you to access the step settings (see below).
Within each step, you have several settings, and 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.
To add a new step to your script:
- Scroll to the bottom of the Steps tab.
- Click the button.
- Name the new and currently empty step.
- Drag the step to the location in the script where you would like the step to take place in your script.
- 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 thebutton, 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.
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.
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, follow the individual links to the knowledge base articles.
- Navigate — go to a specific URL (learn more)
- Click — locate a page element (buttons, checkboxes, radio buttons) and performs 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)
- Element content — find and check an element for specific content (learn more)
- Document content — check the entire page document for specified content (learn more)
- Wait for element — look for and wait for a specified page element (learn more)
- Screenshot — make a screenshot of the current screen (uses one transaction credit)
- Switch browser tab — give focus to the new window/tab, if your page opened another browser window
- Switch frame — allows you to switch between iFrames on your page
- Scroll — find a page element and scroll 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 picked what it thinks is the best method for locating an element on your page (learn more). However, the algorithm doesn’t always pick the best option in all cases, but you can find the other options the recorder chose by clicking the button in the selector value field. 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 change the selector or query yourself by choosing one of the possible selectors recommended by the recorder. Or you may write your own. 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.
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.
- 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.
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 Steps tab to open the text editor.button at the top of the
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).