Using Element Attributes in Search & Page Analytics

A note on element attributes

Admins and Architects are the only team seats that have permissions to add new element attributes. If you are a Standard user, you'll need assistance from one of these team seats in your Settings > Account Management > Users view. 

Jump to section:

If you want to have Element Attributes available in your mobile application, you can use the API call listed here for the elements you want attributes on.

When to Use Element Attributes for Indexing

You might want to use Fullstory's Element Attributes feature if:

  • Your site is built on React, and you have no stable class names to use in search
  • Your site uses Fullstory Private by Default obscuring the text on all buttons
  • You've implemented Fullstory's Babel React Plugin to automatically decorate selectors on your website with useful attributes
  • Your engineering team already uses data-* and aria-* attributes for a testing framework

One of the most powerful experiences in Fullstory is searching for click events on selectors, such as everyone who clicked on CSS selector class="btn btn-sm btn-primary cta-add-to-cart". If your site is built on React and the class names instead look like class="Azc44GrPgUQwaMdsxT21g RSzhz6gmPB1iAe-9l8gXJ" and are constantly changing, you lose this search functionality.

However, if your CSS selectors also are styled with some useful data-attributes, like data-component="photo-carousel", aria-label="search", or whatever your engineering team decides to add - you can get access to Fullstory's powerful search functionality again!

How Element Attributes work in Fullstory

The Element Attribute feature allows you to take advantage of more stable attributes on your selectors, even while the class names constantly change. You can select key Element Attributes to index so that you can search for future sessions where users interacted with those elements with the element attribute in question.

Screen Shot 2022-07-05 at 9.57.24 AM.png

We added a general list (shown in grey text) of attributes already indexed in search, such as data-component data-test and aria-labelledby, and you can add your own attributes that are important to your site by clicking "Create attribute".

Note: Element Attributes are not retroactive. When you search for sessions using Element Attributes, you'll see results starting from the time of instrumentation. 

We recommend that you define attributes that do not contain solely unique values (like a UUID). In the future Element Attributes will be used for more advanced Page Analytics and attributes with unique values can lead to confusingly low numbers for aggregate click counts.

You should add attributes that are actually useful and meaningful - e.g.  data-src may decorate every product on your product detail page, but if the output is a random string that isn't useful, then data-src isn't a good attribute to add for indexing.

Index List

The attributes that we index by default are listed here.

data-wa-link data-selector data-element
data-ref data-test data-source-file
data-test-id data-auid aria-label
data-testid data-hook aria-labelledby
data-automation data-track aria-describedby
data-qa data-page role
data-category data-key class
data-index data-e2e  
data-tid data-auto  


The following attributes are conditionally allowed.

Attribute Conditionally Allowed Tags
type [“button”, “input”]
name [“button”, “fieldset”, “form”, “input”, “output”, “select”, “textarea”]
href [“a”]



Do Not Index List

We don't index certain very common attributes (shown in the table below) since attributes are meant to identify important and unique elements around the site.

media nonce src


Configure pattern rule lists for attributes 

So you've identified a new Element Attribute that you'd like to add to Fullstory for Indexing - great!

When you edit or create a new Element Attribute, a pattern rule is required to index the attribute value. Click "Add Rule" to input the specific patterns you'd like to include or exclude. You can use wildcard * to specify a greater range of patterns.

Note: By default, we will not index attributes that include numbers or text not made up exclusively of common English words or abbreviations. Those patterns would have to be additionally allowlisted for that attribute. You can edit our default id Element Attribute with a wildcard to index ids such as lnkExample or exampleCard2.

Screen Shot 2022-09-23 at 11.55.12 AM.png

Searching using data-attributes

Once you've added a few data-attributes, and new sessions have rolled in containing the elements you'd like to search for, you can start building some segments. When searching in Fullstory you'll want to toggle the "Any activity" drop down and select "Clicked." You will then have the option to search the clicked event by "CSS selector" where you can search for engagement on a specific element without using class selectors.

Note: Data attributes are only searchable if they contain a given value. For example, [data-attribute] alone would not be searchable. Rather, you would need to enter [data-attribute="yourvaluehere"] when searching to yield results. If you'd like to explore more operators for data attribute searches, check out this guide for more tips.

Screen Shot 2022-06-30 at 10.55.32 AM.png

Refine your search to find engagement on a specific element containing specific text.

Screen Shot 2022-06-30 at 10.56.06 AM.png

And use data categories to search for engagement categories across multiple elements.

Screen Shot 2022-06-30 at 10.57.39 AM.png


Need to get in touch with us?

The Fullstory Team awaits your every question.

Ask the Community Technical Support