Web Elements are one of the most important concepts in Selenium WebDriver. A web element is an individual component of a web page, such as a text box, button, link, checkbox, radio button, dropdown, image, table, label, or form field, that Selenium can locate and interact with during automation testing.
Selenium WebDriver works with web elements through locators and WebElement objects. A tester first identifies an element in the browser's DOM, chooses an appropriate locator, finds the element using Selenium, and then performs an action such as click, type, select, read text, or validate its state.
Understanding Web Elements is essential for Selenium automation because Selenium training commonly covers locating elements using ID, XPath, CSS selectors, working with WebElements, forms, buttons, dropdowns, navigation, and page interactions.
A Web Element is a component of a web page represented in the browser's DOM that can be identified and interacted with using automation tools such as Selenium WebDriver.
For example, consider the following HTML:
The webpage contains three web elements:
Selenium can locate these elements and perform actions on them.
Conceptually, the page contains:
Web Page
|
+-- INPUT
| |
| +-- username
|
+-- INPUT
| |
| +-- password
|
+-- BUTTON
|
+-- Login
Selenium can locate each element independently.
Web Elements are represented inside the browser's DOM (Document Object Model). The browser converts HTML into a DOM tree, and Selenium uses WebDriver commands to locate elements within that document.
HTML
↓
Browser
↓
DOM Tree
↓
Web Elements
↓
Selenium Locator
↓
WebElement
↓
Interaction
For example:
The browser represents this button in the DOM, and Selenium can locate it using:
WebElement loginButton = driver.findElement(
By.id("login")
);
WebElement is a Selenium interface that represents an HTML element found on a web page.
When Selenium successfully locates an element, it returns a WebElement object.
WebElement username = driver.findElement(
By.id("username")
);
The variable username now represents the corresponding element found by Selenium.
Open Web Application
↓
Inspect HTML / DOM
↓
Identify Required Element
↓
Choose Locator
↓
findElement()
↓
WebElement
↓
Perform Action
↓
Validate Result
Example:
WebElement username = driver.findElement(
By.id("username")
);
username.sendKeys("admin");