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.