Mouse Left Click

Mouse click is the most basic recorder event. It does not require any special configuration - every left click you make in the recorder is captured automatically.

Each click is stored as two values:

• XPath - a path that identifies the clicked element in the page structure.
• X, Y coordinates - the exact screen position of the click.

During monitoring, TestCLIX uses the XPath to verify that the click reaches the correct element - if the element is not found, the step fails with an error. It is possible to use only X, Y coordinates instead by disabling XPath validation.

When you regenerate the timeline, TestCLIX can use the stored coordinates to attempt to auto-correct minor structural changes so you don’t have to re-record the step.

How it works

When you click in the recorder, TestCLIX looks at the page DOM and builds an XPath expression that points to the clicked element. It also records the click coordinates and the element dimensions as a fallback.

No extra steps are needed - just interact with the page and each click becomes a recorded step.

What is XPath

XPath is a query language for selecting elements in an HTML document. Instead of relying only on pixel coordinates, TestCLIX uses XPath to identify which element you clicked, not just where you clicked. This makes the recorded step more resilient to minor layout changes such as a shifted sidebar or an extra banner.

The recorder builds the XPath using the following priority:

1. data-testid attribute - the most stable selector, commonly added by testing frameworks.
2. Stable id attribute - used when the id is not auto-generated by a framework (IDs produced by React, Angular, Vue, Ember, and similar libraries are skipped automatically).
3. Position-based path - falls back to the element’s structural position in the DOM (e.g., /html/body/div[1]/span[2]).

Disabling XPath validation

By default, TestCLIX validates the XPath during playback to confirm the click lands on the intended element. You can disable this validation in two ways:

• For all click events in a test - enable Ignore page structure in the test’s advanced options. See Page Structure Flexibility for configuration steps and trade-offs.
• For a single event - click the event in the Session Timeline to enter Preview mode. In the preview you will see an Ignore page structure toggle (disabled by default). Enable it to skip XPath validation for that specific step.

When XPath validation is disabled the click falls back to pure screen coordinates (X, Y).

When to disable it

Disabling XPath validation is useful when:

• The page is built with a highly dynamic frontend framework (React, Angular, Vue, Svelte, etc.) that frequently re-renders components or changes the DOM hierarchy between runs.
• Elements have auto-generated or unstable attributes that differ on every page load.
• The page structure is intentionally different across environments (e.g., A/B tests, feature flags).

Caution

Without XPath validation TestCLIX cannot verify that the click reaches the correct element. If you disable it, consider adding a verification step such as a Compare Screen Fragment, AI Assistant, or Pixel Comparison to confirm the page state after the click.

Best used for

• Buttons and links
• Checkboxes and radio buttons
• Tabs and expandable panels
• Opening forms, modals, and menus

Select dropdowns

When you click on a native HTML <select> element, the recorder automatically detects it and saves the chosen option as a dedicated selection step rather than a plain click. This keeps the scenario focused on the selected label, which is clearer and more stable than replaying only the opening click.

Select detection works for native <select> controls such as country selectors, status filters, and form option lists. Custom JavaScript dropdown components (built with <div>, <ul>, or similar elements) are not detected as selects - they are recorded as regular clicks and typing instead.

Embedded Frames

Clicks inside a single-level <iframe> are supported automatically. When you click an element that lives inside an iframe, the recorder detects the iframe, translates the coordinates relative to its boundary, and stores the interaction so playback can reproduce it accurately.

• Nested iframes are not supported. If the target element is inside an iframe within another iframe, the recorder cannot reach it.
• If the iframe is removed or moves significantly between recording and playback, the step may fail with an element-not-found error.
• If content inside the iframe loads with a delay, add a pause before interacting with it.

New tabs

If a click opens a page in a new tab (e.g., a link with target="_blank"), the recorder automatically follows the new tab. All subsequent actions are recorded on the new page - the original tab is left behind.

This happens transparently and does not require any special configuration. However, be aware of the following:

• The new tab starts with an empty navigation history, so History Navigation will not work immediately after the switch.
• There is no way to return to the original tab within the same scenario.

Common errors

Error	Meaning	What to do
Unable to find element on website	The stored XPath no longer matches any element and auto-correction also failed.	Re-record the step, or disable XPath validation for dynamic pages.
Element is different than in recording	The element was found but its size or position changed significantly.	The page layout may have changed. Re-record the step or add a pause before the click if content loads dynamically.
Step timed out	The action could not complete within the allowed time.	The page may still be loading. Add a pause before the step or check that the target URL is reachable.

For navigation and connectivity errors (DNS, SSL, connection failures), see Navigation Errors.

Caveats

• Highly custom widgets may need an added pause after the click.