Dynamic XPath is an XPath technique used in Selenium WebDriver to locate web elements whose attributes, values, IDs, classes, text, or other properties may change dynamically. Instead of depending on an entire attribute value that can change between page loads or application sessions, Dynamic XPath uses stable portions of the element, partial matching, text, relationships, or multiple conditions to create a more flexible locator.
XPath is an important part of Selenium WebDriver element location. Selenium training at JustAcademy covers locators including XPath and CSS selectors, along with WebDriver, TestNG, Page Object Model, automation frameworks, and real-time project execution. Learn More About Selenium Training.
You can also explore the demo registration page here: Register for Course Demo.
Dynamic XPath is a flexible XPath expression created to locate elements when one or more properties of the element are dynamic or unpredictable. A dynamic element may have an ID, class, name, value, or other attribute that changes every time the page is loaded.
For example, an application may generate an input element like:
<input id="username_12345" type="text">On another page load, the same element may become:
<input id="username_98765" type="text">A static XPath depending on the complete ID would not be reliable:
//input[@id='username_12345']A Dynamic XPath can identify the stable portion of the ID:
//input[starts-with(@id,'username_')]Modern web applications frequently generate dynamic HTML attributes. IDs and class names may contain random numbers, session values, framework-generated identifiers, or other changing information.
Dynamic XPath provides techniques for identifying the stable characteristics of such elements.
| Static XPath | Dynamic XPath |
|---|---|
| Uses exact attribute values. | Can use stable portions of attribute values. |
| Can be affected by changing IDs. | Can handle certain changing IDs. |
| Usually simple. | Can use functions and relationships. |
| May become invalid after DOM changes. | Can be more flexible when designed correctly. |
| Often depends on fixed values. | Can depend on stable patterns. |
<input id="user_12345" type="text">A static XPath could be:
//input[@id='user_12345']If the ID changes to user_98765, the XPath fails.
Instead of matching the complete ID, identify the stable prefix:
//input[starts-with(@id,'user_')]This can match:
user_12345
user_98765
user_45678
A basic Dynamic XPath can be represented as:
//tagname[condition]For an attribute:
//tagname[contains(@attribute,'stable-value')]For text:
//tagname[contains(normalize-space(.),'stable-text')]For multiple conditions:
//tagname[@attribute='value' and contains(@class,'stable-class')]The contains() function is one of the most frequently used techniques for Dynamic XPath.
//tagname[contains(@attribute,'value')]//input[contains(@id,'username')]This can match IDs such as:
username_123
login_username_456
username_field_789
The starts-with() function is useful when the beginning of an attribute remains stable.
//tagname[starts-with(@attribute,'value')]//input[starts-with(@id,'username_')]| Function | Meaning | Example |
|---|---|---|
| contains() | Checks whether the value occurs anywhere. | contains(@id,'user') |
| starts-with() | Checks whether the value starts with a specific string. | starts-with(@id,'user_') |
The text() function can be used when visible text is stable.
//button[text()='Login']For example:
<button>Login</button>normalize-space() is useful when text contains extra spaces or inconsistent whitespace.
//button[normalize-space(.)='Login']For example, if the rendered text contains extra whitespace, normalize-space() can make the locator more reliable.
| Expression | Purpose |
|---|---|
text()='Login' | Matches an exact text node. |
normalize-space(.)='Login' | Normalizes whitespace and compares the element string value. |
contains(normalize-space(.),'Login') | Matches text containing Login after whitespace normalization. |
//button[contains(normalize-space(.),'Login')]This may match:
Login
Login Now
User Login
Login to Continue
Sometimes one attribute is not enough to uniquely identify an element. Multiple conditions can be combined.
//input[@type='text' and contains(@id,'username')]This requires the element to be a text input and its ID to contain username.
The and operator requires all specified conditions to be true.
//input[@type='email' and contains(@id,'email')]The or operator allows either condition to match.
//input[@name='username' or contains(@id,'username')]This can be useful when different versions of an application use different stable attributes.
The not() function excludes elements that satisfy a particular condition.
//button[contains(@class,'btn') and not(@disabled)]This selects buttons containing btn in their class while excluding disabled buttons.
Modern applications may add several classes to an element.
<button class="btn btn-primary login-button active">Login</button>An exact class XPath such as the following may be unreliable:
//button[@class='login-button']A partial class XPath can be:
//button[contains(@class,'login-button')]Suppose the application generates:
<div class="product-card-x7a82">and later:
<div class="product-card-p9b41">A Dynamic XPath can use the stable prefix:
//div[starts-with(@class,'product-card-')]Another option is:
//div[contains(@class,'product-card-')]<input name="username_12345">//input[starts-with(@name,'username_')]<input placeholder="Enter Username - 12345">//input[contains(@placeholder,'Enter Username')]<input value="User_98765">//input[contains(@value,'User_')]A stable parent container can be used to narrow down the search.
//div[contains(@class,'login-form')]//input[contains(@id,'username')]This searches for a username input inside a login form.
//div[contains(@class,'login-form')]/child::input[contains(@id,'username')]The child axis selects direct children of the selected parent.
//div[contains(@class,'login-form')]//input[contains(@id,'username')]The descendant search can find the input even when it is nested inside another element.
//input[contains(@id,'username')]/ancestor::form[1]This locates the nearest form ancestor of the username input.
The following axis can locate elements appearing later in the document.
//label[normalize-space(.)='Username']/following::input[1]This is useful when the input is not necessarily a direct sibling.
The preceding axis can locate elements appearing earlier in the document.
//input[contains(@id,'password')]/preceding::label[1]If the target element is a later sibling under the same parent, following-sibling can be used.
//label[normalize-space(.)='Username']/following-sibling::input[1]//input[contains(@id,'username')]/preceding-sibling::label[1]An index can be used when multiple elements match the same XPath.
(//input[contains(@name,'username')])[1]The parentheses apply the position to the complete result set.
The last() function selects the last matching element.
(//button[contains(@class,'submit')])[last()](//button[contains(@class,'submit')])[2]This selects the second matching button from the complete result set.
//button[contains(@class,'login') and normalize-space(.)='Login']//input[contains(@id,'username') and @type='text']//input[contains(@id,'password') and @type='password']//input[contains(@placeholder,'Email') and @type='email']//button[contains(@class,'submit') and normalize-space(.)='Submit']//a[contains(@href,'profile') and normalize-space(.)='Profile']This can be useful when the URL contains a stable portion but its complete value may change.
//a[contains(@href,'products')]//img[contains(@src,'product') and contains(@alt,'Laptop')]//div[contains(@class,'product-card') and .//h3[normalize-space(.)='Laptop']]This identifies a product card using its stable product name.
//div[contains(@class,'product-card')][.//h3[normalize-space(.)='Laptop']]//button[contains(normalize-space(.),'Add to Cart')]This is more specific than selecting the first Add to Cart button on the page.
Tables often contain repeated rows, so identifying a row using stable cell content is useful.
//tr[.//td[normalize-space(.)='John']]//button[normalize-space(.)='Edit']This identifies the row containing John and then locates its Edit button.
//tr[td[normalize-space(.)='John'] and td[normalize-space(.)='Mumbai']]//button[normalize-space(.)='Edit']//form[.//label[normalize-space(.)='Email']]//input[@type='email']//input[contains(@placeholder,'Search') or contains(@aria-label,'Search')]Accessibility attributes can sometimes provide useful stable information.
//button[contains(@aria-label,'Search')]Applications may provide custom data attributes for testing.
<button data-testid="login-button-123">Login</button>A Dynamic XPath can use a stable prefix when necessary:
//button[starts-with(@data-testid,'login-button-')]If a stable test attribute value exists, however, using that stable value directly is generally simpler.
WebElement username = driver.findElement(
By.xpath("//input[contains(@id,'username')]")
);
username.sendKeys("admin");
WebElement username = driver.findElement(
By.xpath("//input[starts-with(@id,'user_')]")
);
username.sendKeys("admin");
WebElement loginButton = driver.findElement(
By.xpath("//button[contains(@class,'login')]")
);
loginButton.click();
WebElement submitButton = driver.findElement(
By.xpath("//button[normalize-space(.)='Submit']")
);
submitButton.click();
WebElement email = driver.findElement(
By.xpath("//input[@type='email' and contains(@id,'email')]")
);
email.sendKeys("[email protected]");
List<WebElement> buttons = driver.findElements(
By.xpath("//button[contains(@class,'btn')]")
);
System.out.println("Buttons found: " + buttons.size());
Dynamic XPath identifies an element, but it does not automatically wait for that element to appear. Explicit waits can be used for dynamic web applications.
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
WebElement username = wait.until(
ExpectedConditions.visibilityOfElementLocated(
By.xpath("//input[contains(@id,'username')]")
)
);
username.sendKeys("admin");
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
WebElement loginButton = wait.until(
ExpectedConditions.elementToBeClickable(
By.xpath("//button[contains(@class,'login')]")
)
);
loginButton.click();
XPath can be constructed dynamically using Java variables.
String productName = "Laptop";
String xpath = "//h3[normalize-space(.)='" + productName + "']";
WebElement product = driver.findElement(By.xpath(xpath));
String productName = "Laptop";
String xpath = "//div[contains(@class,'product-card')][.//h3[normalize-space(.)='" + productName + "']]";
WebElement productCard = driver.findElement(By.xpath(xpath));
String buttonText = "Add to Cart";
String xpath = "//button[normalize-space(.)='" + buttonText + "']";
driver.findElement(By.xpath(xpath)).click();
public By getButtonByText(String text) {
return By.xpath("//button[normalize-space(.)='" + text + "']");
}
public By getProduct(String productName) {
return By.xpath(
"//div[contains(@class,'product-card')][.//h3[normalize-space(.)='" + productName + "']]"
);
}
public class LoginPage {
private WebDriver driver;
private By username = By.xpath("//input[contains(@id,'username')]");
private By password = By.xpath("//input[contains(@id,'password')]");
private By loginButton = By.xpath("//button[contains(@class,'login') and normalize-space(.)='Login']");
public LoginPage(WebDriver driver) {
this.driver = driver;
}
public void enterUsername(String value) {
driver.findElement(username).sendKeys(value);
}
public void enterPassword(String value) {
driver.findElement(password).sendKeys(value);
}
public void clickLogin() {
driver.findElement(loginButton).click();
}
}
@Test
public void loginTest() {
WebElement username = driver.findElement(
By.xpath("//input[contains(@id,'username')]")
);
WebElement password = driver.findElement(
By.xpath("//input[contains(@id,'password')]")
);
WebElement login = driver.findElement(
By.xpath("//button[contains(@class,'login')]")
);
username.sendKeys("admin");
password.sendKeys("admin123");
login.click();
}
<div class="product-card-a123">
<h3>Laptop</h3>
<button class="add-cart-456">Add to Cart</button>
</div>
A Dynamic XPath can be:
//div[contains(@class,'product-card')][.//h3[normalize-space(.)='Laptop']]//button[contains(@class,'add-cart')]String productName = "Laptop";
By addToCart = By.xpath(
"//div[contains(@class,'product-card')][.//h3[normalize-space(.)='" + productName + "']]//button[contains(normalize-space(.),'Add to Cart')]"
);
driver.findElement(addToCart).click();
//nav//a[contains(normalize-space(.),'Products')]//label[contains(normalize-space(.),'Terms')]/following::input[@type='checkbox'][1]//label[contains(normalize-space(.),'Male')]/following::input[@type='radio'][1]//div[contains(@class,'dropdown')]//option[normalize-space(.)='India']Chrome DevTools can be used to verify whether a Dynamic XPath returns the expected element.
$x("//input[contains(@id,'username')]")The result should be checked to make sure the XPath is unique and points to the intended element.
$x("//button[contains(@class,'login')]")AJAX-based applications can create or update elements after the initial page load. Dynamic XPath can help identify such elements, but synchronization is still required.
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
WebElement result = wait.until(
ExpectedConditions.visibilityOfElementLocated(
By.xpath("//div[contains(@class,'search-result')]")
)
);
JavaScript-heavy applications can dynamically modify the DOM. Locators should be based on stable information such as semantic attributes, stable text, container relationships, or dedicated test attributes.
React applications may generate changing classes or IDs. Instead of depending on generated values, identify stable attributes or relationships whenever possible.
//input[@type='email' and contains(@placeholder,'Email')]Angular applications may also generate dynamic attributes and update the DOM dynamically. A locator should focus on stable information instead of generated values.
//button[contains(normalize-space(.),'Login')]Repeated components are common in product cards, tables, menus, lists, and dashboards. Instead of selecting an element only by its index, use a unique value inside its container.
//div[contains(@class,'product-card')][.//h3[normalize-space(.)='Laptop']]//button[contains(normalize-space(.),'Add to Cart')]A dynamic locator can be scoped to a previously located WebElement.
WebElement product = driver.findElement(
By.xpath("//div[contains(@class,'product-card')][.//h3[normalize-space(.)='Laptop']]")
);
WebElement button = product.findElement(
By.xpath(".//button[contains(@class,'add-cart')]")
);
button.click();
The dot before the XPath is important because it makes the XPath relative to the current WebElement.
An absolute XPath may look like:
/html/body/div[1]/div[2]/form/div[1]/inputThis type of locator can be fragile because changes in the DOM hierarchy can break it.
A relative Dynamic XPath can be:
//input[contains(@id,'username')]Dynamic XPath is not a separate XPath language. It is a practical approach to creating flexible XPath expressions. Relative XPath normally starts with // and can use functions, attributes, text, and relationships to handle dynamic elements.
A Dynamic XPath should not be unnecessarily complicated. The goal is to identify stable information rather than create the longest possible expression.
A simple locator such as:
//input[@data-testid='username']is preferable to a complicated XPath if the data-testid is stable.
Before creating a complex Dynamic XPath, check whether the application provides a stable ID, name, data-testid, aria-label, or another meaningful attribute.
//input[@data-testid='username']Dedicated test attributes are often useful because they can remain stable even when visual styling changes.
//button[@data-testid='login-button']Suppose the ID changes between executions:
username_123456
username_984521
username_762314
A locator such as:
//input[@id='username_123456']is fragile.
Instead:
//input[starts-with(@id,'username_')]The following XPath may return several elements:
//*[contains(@class,'btn')]A more specific locator could be:
//button[contains(@class,'btn') and normalize-space(.)='Login']Always verify the number of matching elements.
List<WebElement> elements = driver.findElements(
By.xpath("//button[contains(@class,'login')]")
);
System.out.println("Matching elements: " + elements.size());
A locator such as:
(//button)[5]depends on the current order of elements. If another button is added before it, the locator may select a different element.
Prefer meaningful conditions:
//button[normalize-space(.)='Login']The following XPath may identify an unrelated input:
//label/following::input[1]A more specific context can be used:
//form[contains(@id,'login')]//label[normalize-space(.)='Username']/following::input[1]Text may contain whitespace that makes exact text matching unreliable.
Instead of:
//button[text()='Login']consider:
//button[normalize-space(.)='Login']A correct Dynamic XPath may still fail if the element has not appeared yet.
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
WebElement element = wait.until(
ExpectedConditions.visibilityOfElementLocated(
By.xpath("//input[contains(@id,'username')]")
)
);
If a unique and stable ID is available, it should generally be preferred over a complex XPath.
//input[@id='username']//input[@data-testid='username']Dedicated test attributes can provide a stable contract between the application and automation tests.
//button[normalize-space(.)='Login']Text-based locators are useful when the text is stable and unique.
//input[@type='text' and contains(@id,'username')]Additional conditions should make the locator more specific without making it unnecessarily dependent on unstable properties.
//form[contains(@class,'login-form')]//input[contains(@id,'username')]Scoping the search to a relevant container can reduce accidental matches.
Relative XPath is generally easier to maintain than a long absolute XPath.
//input[contains(@id,'username')]List<WebElement> matches = driver.findElements(
By.xpath("//button[normalize-space(.)='Login']")
);
if (matches.size() != 1) {
throw new RuntimeException("Login button locator is not unique.");
}
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
WebElement loginButton = wait.until(
ExpectedConditions.elementToBeClickable(
By.xpath("//button[contains(@class,'login')]")
)
);
loginButton.click();
private final By loginButton =
By.xpath("//button[contains(@class,'login') and normalize-space(.)='Login']");
Centralizing locators makes maintenance easier when the application's DOM changes.
public By getElementByText(String text) {
return By.xpath("//*[normalize-space(.)='" + text + "']");
}
When runtime text contains quotation marks or apostrophes, XPath string construction requires additional care.
For example:
John's LaptopXPath concat() can be used when required.
concat('John', "'", 's Laptop')//div[normalize-space(.)=concat('John', "'", 's Laptop')]<input id="user12345">//input[starts-with(@id,'user')]If the stable value is at the beginning:
//input[starts-with(@id,'input_')]If a stable portion occurs somewhere inside:
//input[contains(@id,'_username')]| Technique | Example | Purpose |
|---|---|---|
| contains() | contains(@id,'user') | Matches a partial attribute value. |
| starts-with() | starts-with(@id,'user_') | Matches a stable prefix. |
| text() | text()='Login' | Matches an exact text node. |
| normalize-space() | normalize-space(.)='Login' | Handles whitespace. |
| and | @type='text' and contains(@id,'user') | Requires multiple conditions. |
| or | @name='user' or contains(@id,'user') | Allows either condition. |
| not() | not(@disabled) | Excludes matching elements. |
| last() | (//button)[last()] | Selects the last result. |
| Position | (//button)[2] | Selects a specific result. |
| ancestor | /ancestor::form | Moves upward in the DOM. |
| following | /following::input | Moves forward in document order. |
| preceding | /preceding::label | Moves backward in document order. |
| following-sibling | /following-sibling::input | Finds later siblings. |
| preceding-sibling | /preceding-sibling::label | Finds earlier siblings. |
| Requirement | Dynamic XPath |
|---|---|
| Dynamic ID prefix | //input[starts-with(@id,'user_')] |
| Dynamic ID partial match | //input[contains(@id,'username')] |
| Dynamic class | //button[contains(@class,'login')] |
| Exact button text | //button[normalize-space(.)='Login'] |
| Partial button text | //button[contains(normalize-space(.),'Login')] |
| Dynamic placeholder | //input[contains(@placeholder,'Email')] |
| Element after label | //label/following::input[1] |
| Element before input | //input/preceding::label[1] |
| Product card | //div[contains(@class,'product-card')][.//h3[normalize-space(.)='Laptop']] |
| Product button | //div[contains(@class,'product-card')][.//h3[normalize-space(.)='Laptop']]//button |
<div class="login-container-784">
<label>Username</label>
<input id="user_87364" type="text" placeholder="Enter Username">
<label>Password</label>
<input id="pass_92837" type="password" placeholder="Enter Password">
<button class="btn-login-928">Login</button>
</div>
Dynamic XPath for username:
//div[contains(@class,'login-container')]//input[starts-with(@id,'user_')]Dynamic XPath for password:
//div[contains(@class,'login-container')]//input[starts-with(@id,'pass_')]Dynamic XPath for login button:
//div[contains(@class,'login-container')]//button[contains(@class,'btn-login') and normalize-space(.)='Login']WebDriver driver = new ChromeDriver();
driver.get("https://example.com");
WebElement username = driver.findElement(
By.xpath("//input[starts-with(@id,'user_')]")
);
WebElement password = driver.findElement(
By.xpath("//input[starts-with(@id,'pass_')]")
);
WebElement login = driver.findElement(
By.xpath("//button[contains(@class,'btn-login') and normalize-space(.)='Login']")
);
username.sendKeys("admin");
password.sendKeys("admin123");
login.click();
<div class="product-card-x78">
<h3>Laptop</h3>
<span>₹50,000</span>
<button class="add-cart-456">Add to Cart</button>
</div>
Dynamic XPath:
//div[contains(@class,'product-card')][.//h3[normalize-space(.)='Laptop']]//button[contains(@class,'add-cart')]<tr>
<td>John</td>
<td>QA Engineer</td>
<td>Mumbai</td>
<td><button class="edit-123">Edit</button></td>
</tr>
Dynamic XPath:
//tr[.//td[normalize-space(.)='John'] and .//td[normalize-space(.)='Mumbai']]//button[contains(@class,'edit')]//div[contains(@class,'search-result')][.//h3[contains(normalize-space(.),'Selenium')]]//a[contains(normalize-space(.),'View')]Dynamic XPath does not automatically cross an iframe boundary. Selenium must first switch to the iframe.
WebElement frame = driver.findElement(
By.xpath("//iframe[contains(@id,'login-frame')]")
);
driver.switchTo().frame(frame);
WebElement username = driver.findElement(
By.xpath("//input[contains(@id,'username')]")
);
When a new window or tab opens, Selenium must switch to the correct window before locating its elements.
for (String handle : driver.getWindowHandles()) {
driver.switchTo().window(handle);
}
Shadow DOM creates a separate DOM boundary. XPath cannot simply be used from the main document to directly cross a shadow root. Selenium provides ShadowRoot-related APIs that should be used when interacting with elements inside a shadow DOM.
When a JavaScript application replaces an element in the DOM, a previously stored WebElement may become stale. In such situations, synchronize with the application state and locate the element again when required.
In large automation projects, Dynamic XPath should be centralized inside Page Object classes or reusable locator methods.
public By usernameField() {
return By.xpath("//input[contains(@id,'username')]");
}
public By product(String name) {
return By.xpath(
"//div[contains(@class,'product-card')][.//h3[normalize-space(.)='" + name + "']]"
);
}
A maintainable XPath should clearly communicate what element it is locating. For example:
//div[contains(@class,'product-card')][.//h3[normalize-space(.)='Laptop']]//button[contains(normalize-space(.),'Add to Cart')]This locator identifies the Add to Cart button associated with the Laptop product rather than simply selecting an arbitrary Add to Cart button.
Answer: Dynamic XPath is an XPath expression designed to locate elements using stable portions of attributes, text, DOM relationships, or other conditions when some element properties change dynamically.
Answer: It is used when exact element attributes such as IDs or classes may change and a static XPath would become unreliable.
Answer: Common techniques include contains(), starts-with(), normalize-space(), text(), concat(), not(), position(), and last().
Answer: contains() checks whether a value occurs anywhere within a string, while starts-with() checks whether a string begins with a particular value.
Answer: Identify the stable portion of the ID and use contains() or starts-with().
//input[starts-with(@id,'username_')]Answer: Use stable portions of the class, text, aria-label, data attribute, or another reliable property.
//button[contains(@class,'login') and normalize-space(.)='Login']Answer: Use normalize-space().
//button[normalize-space(.)='Login']Answer: No. If a stable unique ID is available, the simpler ID locator is generally preferable.
Answer: Dynamic XPath can help locate elements whose attributes change, but explicit synchronization may still be necessary when the element is loaded asynchronously.
Answer: Test it in browser Developer Tools using the $x() function and verify that the expected element is returned.
Dynamic XPath is an important Selenium technique for locating elements whose attributes or other properties change dynamically. Instead of relying on a complete unstable value, testers can use stable portions of attributes, partial text, XPath functions, multiple conditions, and relationships between elements.
The most commonly used Dynamic XPath techniques include contains(), starts-with(), normalize-space(), text(), and, or, not(), positional predicates, and XPath axes such as ancestor, following, preceding, following-sibling, and preceding-sibling.
Dynamic XPath should not simply be made longer or more complicated. A good locator should be stable, specific, readable, maintainable, and preferably unique. If a stable ID or dedicated test attribute is available, that simpler locator should generally be preferred.
Dynamic web applications may also require synchronization. Therefore, Dynamic XPath should be combined with appropriate Selenium wait strategies when elements are loaded or updated asynchronously.
JustAcademy's Selenium training curriculum includes element location using XPath and CSS selectors, Selenium WebDriver, automation frameworks, and practical project-oriented learning. Explore Selenium Training.
For a free course demo and course-related discussion, visit Register for Course Demo.
