heytappr.book a demo

what is

dom selector / css selector

in one line

a css selector is a pattern that identifies elements in a web page's dom, used by guidance tools to find the exact control to highlight.

a css selector is a small pattern that picks out elements in a web page, like #save-button or [data-action="export"]. browsers use selectors to apply styles, and scripts use them to find elements in the dom, the live tree of everything on the page.

in-app guidance tools use selectors to know what to point at. each step of a walkthrough says "highlight the element matching this selector".

selectors are also where guidance breaks. if a release renames a class or restructures the markup, the selector stops matching and the step silently fails. stable attributes like ids or data attributes hold up much better than styling classes.

where heytappr fits

every heytappr guide step targets a css selector your team sets. when a selector stops matching after a release, heytappr flags it in the needs-attention list so you can fix it before users hit it.

see it in practice

related terms