This guide is for the v2 release of our recorder released Jan. 2020. If you are still using the older version of our recorder, please refer to that documentation. Users that started a trial on January 2, 2020 or later will already be using the new recorder. If you had an account before that date, or were invited by another user that did, and want to try the new recorder, click here for instructions on how to opt-in to the beta.
Starting a new recording
To start a new recording, navigate to Record a Script under Record & Replay, enter the URL you would like to test, choose a resolution, and click “Record Script”. That will launch the recorder, navigate to your URL, and you can begin recording steps.
- Recording Controls: Used to control the recording state.
- Step List: Displays the list of steps that have been recorded.
- Remote Browser: An interactive view used to interact with your website. Also used for playback.
- File Menu: Used to start a new recording, open an existing script, save the current script, or exit the recorder.
- Record: If you are not currently recording a script, you can use this button to start a new recording.
- Playback: Used to preview a test without leaving the recording page.
- Stop: Used to stop an active recording session.
- Add Menu: Used to add manual steps to a test, such as a hover or an expect. See below for more info.
- Settings: Opens the settings dialog. See below for more info.
- Collapse: Press this to collapse the left panel, giving you more room for the remote browser.
- Test Name: Once the script has been saved, it’s name will appear here.
- Step: Adds a synthetic step to the step list. This can be used to group events. Has no effect on playback.
- Hover: Used to initiate a :hover event on an element during a replay. You’ll need to manually add these any time you need the mouse cursor to stay on an element until something happens, such as a menu opening or an animation starting. Clicking the menu item or using the hotkey (F2) will toggle the inspector mode in the remote browser and allow you to choose an element to hover over, without recording the click in the test steps. You can even hover over sub-menus (menus inside of menus) by adding a hover event to the first menu item, then pressing F2 to add a hover on the sub-menu item.
- Add Expect: Add these to a test when you want to verify values related to the page (URL, Title, Cookies, or Web Storage) or values related to a specific element (Text, Attributes, CSS Properties). A dialog will pop-up that will allow you to set different properties for the expect step.
- Page Url: Allows you to expect a value for the current page’s full URL.
- Page Title: Allows you to expect a value for the current page’s <title>.
- Cookie: Grabs the current cookies for the current page, and allows you to validate against the value.
- Local Storage/Session Storage: Grabs the respective key/value pairs from the chosen web storage type and allows you to validate against one.
- Element: Enables the inspector view and allows you to click on an element to select it. You will then see a modal that allows you to setup the expected value. You can also use F3 as a shortcut key to activate the Expect Element mode.
- Think Time: The delay we use in between steps during playback or replay.
- Recorded: The actual delay between steps that was recorded will be used during playback/replay
- Fixed: A fixed time (in milliseconds) will be used during playback/replay (Recommended)
- Random: A random time will be used between steps
- Minimum: The smallest amount of delay currently supported (currently 100 ms)
- Object Identification: Used during playback/replay for finding elements when executing steps. Changing this mode will affect every step for this test. “Let AI decide” is the default and recommended mode.
The step list shows the actions that were recorded for this script. Each action is grouped under the page it was executed on. Every time the browser navigates to a new URL, it will create a new grouping that can be expanded or hidden.
Clicking the arrow on a step will expand the view, showing more steps when it’s a navigation event, or options related to the step otherwise. This allows you to set things like the Object Identification mode for finding an element, change the text sent as keyboard input, or properties related to an Expect.
Clicking the pencil will allow you to do things like record new actions, delete the action, group it under it’s own step, or take a snapshot after executing that action. Record new actions will play the script up to that point and then start recording new steps. This does not overwrite steps that were previously recorded, so you will need to delete those manually if needed. Only the “Add Snapshot” option is available while recording a script. You will have to stop recording in order to choose the other options.