XPath axes help you find elements related to a known element on a webpage. This makes locating elements easier and more precise.
XPath axes (parent, child, sibling) in Selenium Python
/parent::tagname /child::tagname /following-sibling::tagname /preceding-sibling::tagname
Use parent:: to move up to the parent element.
Use child:: to find direct children of the current element.
Use following-sibling:: or preceding-sibling:: to find siblings after or before the current element.
section element that is the parent of the div with id 'main'.//div[@id='main']/parent::sectionli elements that are direct children of the ul with class 'menu'.//ul[@class='menu']/child::lip elements that come right after the h2 with class 'title' as siblings.//h2[@class='title']/following-sibling::pinput element that is a sibling following the label with text 'Username'.//label[text()='Username']/following-sibling::input
This script opens a simple HTML page in a headless browser. It uses XPath axes to find:
- The parent
sectionof adivwith id 'main'. - All
lichildren of aulwith class 'menu'. - The
pelement following anh2with class 'title'. - The
inputelement following alabelwith text 'Username'.
It prints the results to show the correct elements were found.
from selenium import webdriver from selenium.webdriver.common.by import By # Setup WebDriver (make sure chromedriver is in PATH) from selenium.webdriver.chrome.options import Options options = Options() options.add_argument('--headless') driver = webdriver.Chrome(options=options) # Open a simple test page html = ''' <html> <body> <section> <div id='main'>Content here</div> </section> <ul class='menu'> <li>Home</li> <li>About</li> <li>Contact</li> </ul> <h2 class='title'>Welcome</h2> <p>This is a paragraph after title.</p> <label>Username</label> <input type='text' /> </body> </html> ''' # Load HTML content driver.get('data:text/html;charset=utf-8,' + html) # Find parent of div#main parent_section = driver.find_element(By.XPATH, "//div[@id='main']/parent::section") print('Parent tag of div#main:', parent_section.tag_name) # Find children li of ul.menu children_li = driver.find_elements(By.XPATH, "//ul[@class='menu']/child::li") print('Number of li children in ul.menu:', len(children_li)) # Find following sibling p of h2.title following_p = driver.find_element(By.XPATH, "//h2[@class='title']/following-sibling::p") print('Text of following sibling p:', following_p.text) # Find following sibling input of label 'Username' input_elem = driver.find_element(By.XPATH, "//label[text()='Username']/following-sibling::input") print('Tag of following sibling input:', input_elem.tag_name) driver.quit()
Always test your XPath expressions in browser DevTools first to make sure they find the right elements.
Using axes like parent:: or following-sibling:: helps when elements don't have unique IDs.
Axes navigation can make your tests more stable and easier to understand.
XPath axes let you find elements related by parent, child, or sibling relationships.
They help locate elements more precisely when IDs or classes are missing.
Using axes improves test reliability and clarity.
Practice
Solution
Step 1: Understand XPath axes
XPath axes describe relationships between nodes, such as parent, child, or siblings.Step 2: Identify the axis for parent node
Theparent::axis selects the direct parent of the current node.Final Answer:
parent:: -> Option BQuick Check:
Parent axis = parent:: [OK]
- Confusing parent:: with child::
- Using sibling axes to find parent
- Forgetting axes syntax with double colons
<li> elements of a <ul> element?Solution
Step 1: Understand child axis usage
Thechild::axis selects direct children of the current node.Step 2: Apply correct syntax for child
Usinglielements//ul/child::liselects alllichildren oful.Final Answer:
//ul/child::li -> Option DQuick Check:
Child axis syntax = child:: [OK]
- Using parent:: instead of child::
- Using sibling axes for children
- Omitting the axis and expecting child selection
<div> <h2>Title</h2> <p>Paragraph 1</p> <p>Paragraph 2</p> </div>
What does the XPath
//h2/following-sibling::p[1] select?Solution
Step 1: Understand following-sibling axis
Thefollowing-sibling::p[1]selects the firstpsibling after theh2node.Step 2: Apply to given HTML
Afterh2, the firstpis "Paragraph 1", so it selects that element.Final Answer:
The first <p> element inside the <div> -> Option CQuick Check:
following-sibling::p[1] = first p after h2 [OK]
- Selecting the second
pinstead of the first - Confusing preceding-sibling with following-sibling
- Thinking it selects children instead of siblings
div element://div/preceding-sibling::div[1]But it returns no elements. What is the most likely reason?
Solution
Step 1: Understand preceding-sibling axis
Thepreceding-sibling::div[1]selects the immediate previous siblingdivelement.Step 2: Reason why no elements returned
If no elements are returned, it means the currentdivhas no preceding siblingdiv.Final Answer:
The <div> has no preceding sibling <div> elements -> Option AQuick Check:
preceding-sibling returns nothing if no previous siblings [OK]
- Thinking axes can't be used with //
- Confusing parent:: with preceding-sibling::
- Assuming preceding-sibling selects children
span elements that are children of a div whose immediate parent is a section. Which XPath expression correctly uses axes to achieve this?Solution
Step 1: Understand the hierarchy
Thespanelements are children ofdiv, and thatdivis a child ofsection.Step 2: Build XPath with axes
//section/child::div/child::spanselectsspanchildren ofdivchildren ofsection.Step 3: Check other options
//div/parent::section/child::spanselectsspanchildren ofsection, which is incorrect.//section/parent::div/child::spanand D misuse axes or order.Final Answer:
//section/child::div/child::span -> Option AQuick Check:
Use child axes from section to div to span [OK]
- Using parent:: in wrong direction
- Selecting wrong node levels
- Mixing sibling axes instead of child axes
Ready to prove it?
Pass the test and this pattern moves unknown
