Inspect Tool

The Inspect Tool allows you to highlight elements from a session replay, and quickly create metrics and definitions to understand how your users interact with those elements. This allows you to get insights faster, without needing to rely on a technical resource to provide selector information. This feature is available on the Pro plan.

In Session Replay, pause the recording when you see a page with an element you want to learn more about. Click the Inspect button in the timeline at the bottom of the screen

Hover over the screen in the replay until the red box contains an element you are interested in. You can scroll on the page to see additional parts of the view.

For example, if I want to understand how many users clicked the Sign Up button, I would click when I see Sign Up highlighted like so:

Click on the element to open a popover. The popover displays statistics about the element, based on several different ways to identify that element. Based on your site configuration and the element selected, all three options may not be available.

1. ID, can be combined with URL filter
   1. This is the most stable way to identify an element
2. Text, can be combined with URL filter
   1. In lieu of an ID, identifying an element by Text on a specific URL is a recommended
3. Exact Selector
   1. Exact selector will identify the selector and any associated attributes. While exact selector is specific, it may be an unstable way to identify an element, based on your site configuration.
      To understand why, think of identifying elements on a webpage like finding books in a library. A CSS selector is like the book's address. If the library rearranges or adds books, the addresses may change. Similarly, in web development, website updates can alter CSS selectors. Instead of using fixed selectors, it's better to use ID or Text on Page, to ensure accurate results, even as the website evolves.

Once an element is selected, you can choose to Create a Definition, Create a Chart, or Search for other sessions where users clicked on this element.

The modal will display any matching definitions for Clicked on ID, Text, or Selector that already exist for your selection.

Create a Definition

Creating a definition allows you and your colleagues to easily search on an element in the future. For more information about using Definitions, click here.

To create a definition, select Create Definition after clicking on an element. On the next step, choose to create a definition based on how often that element has been clicked (Clicked), or how frequently it has been visible in a session (Element Visible). Element Visible is a non-retroactive filter, so selecting this option will start recording these interactions going forward. You can also edit the selector, if you are comfortable doing so.

Create a Chart

To create a chart, click Create Chart, after clicking on an element. This will open a new tab with a Timeseries chart, filtered to sessions that clicked on the selector.

Limitations

The Inspect tool is currently limited to sessions recorded by the Web SDK, and is unable to inspect elements inside of iframes. For on-premises customers, statistics will not populate.