XPath axes (parent, following-sibling, preceding) in Selenium Java - Test Execution Trace

Test Overview

This test verifies locating web elements using XPath axes: parent, following-sibling, and preceding-sibling. It checks that the correct elements are found and their text matches expected values.

Test Code - JUnit

Selenium Java

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.junit.jupiter.api.AfterEach;
import org.junit.jupiter.api.BeforeEach;
import org.junit.jupiter.api.Test;
import static org.junit.jupiter.api.Assertions.assertEquals;

public class XPathAxesTest {
    WebDriver driver;

    @BeforeEach
    public void setUp() {
        driver = new ChromeDriver();
        driver.get("https://example.com/xpath-axes-demo");
    }

    @Test
    public void testXPathAxes() {
        // Locate child element
        WebElement child = driver.findElement(By.id("child1"));

        // Use parent axis to get parent element
        WebElement parent = child.findElement(By.xpath("parent::*"));
        assertEquals("parent-div", parent.getAttribute("id"));

        // Use following-sibling axis to get next sibling
        WebElement nextSibling = parent.findElement(By.xpath("following-sibling::*[1]"));
        assertEquals("sibling-div", nextSibling.getAttribute("id"));

        // Use preceding-sibling axis to get previous sibling of nextSibling
        WebElement preceding = nextSibling.findElement(By.xpath("preceding-sibling::*[1]"));
        assertEquals("parent-div", preceding.getAttribute("id"));
    }

    @AfterEach
    public void tearDown() {
        if (driver != null) {
            driver.quit();
        }
    }
}

Execution Trace - 6 Steps

Step	Action	System State	Assertion	Result
1	Test starts and Chrome browser opens	Browser window opens at https://example.com/xpath-axes-demo	—	PASS
2	Find element with id 'child1'	Page loaded with element <div id='child1'>	Element with id 'child1' is found	PASS
3	Find parent element of 'child1' using XPath 'parent::*'	Parent element with id 'parent-div' is located	Parent element's id attribute equals 'parent-div'	PASS
4	Find following sibling of parent element using XPath 'following-sibling::*[1]'	Following sibling element with id 'sibling-div' is located	Following sibling's id attribute equals 'sibling-div'	PASS
5	Find preceding element of following sibling using XPath 'preceding-sibling::*[1]'	Preceding element with id 'parent-div' is located	Preceding element's id attribute equals 'parent-div'	PASS
6	Test ends and browser closes	Browser window closes	—	PASS

Failure Scenario

Failing Condition: Element with the specified XPath axis is not found or attribute does not match expected value

Execution Trace Quiz - 3 Questions

Which XPath axis is used to find the parent element of 'child1'?

A parent::*

B following-sibling::*

C preceding::*

D child::*

Key Result

Using XPath axes like parent, following-sibling, and preceding-sibling helps navigate complex page structures efficiently. Always verify the XPath expressions against the actual DOM to avoid locating errors.

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