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 uniquely identify those elements.
In order to interact with UI objects with Selenium WebDriver 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 provides 8 type of locators.
Below are some browser tools that you can use in order 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 the locator in below order, so the failures will get reduced, if id has more than one match then 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>
We can use this method when you know id attribute of an element. This method returns first matching element, if there are more than one match.
This method throws NoSuchElementException if there is no matching element in the webpage.
Below code point to the element which has id as pancakes
We can use this method when you know name attribute of an element. Find Element By name method returns the first occurring element which has matching name attribute.
Raises a NoSuchElementException when there is no matching element in the webpage.
Below code tries to find the element which has 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
Class Name is nothing but the class attribute present in the webpage, if we feel that tagname gives correct match then we can use it. Finding a element with tag name also returns the first matching element, if there is no matching element then this methods throws exception, you know what exception it is.
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 Xpath Tutorial for greater knowledge. Xpath is nothing but 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 combination of attributes to find the element, as when we try to find elements using above said locators you may have other matches also along with 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 which identifies the web element within a web page. The composite of element selector and selector value is known as Selector Pattern. Please read building CSS Selector for greater knowledge
All 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 same principles but these will return all the matching elements
These methods will return a list of web elements, if there is not matching element then these returns 0 elements in list but these will not raise exception
Apart from all 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 second one is locator value.
driver.find_element(By.CSS_SELECTOR, "#pancakes") driver.find_elements(By.XPATH, "//a")
Shorter is better, preferable 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 is having more spaces indirectly means that this locator values 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 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 the speed, because the based on the browser the speed of locating an element in selenium changes.
Article is written by Pavan (a) KarthiQ. Well, I am serving notice period in an MNC, Bangalore. I thought to enrich every person knowledge a little, I always have a feeling, when we teach something, we will learn more than what you know.
Knowledge is the only thing that doubles when you spend it.
I have also created the reporter for Protractor Jasmine. Use for your projects without any hesitation