The latest SessionStack release includes: Rage Click & Search by Text for Clicked Element

Mariya Ivanova
SessionStack Blog
Published in
6 min readSep 14, 2022

Today, we want to draw your attention to our most recent development in the primary Segments dashboard.

One of our new features is the “Rage Click” segment filter. It allows you to search proactively for users and their sessions with friction points. You no longer need to watch all available sessions for a single user to determine if the user had a smooth user journey in your digital product.

The second feature update is in our Segments dashboard — a new search option for the existing “Clicked Element” event filter.

This article will cover:

  1. The Definition of rage click
  2. How to use the main event filter — Rage Click
  3. How to search for rage clicks
  4. Custom option for excluding HTML element from rage clicks
  5. Clicked Element with search option by “Text”

With our latest SessionStack release we move a step further in our goal to provide you with enhanced product analytics tools, combining qualitative and quantitative data. Back in August in our blog post, we introduced to you our User Trends — a tool for quantitative analysis. Now, we want to deliberate more about our most recent event filter in Segments: “Rage Click”, but first let’s clear out what is really a rage click.

The Definition of rage click

A rage click occurs when a user performs multiple quick clicks on the same element in a row. Among the possible explanations are:

  • The user does not understand which is a clickable element;
  • Buttons, links, and icons do not function properly;
  • Unable to click because of the invisible overlay above everything;

How to use the main event filter — Rage click

Our most recent event filter “Rage Click” is available with 3 options: Anything, CSS selector, and Text. You can find it in our Segments dashboard, under the search filters menu.

See the image below.

“Rage Click” in Segments filters
The event filter Rage Click with three options

Consider the following example of how to use the Rage click segment filter:

You are aware that there is a problem with email sending, more specifically the button “Send“ does not work always since the most recent release version. If you want to check how many users have been affected by this issue, one of the ways is to use our event filter “Clicked Element”. However, such an event search will display all users who have clicked the “Send” button, both successfully and unsuccessfully. To refine your search use our new segment filter “Rage Click” with the option “Text is“: “send” as shown above. The option is case-insensitive and works with an exact match (need to define the whole text on the element). The search will show that one user has encountered the problem.

One user with rage clicked on the “Send” button

To examine which is the exact session of the user with rage clicks press on the “>” icon on the right side of the user line. On the newly opened right-side panel, you will see all sessions of the user listed in chronological order. The ones that meet the search criteria are marked with the label: “matching“. In our case, just one session out of three matches the “Rage Click” criterion. This can be viewed in the image below.

One matching session for the “Rage Click” filter

Opening the relevant session and checking the event time steps on the left in the session player will show a quick glance at the exact rage click events. No need to watch the whole session, just select the related events. They are easily recognizable by color and icon. The rage clicks are marked with a special icon and yellowish color as shown below.

Rage clicks: shown in the event time steps in the session player

How to search for rage clicks

It might be the case: that you are unaware of any existing issues with your product and simply want to see if there are any frustration points for your customers. This can be examined by the “Rage Click” search filter with the option “anything“. Using this combination will list you all users with rage clicks on any element and page of your product. By going through the matching sessions, you may spot some interesting patterns which can be examined further:

  • How frequently does a particular rage click occur?
  • How many users are affected?

This can be achieved by copying the CSS selector for the element that you are interested in and then using the CSS string for the configuration of the filter “Rage Click”. The process for obtaining a CSS selector for an element is analogous to that for the “Clicked Element” filter. Learn how to do this by reading this blog post.

After the configuration is applied then you can explore the first two trends: Users and Total Sessions for getting the answer to the questions above.

Custom Option for Excluding HTML Element as Rage Click

Sometimes the rage click can be misleading. For example, the user is clicking on a pagination element for the previous/next page. In order to exclude such false positive instances, you can specify the CSS selector of the HTML element in your project Settings menu and prevent rage clicks from capturing.

Rage Clicks elements exclusion settings

Clicked Element with search option by “Text”

In July, we discussed the event filter Clicked Element in our blog post — why and how to use it. Today we want to share with you a new option for the filter. This is the ability to search for HTML elements using text. The option works with a perfect match.

In the example below, we want to examine how many users are clicking on the button “Discard” when creating an email.

The “Discard“ button: is part of the email creation page in product X

Follow the steps outlined below.

Step 1:

Select the “Clicked Element” filter from our Segments dashboard. Choose the “Text“ option. By selecting this, you can easily define the text on the button or any other HTML element. This will avoid dealing with complex CSS selectors like the one shown in the example. Remember that this is a perfect match. You must define the entire text, not just a portion of it. Don’t be concerned about the capital letters; the new option is not case-sensitive.

Example for complex CSS selector:

#checkout-form > div.checkout__user-inputs-wrapper > div.checkout__col.checkout__col — second > div.checkout__step.checkout__step — two > div > div > div.radio-wrapper.shipping-methods__item.snowspeedy_method-b.has-select.select-loaded > div.shipping-methods__select-wrapper > span.

The filter “Clicked Element“ with the option “Text“

Step 2:

Examine the user list. For sessions and user details, open the right-side panel of any user from the list. To list only the relevant search criteria sessions, use the toggle option “Only matching sessions”.

Session List — showing all user’s sessions in descending order
Session List with “Only matching sessions” enabled

According to the example above, one user clicked the “Discard” button in two of all sessions. Going through the matching sessions can lead you to some further conclusions about the user behavior and experience in your product.

We’d like to take this opportunity to reveal our upcoming segment filter. It will aid you in your search for sessions with a specific duration.

Interested in SessionStack? Book your demo now or get started in minutes with our Free plan.

Happy with SessionStack? Leave a review and get a Gift card!

We hope you find these feature updates helpful. We’d love to hear your feedback in the comments below.

--

--