Can I prevent some elements from being classified as Rage Clicks, Dead Clicks, or Form Abandon?

Yes! Sometimes the results returned from FullStory frustration heuristics like Rage Clicks, Form Abandon, or Dead Clicks can represent false positives. For example, you may have a calendar widget that requires a user to rapidly click through the months and FullStory will classify this as a Rage Click. Another example is clicks which result in a new window or new tab being classified as Dead Clicks.

If you’re not interested in this particular data, you can add the class fs-ignore-rage-clicks or fs-ignore-formabandon, or fs-ignore-dead-clicks to the elements you wish to be ignored. 

The rest of this post will be broken up into two main sections. The first section will cover Rage Clicks and Dead Clicks, while the second will cover Form Abandon. These are the only supported heuristic exclusions at this time.

Ignoring Rage Clicks and Dead Clicks on an element

Adding the class fs-ignore-rage-clicks or fs-ignore-dead-clicks on an element will make FullStory ignore Rage Clicks or Dead Clicks respectively on the element and the element's descendants. In the examples below, you’ll see a demonstration of  fs-ignore-rage-clicks . The same method will work for fs-ignore-dead-clicks.

Example 1

Rage Clicks will be ignored on this <div> element.

<div class="fs-ignore-rage-clicks"></div>

 

Example 2

Rage Clicks will be ignored on the main <div> element and all of its children, including:

  • the <div> element;
  • the <span> element;
  • the text node("Peaches");
  • the <p> element and its child <a> element.
<div class="fs-ignore-rage-clicks">

 <span>Mangocados</span>

 Peaches

 <p>Copyright 2017 <a href="/">The Fruit Shoppe</a></p>

</div>

 

Example 3

Rage Clicks on the <div> element containing the text ("Peaches") will be ignored. However, Rage Clicks on the <article> element, the two <p> elements, and the text inside the <p> elements won't be ignored. 

<article>

 <p>This is a true story.</p>

 <p>The events depicted took place in Minnesota in 2006.</p>

 <div class="fs-ignore-rage-clicks">Peaches</div>

</article>

 

Notes

  • You can use fs-ignore-rage-clicks multiple times in the same HTML document to ignore multiple elements.
  • It is case-sensitive, so FS-Ignore-Rage-Clicks will not have the desired effect.
  • All of the above is true for fs-ignore-dead-clicks as well.

You can use the class together with other classes on the same element. In other words, the following combination of foo, fs-ignore-rage-clicks, and bar is okay to do:

<div class="foo fs-ignore-rage-clicks bar"></div>

It is okay to nest fs-ignore-rage-clicks classes, like in the following snippet. The overall effect is that Rage Clicks on the <article> element and its descendants will be ignored.

<article class="fs-ignore-rage-clicks">

 <div class="fs-ignore-rage-clicks">Peaches</div>

 <p>Dragon Fruit</p> 

</article>

Clicks on the <p> as well as clicks on the text "Peaches" will be ignored. (Though the fs-ignore-rage-clicks isn't required for FullStory to ignore “Peaches” since it is nested inside the already excluded <article>).

Using fs-ignore-rage-clicks will only affect future session recordings; it will not retroactively exclude elements from Rage Clicks in your FullStory sessions.

Ignoring Form Abandon for a form

Adding the class fs-ignore-formabandon to a <form> element will disable tracking form abandonments on that form. 

Example 1

In the example below, adding the class on a form disables tracking form abandonment only for that particular form. Other forms on the page will continue to be tracked for form abandonment.

<form action="" method="post" class="fs-ignore-formabandon">

  <input type="submit" value="Save">

</form>

 

Example 2

In the example below, the code won't disable form abandonment for either of the two forms because the class is not directly on the <form> elements.

<body class="fs-ignore-formabandon">

 <form action="" method="post">

  <input type="submit" value="Save">

 </form>

 <form action="" method="post">

  <input type="submit" value="Purchase">

 </form>

</body>

 

Notes

  • You can use fs-ignore-formabandon on multiple forms in the same HTML document to ignore multiple forms.
  • It is case-sensitive, so FS-Ignore-FormAbandon will not have the desired effect.
  • You can use the class with other classes on a form. In other words, the following is okay to do:
<form class="foo fs-ignore-formabandon bar"></form>

Using fs-ignore-formabandon will only affect future session recordings; it will not retroactively exclude elements from Form Abandon in your FullStory sessions.

Important note about using JavaScript

If you're not able to include the fs-ignore classes in the HTML itself, it's possible to run JavaScript on the page in order to include them when the page loads for the user. However, there's a caveat: it's possible the user could abandon the form or Rage Click before the JS fires and the class is added in which case FullStory would still record these as frustration events.

Because of this, the best practice is to add fs-ignore-formabandon and fs-ignore-rage-click directly to the element in the HTML to ensure the respective interactions are not recorded as frustration events.

Need to get in touch with us?

The FullStory Team awaits your every question.

Contact us