XPath axes (parent, following-sibling, preceding) in Selenium Java - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ locator

intermediate

Identify the correct XPath using the parent axis

Given the HTML snippet below, which XPath expression correctly selects the

element that is the parent of the with text 'Price'?

Selenium Java

<div class="product">
  <span>Price</span>
</div>

A //span[text()='Price']/parent::div

B //span[text()='Price']/child::div

C //div[span='Price']/preceding-sibling::span

D //span[text()='Price']/following-sibling::div

💡 Hint

The parent axis selects the direct parent node of the current node.

Option A uses the parent axis to select the div that contains the span with text 'Price'. Other options select incorrect axes or nodes.

❓ locator

intermediate

Select the correct following-sibling element

Which XPath expression selects the

element that immediately follows the

with text 'Item 2'?

Selenium Java

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
</ul>

A //li[text()='Item 2']/preceding-sibling::li[1]

B //li[text()='Item 2']/parent::ul/li[3]

C //li[text()='Item 2']/following::li[2]

D //li[text()='Item 2']/following-sibling::li[1]

💡 Hint

The following-sibling axis selects siblings after the current node.

Option D correctly selects the immediate next sibling li after 'Item 2'. Option D selects the previous sibling, C selects a child by position, and D selects the second following li which is 'Item 4'.

❓ Predict Output

advanced

What is the result of this XPath query?

Given the HTML below, what text will be selected by the XPath expression //h2[text()='Chapter 2']/preceding-sibling::h2[1]?

Selenium Java

<div>
  <h2>Chapter 1</h2>
  <h2>Chapter 2</h2>
  <h2>Chapter 3</h2>
</div>

A Chapter 2

B Chapter 3

C Chapter 1

D No nodes selected

💡 Hint

preceding-sibling selects siblings before the current node.

The XPath selects the first h2 before 'Chapter 2', which is 'Chapter 1'.

❓ assertion

advanced

Which assertion correctly verifies the presence of the parent element?

In Selenium Java, which assertion correctly verifies that the parent of the element located by //span[@id='price'] has the class 'product'?

Selenium Java

WebElement priceSpan = driver.findElement(By.xpath("//span[@id='price']"));

A Assert.assertTrue(priceSpan.findElement(By.xpath("child::div")).getAttribute("class").equals("product"));

B Assert.assertEquals(priceSpan.findElement(By.xpath("parent::div")).getAttribute("class"), "product");

C Assert.assertEquals(priceSpan.findElement(By.xpath("following-sibling::div")).getAttribute("class"), "product");

D Assert.assertTrue(priceSpan.findElement(By.xpath("preceding-sibling::div")).getAttribute("class").contains("product"));

💡 Hint

Use the parent axis to find the parent element.

Option B correctly uses parent::div to find the parent div and asserts its class attribute equals 'product'. Other options use incorrect axes or methods.

🔧 Debug

expert

Debug the failing XPath locator using axes

A test fails because the XPath //div[@class='menu']/following-sibling::ul/li does not find any elements. Given the HTML below, what is the main reason for failure?

Selenium Java

<div class="menu">Main Menu</div>
<ul>
  <li>Home</li>
  <li>About</li>
</ul>

A The <ul> is not a following sibling of the <div>, it is a following node but not sibling.

B The XPath should use preceding-sibling instead of following-sibling.

C The <ul> is a child of the <div>, so child axis should be used.

D The XPath syntax is invalid because axes cannot be used after attribute filters.

💡 Hint

Check the HTML structure to see sibling relationships.

The

is not a sibling of the
but a following node at the same level, so following-sibling axis does not select it. Option A is incorrect; the XPath syntax is valid. Option A is wrong because preceding-sibling is the opposite direction. Option A is wrong because
is not a child of
.

Practice

1. Which XPath axis selects the immediate parent of the current node?

easy

A. following-sibling::

B. child::

C. preceding::

D. parent::

Solution

1. Step 1: Understand XPath axes purpose

   XPath axes define relationships between nodes, like parent or siblings.

2. Step 2: Identify axis for immediate parent

   The parent:: axis selects the direct parent node of the current element.

3. Final Answer:

   parent:: -> Option D

4. Quick Check:

   Parent axis = parent:: [OK]

Hint: Parent axis always uses 'parent::' prefix [OK]

Common Mistakes:

