Right-click on the chosen button (for this tutorial we’ll try and click on the “Show notifications” popup in Trello)
In the code-ridden view you are presented with, you’ll see the chosen item highlighted
Now we need to find its selector, which is the ID or a class which is unique to the item.
To do so, there is a couple things we need to know and keep in mind, since each webpage (mostl webapps) use different techniques to build up the page, so the right selector will vary depending on the specific case
In summary, these are the basics:
the item must be clickable, so point to an anchor (a), button, input or more rarely a div (in our case, you can see that when right-clicked on “Inspect”, a “span” item was selected. But if we look closely, it’s contained by an “a” (anchor) item, which is the one we want to click instead.
if you intend to share this, avoid labels as they might change by idiom
So, since it’s one of the element’s classes (you can notice there’s more than one as they are separated by a space) we need to add a dot before the name of the class