Problem Statement: findElements hrefs & InnerText properties + string Conversion and sorting checks
Many a times we have to fetch more than one element and then in a loop work on verifying the content.
How to use different element properties for solving the test scenarios
Using language specific string to integer conversions, string handling and also sorting mechanisms, augmenting selenium power to solve our testing goals
Problem case study
The case study is taken from https://www.crossword.in
Let us define the testing goal which will help in giving a practical twist to our problem statement
- Open site https://www.crossword.in/
- Choose “Books” from tabs visible (we would like to confirm the number of books found)
- Click on Price: Sort by Price: high to low from the dropdown
- We want to ensure that the books are indeed sorted on price high to low (Test)
This is how actually most CPSAT Practical Exam questions are constructed, where participants have to solve real life problem statements applying Selenium and language specific learnings.
Following screen shots (Image1.jpg) help define the case study
Solution
Let us try to solve the case study step by step
Step 1 – Locator strategy
We need to get the locator for the book menu
Using google chrome – when the book menu is inspected, the xpath provided by chrome is as below
//*[@id=”nav-menu-915599″]/ul/li[2]/a
The element is
<a href=”/books” class=” “>Books</a>
Let us try constructing custom xpath – both the following custom xpath also works
//a[contains(text(),”Books”) and @class=” “]
//li[2]/a[contains(text(),”Books”)]
Once we click on the books, We would also need locator for the select dropdown
Both of the following xpath locators will work
//div/select
//*[@id=”sort_type”] ->> is given by chrome inspect
Once we are able to click on high to low drop down the books are displayed.
Incidentally there is no cost or price of the book that is displayed on the page.
Please see the screenshot below
The goal is to check or ensure that the books are really shown in the high to low price order.
This is where we have two approaches to proceed
- Approach A, This is what a manual tester would take. It would start with clicking on the book, going to the book page, keeping a note of the book price and then doing it again for next few books and verifying if the book order is as per the high to low price. When we do it in automated manner we would do the same, it would start with fetching all the book elements one by one, getting their hrefs (the book pages), going to the book page and then extracting the individual book price and keeping a track in some list and then checking if the price is correctly sorted in high to low order.
- Approach B, we would look for some other means of finding if the page contains the book price in some hidden elements and then using the same checking if the order of the book displayed is proper or not (High to Low)
Step2 – Approach A – going the manual testing way
We would need to do the following
- Find all the books on the page
- Get their hrefs
- Visit the book page
- Get their price
- Store the same in a list or a data structure of choice
- Check if the high to low sorting order is maintained
The locator should be such that it gives all the book elements having href of the books
A quick inspect on the first three books shows the following xpaths
//*[@id=”search-result-items”]/li[1]/div/div[1]/a
//*[@id=”search-result-items”]/li[2]/div/div[1]/a
//*[@id=”search-result-items”]/li[3]/div/div[1]/a
We can easily replace li[1] , li[2], li[3] with li[*] – it will give all the books.
Please see the following image
And then on visiting the page, the following xpath is able to give the price, checked with the first two books
//*[@id=”pricing_summary”]/div/div[2]/span/span
Step 2 – Approach B – Looking at alternative ways to fetch the price of the books
A closer look at the elements while inspecting the book element, reveals that there is another sibling node“Price”
Please see the image below
The element code is as below
<span class=“price”> <span class=“variant-final-price”> <span
class=“m-w”><span class=“m-c c-inr”>Rs.</span>38,750</span>
</span>
</span>
The child node has a class name variant-final-price, and it has an inner span and a text which shows the correct price.
We can use the following xpath to browse through all the elements such that we can get the price.
//*[@class=”variant-final-price”] , better is to use //*[@class=”variant-final-price”]//*[@class=”m-w”]
The only challenge is that the element is a hidden element and the normal getText() method does not work.
The attribute innerText has to be used.
Please check the properties section of the chrome devtool tab – image below
The entire code is shared in the section below
We will have to use getAttribute(“innerText”) to get the price.
Step 3 – Final Code for approach A
The code takes care of string to integer conversions, including using substring and also replacing characters. Sorting using collections.sort() and collections.reverse() methods are being used. ArrayList is the preferred collection object which is being used in the code below. Please see the entire code below, it has enough comments for you to understand. At the same time the code can be downloaded from the dropbox link provided below.
==================================================== CrossWordExerciseMethodA.java
The code file CrossWordExerciseMethodA.java can be downloaded from the below URL
https://www.dropbox.com/s/411kr3exg3sfiek/CrossWordExerciseMethodA.java?dl=0
Step 3 – Final Code for approach B
The code takes care of string to integer conversions, including using substring and also replacing characters. Sorting using collections.sort() and collections.reverse() methods are being used. ArrayList is the preferred collection object which is being used in the code below. Please see the entire code below, it has enough comments for you to understand. At the same time the code can be downloaded from the dropbox link provided below.
==================================================== CrossWordExerciseMethodB.java
Full code for CrossWordExerciseMethodB.java can be downloaded from the below URL
https://www.dropbox.com/s/40g7wrjcmmd07p4/CrossWordExerciseMethodB.java?dl=0
About CPSAT
CP-SAT is the number 1 globally recognized selenium certificate. If you know selenium and you are not CP-SAT you are definitely missing something.
https://cpsat.agiletestingalliance.org/
CP-SAT and Agile Testing Alliance is always looking for Selenium evangelists who can help in curating such blogs, help in curating conferences and our community initiatives like CPSATday and Meetups.
ATA is helping teams transform. If you have testing teams who do not know selenium automation, ATA will help you transform.