Anything present on the webpage such as textbox, text, button, link, table, radio button, checkbox, etc., are called as webelement.
Before performing any action on webelement ( typing, clicking, selecting, etc.), selenium has to identify those elements uniquely.
To interact with UI objects with Selenium python, we need to be able to identify webpage elements fast and in an accurate way(sometimes uniquely).
We don’t want to refactor these locators very often, so we must choose the right locators from the start.
We can find the web elements on a webpage using locators provided by selenium python; Selenium bindings offer 8 types of locators.
Below are some browser tools that you can use to identify web elements in the DOM easier.
1. Firebug for Firefox
2. Google Developer Tools for Chrome
3. Web Inspector for Safari
Below are methods to find a web element based on the locators in Selenium python bindings:
Automation developer should use the locator in the below order so that the failures will get reduced; if id has more than one match then the user should try with Name so on...
Store below Html code in your local system with .html format, and open in chrome or any other browser.
<html> <body> <div id="pancakes"> <a href="https://chercher.tech" >Selenium Webdriver</a> <button id="firstButton" type="button">Blueberry</button> <button type="button" name="Ban" class="Banana">Banana</button> <button type="button" name="cake" value="Strawberry">Strawberry</button> </div> </body> </html>
Install Selenium Python Step by step
We can use this method when you know the id attribute of an element. This method returns the first matching element if there is more than one match.
This method throws NoSuchElementException if there is no matching element on the webpage.
Below code point to the element which has id as pancakes
We can use this method when you know the name attribute of an element. Find Element By name method returns the first occurring element which has a matching name attribute.
Raises a NoSuchElementException when there is no matching element on the webpage.
The below code tries to find the element which has a name as Ban.
Tagname is nothing but the item used or a tag used to form that particular element; This method returns first matching element, if there is no match then raises a NoSuchElementException
We can find the element using the hyperlink text present in the link element; we can either use partial text or Link text methods to find the element.
# finds element based full match driver.find_element_by_link_text("Selenium Webdriver") #find element based on partial text driver.find_element_by_partial_link_text("Webdriver")
Please read the Xpath Tutorial for more excellent knowledge. Xpath is nothing but an XML path, as HTML is also one kind of XPath, so we can use XPath to find the element inside the HTML document.
Xpath is nothing but a combination of attributes to find the element, as when we try to find elements using the above said locators you may have other matches also along with the target match.
Valid XPath locators can be:
xpath=//button[@name="Ban"] - matches with banana
xpath = //*[@value='Strawberry'] - matches with strawberry
CSS Selector is the combination of an element selector and a selector value that identifies the web element within a web page. The composite of an element selector and selector value is known as the Selector Pattern. Please read building CSS Selector for more excellent knowledge.
All the above-said methods will only one matching element even there more than one, but still, they will return one element.
Sometimes we may need to find all the matching elements on the webpage, in such cases, we can use below methods, these also will follow the same principles, but these will return all the matching elements
These methods will return a list of web elements if there is no matching element then these returns 0 elements in the list, but these will not raise an exception.
Apart from all the above-said methods, we have two more methods, which are find_element, find_elements.
These methods will accept two parameters, one type of locator, and the second one is the locator value.
driver.find_element(By.CSS_SELECTOR, "#pancakes") driver.find_elements(By.XPATH, "//a")
Shorter is better, preferably with a clear, unique name/id which describes this unique element on the page.
Feel free to change the code like classes/names/id's to make the locator and the test-code very understandable and readable.
We should avoid using classes or IDs which has more than one space in its value, if the values have more spaces indirectly means that this locator value is about to change frequently
The structure of the locator should be so uniquely good that it does not need to be updated if the location of the element in the page changes.
Unless the functionality changes, you should be able to minimize the updating of locators and or tests.
When it comes to locators, speed is also an important aspect; when we design locators, we should give preferences to Id, which are pretty fast compared to other locators.
But we cannot say whether XPath is good or CSS at speed, because of the based on the browser the speed of locating an element in selenium changes.