​
Overview

The Supatest Recorder transforms your natural browser interactions into automated steps. Using an intelligent recording toolbar that appears in your live browser, you can capture user actions, assertions, and complex workflows with precision and ease.

​
Prerequisites

  • Valid starting URL or reference snippet
  • Active live browser session
  • Stable internet connection (recommended: >30 Mbps)

​
Getting Started with Recording

​
Starting a Recording Session

  1. Open a test case in the editor
  2. Initialize Live Browser so it’s active and connected
  3. Click Record in the editor
  4. The recording toolbar appears in your browser

​
The Recording Toolbar

When recording begins, a comprehensive toolbar appears in your browser with the following controls: Recording toolbar Recording toolbar

​
Toolbar Controls

ControlFunctionDescription
Assert TextText assertionToggle to add text verification assertions
Assert URLURL assertionVerify current page URL matches expectation
Check VisibilityElement visibilityAssert element visibility state
Wait for TimeoutManual waitAdd explicit wait periods
Wait for NavigationPage transitionWait for page loads and navigation
Hover ModeHover activationToggle hover recording mode
Move ToolbarRepositionDrag to move toolbar position

​
Toolbar Positioning

  • Moveable: Drag via the move handle
  • Non-intrusive: Avoids interfering with your app
  • Always accessible: Stays visible during recording

​
Implicit Recording (Automatic Capture)

The recorder automatically captures these user interactions:

​
Mouse Actions

  • Single left clicks
  • Scrolling
  • Drag and drop (native HTML5)

​
Input Actions

  • Text entry in inputs, textareas, and contenteditable elements
  • Checkbox/radio selections and dropdown choices

​
Automatic Wait Detection

  • Detects longer interactions automatically
  • Any pause over 10 seconds adds a wait step

​
Explicit Recording (Manual Actions)

Some actions require manual activation in the toolbar:

​
Hover Interactions

  1. Activate Hover mode
  2. Hover the target element
  3. Click to capture the hover action
  4. Deactivate Hover mode

​
Assertions and Validations

  • Text verification via Verify Text
  • URL verification via Verify URL
  • Visibility checks via Check Visibility

​
Manual Wait Controls

  • Timeout waits via Wait for Timeout
  • Navigation waits via Wait for Navigation

​
Tab Management During Recording

​
Switch Tab Behavior

Tab switching requires manual action in the live browser:
  1. Physically click the new tab in the browser
  2. Recorder detects the switch
  3. A Switch Tab step is added automatically
  4. Tabs are auto-named (tab_1, tab_2) or can be renamed

​
Recording Highlighter

  • Highlights interactive elements
  • Captures screenshots per action
  • Helps identify recordable elements

​
Advanced Recording Features

  • Smart wait detection
  • Selector optimization
  • Step description generation

​
Troubleshooting

  • Check live browser connection if recording won’t start
  • Ensure proper test case setup and WebSocket connectivity
  • Use the element picker for precise selection
  • Review automatic wait detection if steps are missing