The most common attribute key names are class and id, where id has to be unique over the entire HTML page (according to the HTML specification). This locator strategy allows Selenium WebDriver to find that unique element and perform some action against it.
<input id="username" type="text" />
We can use one of the following locators:
If we want to be more explicit we can write:
Using the latter we explicitly mention the type of element.
Examine your knowledge and play the ‘locator game‘.
Most common browsers have some built-in development tools. These tools will help you to reveal HTML of the page and understand how the page is structured. This all sounds good, but they all have their own look and feel. We will see how we can launch the `Developer Tools`.
In Internet Explorer we can access `Developer Tools` by pressing `F12`.
Firfox has some built-in developer tools, but Firebug seems to be more popular and powerful. We can download the Firebug add-on from http://getfirebug.com/ .
The shortcut to open `Firebug` is `F12`.
Click on the `Inspect` button on Firebug’s toolbar. Move around the page and everything beneath your mouse will be instantly revealed within Firebug, showing you the HTML and CSS behind it.
Chrome comes with `Developer Tools`. The shortcut to open `Developer Tools` is `CTRL` + `SHIFT` + `I` or `F12`.
Click on the `Inspect` button on Chrome Developer Tools toolbar. Move around the page and everything beneath your mouse will be instantly revealed within Chrome Developer Tools, showing you the HTML and CSS behind it.
Opera comes with `Opera Dragonfly`. The shortcut to open `Opera Dragonfly` is `CTRL` + `SHIFT` + `I`.
Safari has a built-in `Developer Tools`. First, you need to enable that you want to see the Develop menu.
Click on `Preferences…` in the `settings` drop down menu. Go to the `Advanced` tab and check `Show Develop menu in menu bar`.
The shortcut to open `Developer Tools` is `CTRL` + `ALT` + `I`.