How can I use CSS selectors in Fullstory Search?

Who can use this feature?
- Available with Enterprise, Advanced, Business, and Free plans.
- Available for admins, architects, explorers, and standard users.

You can search for elements in Fullstory based on either the display text (i.e. Clicked text is) or by using a CSS selector to pinpoint a specific element.

How_can_I_use_CSS_selectors_in_FullStory_Search_.png

When searching using a CSS selector in Fullstory, the following formats are supported: 

Any descendant: a b
Attribute equals: [a=b]
Attribute contains word (space delimited): [a~=b]
Attribute contains: [a*=b]
Attribute starts with word (hyphen delimited): [a|=b]
Attribute starts with: [a^=b]
Attribute ends with: [a$=b]


An example of searching for a data-component attribute that ends with line:

 

This session was returned in the search as it has a Click on a data-component called Timeline:

 

 

ID Selectors: #a
ID starts with word (hyphen delimited): [id|=a]
ID starts with: [id^=a]

 

An example of searching for an id that begins with gats:

Screenshot 2024-07-23 at 17.18.44.png

This returns a session with a click on an element with id #gatsby-focus-wrapper:

Screenshot 2024-07-23 at 17.20.41.png

 

Class Selectors: .a
Class starts with word (hyphen delimited): [class|=a]
Class starts with: [class^=a]

 

An example of searching for clicks on elements with a class of xToClose:

Screenshot 2024-07-23 at 17.24.56.png

Which returns this session:

Screenshot 2024-07-23 at 17.29.47.png

 

Type (element) Selectors: a

 

An example of searching for clicks on elements of type a (hyperlinks):

Screenshot 2024-07-23 at 17.33.29.png

Note: We do not support direct descendent expressions such as > for Search.


Was this article helpful?

Got Questions?

Get in touch with a Fullstory rep, ask the community or check out our developer documentation.