1 Introduction

FlowMint Recorder is a browser extension that lets you record clicks, typing, navigation, and more, add assertions (text, visibility, URL, etc.), and export tests to JavaScript (Playwright), Python, Java, C#, or Ruby. You can run tests with data-driven CSV/JSON and organize them in Test Suites.

All data is stored locally in your browser; no external servers or analytics.

2 Installation

Install FlowMint Recorder from the browser store — no build or command line required.

  1. Open the Chrome Web Store (or Edge Add-ons if you use Microsoft Edge).
  2. Search for FlowMint Recorder or use the direct link from the FlowMint website.
  3. Click Add to Chrome (or Get in Edge) and confirm.
  4. Pin the extension to the toolbar: click the puzzle-piece icon in the browser bar, then pin FlowMint Recorder for quick access.

To use it: click the FlowMint icon. The side panel opens with the Actions tab. From there you can start recording, switch to other tabs (Variables & Data, Export, Suites, Settings), and run or export tests.

Developers / testers: If you’re building from source, run npm run build, then in chrome://extensions/ turn on Developer mode and use Load unpacked to select the dist folder. End users don’t need this — they install from the store.

3 Quick start (5 steps)

1Open a website you want to test (e.g. https://google.com) in the same browser.
2Click the extension icon to open the side panel, then click Start Recording. A small floating toolbar appears on the page (bottom-right) while recording.
3Interact with the page: click, type, select. Use the toolbar to Pause, Stop, add Wait (1s / 2s / 5s), or Assert URL Pro.
4Click Stop on the toolbar. Your steps appear in the Actions tab.
5Go to the Export tab, choose a language (e.g. JavaScript / Playwright), then Copy code or Download to get the test script.

4 Side panel tabs

Use the sidebar on the left of the panel to switch between:

TabPurpose
ActionsTest name, Start/Pause/Stop, Run test (Pro), list of steps. Add assertions, extract values, reorder/duplicate (Pro).
Variables & DataDeclare variables, CSV/JSON data source, run test once per row (Pro).
ExportLanguage (JS, Python, Java, C#, Ruby), conditional logic, copy/download. Import test (Pro).
SuitesSave tests, create suites (setup → tests → teardown), run suite, search tests, download report (Pro).
SettingsRecording, selectors, export defaults, theme (light/dark/system), advanced.

5 Recording

Test name

Set a Test name in the Actions tab (before or after starting). It’s used when you save, export, or download the playback report.

Start / Pause / Stop

  • Start Recording — Begins capturing. The floating toolbar appears on the page (draggable, bottom-right).
  • Pause / Resume — Temporarily stop or continue capturing.
  • Stop — End the session. Reopen the panel to see the full action list.

Floating toolbar

While recording: Rec / Paused status, Pause, Stop, Wait 1s / 2s / 5s Pro, Assert URL Pro. Drag the toolbar by its background to move it.

What gets recorded

Clicks, typing, selects, navigation, hover (if enabled), scroll (Pro), form submit. Selectors prefer id, data-testid, ARIA, then XPath/CSS — configurable in Settings.

6 Action list & step options

After recording, each step appears in the Actions tab. You can:

  • Expand / collapse — See selector and details. Use Collapse all / Expand all at the top.
  • Add assertion Pro — Add text, visibility, attribute, count, URL, or value assertion after a step.
  • Extract value to variable — Capture text, attribute, or input value for data-driven runs.
  • Move up / down, Duplicate Pro
  • Run from step, Run single step, Edit selector Pro
  • Delete — Remove the step (with confirmation).

Export steps as JSON (top of list) Pro — Download the test as JSON; re-import from the Export tab.

7 Assertions

Add assertions from the Actions tab (next to a step) or from the floating toolbar (Assert URL only).

TypeDescription
TextElement text equals, contains, or matches a value.
VisibilityElement is visible or hidden.
AttributeAttribute (e.g. href, disabled) equals or contains a value.
CountNumber of elements matching the selector.
URLCurrent page URL equals or contains a value (toolbar or panel).
ValueInput value equals or contains a value.

8 Data-driven tests

The Variables & Data tab (Pro) lets you run the same test with different data (e.g. multiple logins).

Variables

Declare names (e.g. username, password). Use Extract value to variable to capture from the page, or {{variableName}} in type/navigate steps.

Data source

Paste CSV (first row = headers) or JSON (array of objects). Example:

username,password,role
alice,secret123,admin
bob,pass456,user

Run with data

Click Run with data. The test runs once per row; variables are replaced. You can import a CSV/JSON file via the file picker.

9 Export

The Export tab generates code from your actions, assertions, and conditional blocks.

  • Languages: JavaScript (Playwright), Python, Java, C#, Ruby (Selenium). Some may be Pro.
  • Copy code / Download — Default language and indent in Settings.
  • Conditional logic — Wrap step ranges in if/for/while/switch (export-only; doesn’t change playback).
  • Import test Pro — Load a JSON test (same format as Export steps as JSON).
  • AI Export (Pro, optional) — If configured, Generate with AI sends actions to your endpoint and shows returned code.

10 Test Suites

The Suites tab (Pro) is where you save tests and run them in groups.

Saved tests

Search by name/description, Load, Run, Rename, Export as JSON, Delete. After a run: pass/fail counts, expand step details, Download report (HTML with screenshots).

Suites

Create suite — Name it, add tests in order, optionally set Setup (run once before) and Teardown (run once after). Run suite runs setup → tests → teardown.

11 Playback & reports

Run test Pro runs the current (or selected) test in a new tab. Progress shows in the panel. Run from step / Run single step Pro start at a specific step or run only one step.

Download report creates a self-contained HTML file: test name, date, summary (total/passed/failed), and each step with status, description, error (if any), and screenshot. Open or share the file in any browser.

12 Settings

Recording — Auto-save, notifications, hovers, keystrokes, smart waits, pause on blur.

Selectors — Prefer data-testid/ARIA, XPath, short selectors, locator order (id → xpath → css).

Export — Default language, indent size, comments, async.

Appearance — Theme: Light, Dark, or System.

Advanced — Developer mode, debug logs. Pro dev override unlocks Pro features for local testing (don’t use in production).

Export / Import / Reset — Save or load settings as JSON; reset to defaults. Settings can be overridden via extension-config.json for deployers.

13 Pro features

Typically gated as Pro: Run test, Run from step, Run single step; Reorder/Duplicate steps; Test Suites (save, load, suite, setup/teardown); Record assertions, Insert wait, Record scroll; Edit selector; Variables & Data; Import test, Export as JSON; some export languages; AI Export when configured.

Enable Pro dev override in Settings → Advanced to unlock Pro locally for development or testing.

14 Tips & troubleshooting

  • “No valid webpage” — Open a normal web page (https) in the tab you want to record. Chrome/extension pages can’t be recorded.
  • “Receiving end does not exist” — Refresh the page and try again so the content script loads.
  • Selectors break — Prefer data-testid or stable IDs. Use Edit selector (Pro) to fix a step.
  • Run test fails immediately — Ensure the tab is on the correct start URL. Try Run from step from the first action.
  • Data-driven: variables not replaced — Declare variable names and use {{name}} in steps; names must match data columns/keys.
  • Export empty or errors — Ensure at least one action; check conditional block step ranges.
Stable selectors: Use data-testid or id on important elements. Enable “Prefer data-testid” and “Prefer ARIA labels” in Settings → Selectors.