XPath axes (parent, following-sibling, preceding) in Selenium Java - Framework Patterns

Framework Mode - XPath axes (parent, following-sibling, preceding)

Folder Structure of Selenium Java Test Framework

  selenium-java-framework/
  ├── src/
  │   ├── main/
  │   │   └── java/
  │   │       └── com/example/pages/       # Page Object classes
  │   │           ├── LoginPage.java
  │   │           └── DashboardPage.java
  │   └── test/
  │       └── java/
  │           └── com/example/tests/       # Test classes
  │               ├── LoginTest.java
  │               └── DashboardTest.java
  ├── resources/
  │   └── testdata/                        # Test data files (CSV, JSON)
  ├── config/
  │   └── config.properties                # Environment and browser configs
  ├── utils/
  │   ├── WebDriverFactory.java            # WebDriver setup and utilities
  │   └── WaitUtils.java                    # Explicit wait helpers
  ├── testng.xml                           # TestNG suite configuration
  └── pom.xml                             # Maven build and dependencies
  

Test Framework Layers

• Driver Layer: WebDriver setup and teardown handled by WebDriverFactory.java. Manages browser instances.
• Page Object Layer: Classes representing web pages (e.g., LoginPage.java). Use XPath axes like parent::, following-sibling::, preceding:: to locate elements relative to others.
• Test Layer: Test classes (e.g., LoginTest.java) contain test methods using TestNG. They call page objects to perform actions and assertions.
• Utilities Layer: Helper classes for waits, logging, and WebDriver management.
• Configuration Layer: Properties files and TestNG XML to manage environments, browsers, and test suites.

Configuration Patterns

Use config.properties to store environment URLs, browser types, and credentials. Example:

  baseUrl=https://example.com
  browser=chrome
  username=testuser
  password=testpass
  

Load these properties in WebDriverFactory.java to initialize the correct browser and navigate to the right URL.

Use TestNG XML (testng.xml) to define test suites and parameterize tests for different browsers or environments.

Test Reporting and CI/CD Integration

• Use TestNG built-in reports for test execution results (pass/fail, skipped).
• Integrate with Maven Surefire plugin to generate HTML and XML reports.
• Use Jenkins or GitHub Actions to run tests automatically on code commits.
• Publish reports in CI/CD pipelines for visibility.

Framework Design Principles

1. Use Page Object Model: Encapsulate element locators and actions in page classes. Use XPath axes to write robust locators relative to known elements.
2. Explicit Waits: Use explicit waits (e.g., WebDriverWait) to handle dynamic page elements instead of implicit waits.
3. Configurable Tests: Use properties files and TestNG parameters to run tests on different browsers and environments without code changes.
4. Readable XPath: Use XPath axes like parent::, following-sibling::, and preceding:: to create clear and maintainable locators that reflect page structure.
5. Separate Test Data: Keep test data outside code in files like CSV or JSON for easy updates and data-driven testing.

Self Check

Where in this folder structure would you add a new page object class for a "UserProfile" page that requires XPath axes locators?

Key Result

Organize Selenium Java tests using Page Object Model with clear layers, config files, and XPath axes for robust element location.

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