How can I use CSS selectors in Fullstory Search?

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.

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:

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

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:

Which returns this session:

Type (element) Selectors: a

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

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