• Confusing parent:: with child:: axis
• Using following-sibling:: to select parent
• Using preceding:: which selects previous nodes, not parent

2. Which of the following is the correct XPath syntax to select all following siblings of a node?

easy

A. //div/preceding-sibling::*

B. //div/following::sibling

C. //div/following-sibling::*

D. //div/following-sibling

Solution

1. Step 1: Recall correct axis syntax for following siblings

   The axis for following siblings is following-sibling:: and it requires a node test like * for all siblings.

2. Step 2: Check each option syntax

   //div/following-sibling::* uses following-sibling::* which correctly selects all following siblings. Others are incorrect syntax or wrong axis.

3. Final Answer:

   //div/following-sibling::* -> Option C

4. Quick Check:

   Following siblings = following-sibling::* [OK]

Hint: Use 'following-sibling::*' to select all following siblings [OK]

Common Mistakes:

• Omitting '::' after axis name
• Using 'following::sibling' which is invalid
• Confusing preceding-sibling with following-sibling

3. Given the HTML snippet:

<ul>
  <li id='item1'>First</li>
  <li id='item2'>Second</li>
  <li id='item3'>Third</li>
</ul>

What text will this XPath select?
//li[@id='item1']/following-sibling::li[1]/text()

medium

A. Second

B. No text selected

C. Third

D. First

Solution

1. Step 1: Understand the XPath expression

   The XPath selects the first li element with id 'item1', then selects its first following sibling li element, and gets its text.

2. Step 2: Identify the first following sibling of 'item1'

   The first following sibling li after 'item1' is the li with id 'item2' which contains text 'Second'.

3. Final Answer:

   Second -> Option A

4. Quick Check:

   Following sibling of item1 is item2 = Second [OK]

Hint: following-sibling::li[1] selects immediate next sibling [OK]

Common Mistakes:

• Selecting the current node text instead of sibling
• Confusing preceding siblings with following siblings
• Assuming index [1] means first child, not sibling

4. Identify the error in this XPath expression:
//div[@class='menu']/preceding-sibling::div[2]
What is wrong?

medium

A. preceding-sibling axis cannot use index

B. The index should be inside parentheses like (preceding-sibling::div)[2]

C. XPath axes cannot be used after predicates

D. No error, expression is correct

Solution

1. Step 1: Understand XPath indexing with axes

   When using an index with axes like preceding-sibling::div, the index applies to the node set returned by the axis, so parentheses are needed.

2. Step 2: Correct the XPath syntax

   The correct syntax to select the second preceding sibling div is (preceding-sibling::div)[2], not preceding-sibling::div[2].

3. Final Answer:

   The index should be inside parentheses like (preceding-sibling::div)[2] -> Option B

4. Quick Check:

   Index with axes needs parentheses [OK]

Hint: Use parentheses around axis before indexing [OK]

Common Mistakes:

• Placing index directly after node test without parentheses
• Assuming axes do not support indexing
• Confusing predicate indexing with axis indexing

5. You want to select the parent div of a span element that has a class 'highlight', but only if the parent div has a following sibling div with class 'footer'. Which XPath expression correctly achieves this?

hard

A. //span[@class='highlight']/parent::div[following-sibling::div[@class='footer']]

B. //span[@class='highlight']/parent::div/following-sibling::div[@class='footer']

C. //span[@class='highlight']/preceding::div[@class='footer']/parent::div

D. //span[@class='highlight']/parent::div[preceding-sibling::div[@class='footer']]

Solution

1. Step 1: Understand the requirement

   Select the parent div of a span with class 'highlight', but only if that parent div has a following sibling div with class 'footer'.

2. Step 2: Analyze each XPath option

   //span[@class='highlight']/parent::div[following-sibling::div[@class='footer']] selects the parent div of the span and filters it by checking if it has a following sibling div with class 'footer', which matches the requirement exactly.

3. Final Answer:

   //span[@class='highlight']/parent::div[following-sibling::div[@class='footer']] -> Option A

4. Quick Check:

   Parent with following sibling filter = //span[@class='highlight']/parent::div[following-sibling::div[@class='footer']] [OK]

Hint: Filter parent with predicate checking following sibling [OK]

Common Mistakes:

• Selecting following sibling instead of filtering parent
• Using preceding-sibling instead of following-sibling
• Misplacing axes order causing wrong node selection