In this Python Selenium tutorial we are going to learn about Python Selenium Web Elements, we will have a simple introduction to Web Elements in Selenium, how you can interact with web elements in python selenium and how you can use different locators like id, name and xpath.
What are Web Element in Selenium ?
A web page is created of many different HTML elements, such as buttons, links, a body, labels, forms, and so on, that are named WebElements in the context of WebDriver. Together, these elements on a web page will achieve the business functionality. For example, let’s look at the HTML code of the login page of a website.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<html> <body> <form id="loginForm"> <input type="text" name="Username" placeholder="Please enter your username"/> <input type="password" name="Password" placeholder="Please enter your password"/> <input type="submit" /> </form> <a href="forgotPassword.html">Forgot Password ?</a> </body> </html> |
You can see in the above code that our login.html file is created by different web elements, for example we have text input fields for entering our password and username, also we have a button for submitting the form. and also you can see that for these web elements we have attributes, for example for input fields we have name attribute. UI Automation in Selenium is mostly about locating these WebElements on a web page and executing user actions on them. and there are different ways that you can locate a web element in a web page, for example you can use id, name, tag, xpath, that we will use some of them in this article.
Locating Web Elements
OK now let’s start our example by automating Google Search page, which we want opening of the Google Search page, locating the search input field, typing something and searching for that.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
from selenium import webdriver import time driver = webdriver.Chrome() driver.get('https://www.google.com') search_box = driver.find_element_by_name('q') search_box.send_keys('Python') time.sleep(5) search_box.submit() |
In the above example we are going to use the name locator of web elements, first of all we have imported the required classes, and after that we have opened our chrome browser and finding Google website.
As i have already said that there are different ways that you can interact with the selenium web elements, in here we have used the name locator of google search field.
|
1 |
search_box = driver.find_element_by_name('q') |
After that we are sending the python key to the Google Search input field, and at the end we are searching that. also we have added a time sleep.
|
1 2 3 |
search_box.send_keys('Python') time.sleep(5) search_box.submit() |
Run the code and this is the result.
Web Element Locator by XPath
There are may be situations, that you will not have the name attribute for the web element, on that time you can use XPath. just inspect the element in Chrome and after that right click and choose copy XPath.
And this is the code for the XPath.
|
1 2 3 4 5 6 7 8 9 10 |
from selenium import webdriver driver = webdriver.Chrome() driver.get('https://www.google.com') search_box = driver.find_element_by_xpath('//*[@id="tsf"]/div[2]/' 'div[1]/div[1]/div/div[2]/input') search_box.send_keys('Python') search_box.submit() |
We have just used find_element_by_xpath() method.
Web Element Locator By Name
Also you can use name attribute for finding web element locators. and for that you can use find_element_by_name() method.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
from selenium import webdriver import time driver = webdriver.Chrome() driver.get('https://demoqa.com/text-box') input_field1 = driver.find_element_by_id('userName') input_field2 = driver.find_element_by_id('userEmail') input_field3 = driver.find_element_by_id('currentAddress') input_field4 = driver.find_element_by_id('permanentAddress') time.sleep(2) input_field1.send_keys("Parwiz Forogh") time.sleep(2) input_field2.send_keys('par@gmail.com') time.sleep(2) input_field3.send_keys('This is current address') time.sleep(2) input_field4.send_keys('This is permenant address') time.sleep(4) btn_submit = driver.find_element_by_id('submit') btn_submit.click() |