Skip to main content

Visual Recorder

The visual recorder lets you create automation scripts by interacting with a live browser. Instead of writing code, you click, type, and navigate -- and hidettp captures every action as a replayable step that gets converted into a SeleniumBase Python script.

What It Is

The recorder is a VNC-based browser session embedded in the hidettp interface. When you open the Record tab on a bot, a live Chrome instance loads your bot's target URL. You interact with the page naturally, and the recorder captures each action as a discrete step in a sidebar panel.

This approach is ideal for:

  • Building automations without writing code.
  • Quickly prototyping a workflow before refining the script.
  • Capturing complex UI interactions that are tedious to code by hand.

How to Use the Recorder

  1. Open a bot and navigate to the Record tab.
  2. A live browser session starts with your bot's target URL loaded.
  3. Interact with the page:
    • Click buttons and links.
    • Type into input fields.
    • Scroll through content.
    • Select options from dropdowns.
    • Navigate between pages.
  4. Each action appears as a step in the step list on the side panel.
  5. When finished, review the steps, then save or generate a script.

Supported Step Types

The recorder supports a comprehensive set of step types:

Step TypeDescription
navigateGo to a specific URL.
clickClick on a page element.
typeEnter text into an input field.
scrollScroll the page or a specific element.
keypressPress a keyboard key (Enter, Tab, Escape, etc.).
selectOptionChoose a value from a dropdown menu.
extractCapture data from a page element for output.
waitForElementPause execution until a specific element appears on the page.
assertElementVerify that an element exists or contains expected content.
solveCaptchaTrigger automatic captcha solving via configured provider.
requestHumanPause the bot and request human intervention.
downloadFileCapture a file download triggered by an action.
loopRepeat a sequence of steps (e.g., iterate over a list of items).
dateSelectInteract with a date picker component.
timeSelectInteract with a time picker component.
paramInputAccept a runtime parameter (used in action bots).

Element Picker

When you click on an element during recording, hidettp captures a CSS selector for that element. The system uses a self-healing selector approach:

  • Multiple locator strategies are captured for each element (CSS, XPath, text content, ARIA attributes).
  • During execution, if the primary selector fails (because the page structure changed), the runner automatically falls back to alternative locators.
  • This makes recorded automations more resilient to minor page updates.

You can also manually edit selectors after recording if you need more precise targeting.

Extract Steps

Extract steps define what data to pull from the page:

  1. Add an extract step to the recording.
  2. Click on the element containing the data you want to capture.
  3. Define a field name for the extracted value.
  4. Optionally use AI-powered output formatting to structure the raw extracted text into a cleaner format (e.g., parse a price string into a number, normalize dates, or restructure HTML table data into JSON).

Extracted data is attached to the execution results and delivered via webhooks if configured.

Captcha and Challenge Detection

The recorder includes automatic detection for common bot protection systems:

  • Cloudflare challenges and turnstiles.
  • DataDome protection.
  • CAPTCHA challenges (reCAPTCHA, hCaptcha, image CAPTCHAs).

When a challenge is detected, the system can automatically insert a solveCaptcha step or alert you to handle it. Captcha solving requires a configured provider (2Captcha, Anti-Captcha, hCaptcha, or CapMonster).

Editing Steps

After recording, you have full control over the step list:

  • Reorder -- Drag steps to change their execution order.
  • Edit -- Modify a step's selector, value, timeout, or other properties.
  • Delete -- Remove accidental or unnecessary steps.
  • Add -- Insert new steps manually (e.g., add a wait condition between two clicks).

Fine-tuning steps after recording is a common workflow. The recorder captures the broad strokes; editing lets you handle timing, edge cases, and precision.

Replay Mode

Before committing to a script, you can replay the recorded steps to verify they work:

  • Click Replay to execute the steps in sequence on a live browser.
  • Watch each step execute and confirm the automation behaves as expected.
  • If a step fails, you can identify the issue, edit the step, and replay again.

Replay uses the same execution engine as production runs, so what works in replay will work in a real execution.

Script Generation

Recorded steps are automatically converted into a SeleniumBase Python script. The generated script:

  • Uses the same step sequence you recorded and edited.
  • Includes self-healing selectors with fallback strategies.
  • Is fully editable in the Script tab if you need to add custom logic, error handling, or conditional branching.

This makes the recorder a powerful starting point -- record the happy path, then refine the script for robustness.