Recording in depth

Browser controls#

Start, pause, stop, save#

• Record (Ctrl+R) starts a new recording from the address in the URL bar and clears previous steps. A timer and step counter appear on the right of the toolbar, a ● REC badge appears above the page, and the toolbar and panel borders pulse red.
• Pause / Resume (Ctrl+P) suspends capture without ending the session.
• Assert (visible while recording) adds a visual assertion (see Assertions).
• Save (Ctrl+S) writes the test files and ends the recording.
• Stop (Ctrl+R or Esc) ends the recording without saving: the steps are discarded (you are asked to confirm when there are any) and the browser returns to the starting page.

What is captured#

• Clicks on links, buttons, tabs and other interactive elements.
• Typing in inputs, text areas and editable content — a typed field becomes one step with the final value, not one step per character.
• Dropdown selections, checkboxes and radio buttons.
• Special keys: Enter, Tab, Escape and the arrow keys.
• Navigations: addresses typed in the URL bar, favorites, and page changes. Recording continues across page loads.

Pages that open new tabs#

When the site opens a link in a new tab or window, it opens as a tab inside the app’s browser and a tab strip appears above the page. Recording follows the tab you are using; closing a tab during recording adds a Close tab step. Steps performed in another tab show a tab badge in the Action History. The first tab cannot be closed. The maximum number of tabs is set in Settings (default 12).

Repeating lists: random, first or last item#

While recording, right-click an element to open a menu:

• If the element is part of a repeating list (product cards, search results, table rows…), you can choose 🎲 Random item — one of N, First item or Last item. The item is clicked, and the step will pick a random / the first / the last item each time the test runs, instead of always the same one. Actions you perform inside the chosen item right after are tied to that item (badge ↳ item).
• Click this exact item records a normal click on that specific element.
• Quick assertions: Assert Visible, Assert Hidden, Assert Text equals.

On the step card, a 🎲 badge and the Pick item dropdown (Random, First, Last) let you change the choice later. Hovering the step highlights the whole list in the browser.

Session video#

When Record session video is on (default), the browser area is recorded while you record and saved as <name>.webm on Save. Stopping without saving discards the video. Quality (bitrate) is set in Settings. Videos up to about 12 MB are also embedded in the HTML report.

Custom request headers#

Open Custom Request Headers from the toolbar (sliders icon). Add rows of Header-Name and value, enable or disable each row with its checkbox, then click Apply (or press Enter). Enabled headers are sent with every request from the built-in browser — useful for auth tokens, feature flags or staging access. A badge on the icon shows how many are active. The list is remembered between sessions.

Draft recovery#

Steps are saved automatically while you work. If the app is closed while steps are still listed in the Action History, the next launch shows “Draft from previous session: N actions” with Restore (brings the steps back and opens the starting page) and Discard.

Editing an existing test#

1. In Framework → Workspace, right-click a recorded test’s .spec.ts and choose Load into recorder (or open the file and use the Load into recorder button). Recording must be stopped. If there are steps on screen, you are asked to replace them.
2. The app enters edit mode: an amber chip with the test name appears in the toolbar. The × on the chip leaves edit mode.
3. Change steps directly in the Action History, or add new ones by recording:
   • Append at the end: click Record. The browser returns to the test’s first page and new steps are added after the existing ones.
   • Insert in the middle: hover the gap between two steps, click + → Record from here, navigate the browser to the right point, then click Record. New steps are inserted at that position. A banner shows “Recording inserts at step N”; Append to end removes the insert point.
4. Click Save. With the same name, the test folder is overwritten (the video is replaced by the new session). Type a different name to save a new test instead.

Only tests recorded with Record can be loaded (they have an .actions.json); tests generated from Flows cannot.