Session 32 – Selenium with Java | Handling Auto-suggest… — Transcript

Learn how to handle dynamic auto-suggest dropdowns and static web tables in Selenium with Java using XPath and element inspection techniques.

Key Takeaways

Dynamic dropdowns require handling changing data and element order using flexible XPath.
Inspecting element attributes like name, role, and class helps create robust selectors.
Waiting for data to load is crucial before interacting with dynamic elements.
XPath can be constructed starting from parent UL element with role='listbox' to capture all options.
Selenium with Java can automate selection from auto-suggest dropdowns effectively using these techniques.

Summary

Explanation of different dropdown types: select, Bootstrap, hidden, and auto-suggestion dropdowns.
Focus on handling dynamic auto-suggest dropdowns like Google search suggestions.
Demonstration of inspecting elements and identifying attributes such as name='q' for the search box.
Use of dynamic XPath to capture all auto-suggest options within UL and LI tags.
Discussion on the structure of the dropdown: UL with role='listbox', multiple LI elements, nested div and span tags containing option text.
Techniques to wait for dynamic data loading from the server before interacting with elements.
How to count the number of options displayed and select a specific option dynamically.
Importance of XPath selectors that adapt to changing data and element order.
Use of browser developer tools and Selector Hub for XPath generation and validation.
Practical example typing 'Selenium' and selecting an option from the dynamic list.

Full Transcript — Download SRT & Markdown

Speaker A

In our previous class, we have seen how to handle different types of dropdowns. We have seen the select type of dropdown, then Bootstrap dropdown, hidden dropdown, and also have uploaded one assignment, auto suggestion dropdown. I think you have seen how to handle the Google search window. That's basically the dynamic dropdown. Let me go through that script we have done. So this is a script we have written for auto suggest dropdown.

Speaker A

the Google search window that's a m basically the dynamic top down uh let me go through that uh script what we have done so this is a script we have written for auto suggest drop down first of all let me show you uh what is auto suggest dropdown and which is also a dynamic drop down

Speaker A

First of all, let me show you what is auto suggest dropdown, which is also a dynamic dropdown because the data you will not get every time the same. So let's go to the Google page, and this is your Google search box. Here you can search for something, right?

Speaker A

because you will not get the same options every time and also you will not get the options in the same order the order can be changed and the datea also or the items will be changed okay and the

Speaker A

Here you can see as soon as you type some search string, you can see some auto suggestions here. These values are dynamic because you will not get the same options every time, and also you will not get the options in the same order. The order can be changed, and the data also, or the items, will be changed.

Speaker A

like once you provided your search string we can find how many options are displayed here also uh we can select one of the option and we can click on that option for example I type selenium here and in this we can select one of these option and like this and then it will go to the actual

Speaker A

Okay, and the number of items can also be changed. So this data is not constant data. This keeps changing based upon the search string. So in this case, we can capture this. We can do the same thing like once you provide your search string, we can find how many options are displayed here. Also, we can select one of the options and click on that option.

Speaker A

right click inspect and uh so this is a text area box it is just like an input box text area and uh there is a name attribute is here name attribute is Q so I have taken this attribute to find that

Speaker A

For example, I type Selenium here, and in this, we can select one of these options like this, and then it will go to the actual page. So this is a dynamic dropdown. To handle this, what we can do is first we have to launch our page and maximize it. This is the element, search box element, if I inspect this element.

Speaker A

this data so in this what I have done is first I have captured all the options and here xath is most important so we need to write one Dynamic xath so if I inspect one option for now and go to

Speaker A

Right-click, inspect, and so this is a text area box. It is just like an input box, text area, and there is a name attribute here. Name attribute is Q. So I have taken this attribute to find that element. So by name Q, do send keys, I provided some text here inside the text box.

Speaker A

multiple La tags are there each and every La tag is representing one item one search item you can see this Li is nothing but a list item so each and every La tag is representing one item and if you expand one of the LI inside this there is again one more dtag inside this there are

Speaker A

Once you provide some text here, the data comes from the server, which will take a few seconds to fetch all this data. So let's wait for five seconds there, and after that, you can operate this data. So in this, what I have done is first I have captured all the options, and here XPath is most important.

Speaker A

element let's say web drive so inside the span you can find this element selenium web driver inside the span this value comes dynamically okay and where is the span inside the D this is again inside the D D D D and finally all the DS are part of Li tag okay so let us write an xath

Speaker A

So we need to write one dynamic XPath. If I inspect one option for now and go to Selector Hub, okay, if you look at this, these are all options displayed dynamically, right? So if we go back and see the HTML under the UL tag, UL is nothing but a user list. Inside this, there are multiple LI tags.

Speaker A

start and what are the elements are there uh what are the attribute JS name class and role is there so I'll take a ro attribute so by taking help of this Ro attribute let us write an exper SL slul at

Speaker A

Each and every LI tag is representing one item, one search item. You can see this LI is nothing but a list item. Each and every LI tag is representing one item, and if you expand one of the LI, inside this there is again one more div tag. Inside this, there are multiple div tags, and where exactly is our item?

Speaker A

I'm also taking the class list box and at theate class equal to we can specify the class attribute still two elements so in that case class is not needed okay so let us have this so two elements are currently matching in this so we can say SL slash Li now we can see 10 elements are matching

Speaker A

If I just expand this div tag, there are many div tags. We need to find out exactly where our element is. Suppose I'm trying to inspect one element, let's say WebDriver. Inside the span, you can find this element Selenium WebDriver. Inside the span, this value comes dynamically.

Speaker A

in the span tag okay so now how we have return this uh inside the span tag so let me find this option one of this option yes if I look at here this is a span tag and inside the span tag you

Speaker A

Okay, and where is the span? Inside the div, this is again inside the div, div, div, and finally all the divs are part of the LI tag. Okay, so let us write an XPath for this, and that XPath should match with all the elements.

Speaker A

take this xath so this is also the right expon yeah B is present that is also part of the span so no problem because if you take B only will get a partial thing and if you if I look at at the

Speaker A

So first of all, where can we start? Let us start from the parent element, so that is the UL element. Okay, so from the UL element, we will start, and what attributes are there? There are attributes like name, class, and role. So I'll take a role attribute.

Speaker A

span tag everything is included in the span tag okay and there are multiple tags you may have in between but directly you can jump to the span tag because all these sear options are available in the span tag and all these are Again part of the list and all the lists are part of the user list

Speaker A

By taking help of this role attribute, let us write an XPath. So UL at the rate role equal to listbox, okay, and inside this role, there are many options, you can see. At the rate role equal to listbox, two elements are matching. When I take a role, two elements are matching, and inside this UL, role equal to listbox.

Speaker A

to presentation so for the list item also you have an exper at the rate r equal to presentation okay and then directly jump to the span Element 50 elements are matching when I say 50 elements are matching I think this role is having many places so let me remove

Speaker A

If you want, you can also take the class. I'm also taking the class listbox, and at the rate class equal to, we can specify the class attribute. Still two elements. So in that case, class is not needed. Okay, so let us have this. Two elements are currently matching in this.

Speaker A

let me check this one and this xath will keeps changing so I will put this xath now okay exactly 10 elements are matching so let me show you the same xath I have written so SL slul r equal to list box because this is the UL we have started from UL let me find

Speaker A

So we can say slash li. Now we can see 10 elements are matching, so all 10 search items are matching. But inside the LI, the actual item is there. Inside the actual text is there inside the multiple div tags, and once you navigate all the div tags, you can find that option in the span tag.

Speaker A

div tag that item is present okay actual tag is span tag but maybe the other options are not there in the span tag so we will take the parent one the span is also part of the div tag

Speaker A

Okay, so now how we have returned this inside the span tag? Let me find this option, one of these options. Yes, if I look here, this is a span tag, and inside the span tag, you can find all these things, right? So what I can do is I can say li slash span.

Speaker A

this okay and uh find out where exact L that element is present okay or else better to find one element okay this is a span okay so the role is option okay I have taken this one this is the element I have

Speaker A

Now we can see exactly all the text are matching because inside the span all the options are available. So I'll take this XPath. So this is also the right expression. The B is present; that is also part of the span, so no problem. Because if you take B, only you will get a partial thing.

Speaker A

this do second D tag so act our element is present inside the second dtag so second dtag and inside this first dtag and here roll equal to option this is the one I have taken Ro equal to option and inside the RO equal to option Li do ro equal to option so I have taken

Speaker A

If I look at the search string, some part is normal and another part is bold letters, right? So that's the reason they put it inside the B. Okay, so now if you inspect one of the elements again, see this is inside the span tag. Everything is included in the span tag.

Speaker A

and if you say Li only Li 10 elements but it is also when I say just Li it is also count it is also pointing uh these icons actually icons along with this this everything is one web element it is

Speaker A

Okay, and there are multiple tags you may have in between, but directly you can jump to the span tag because all these search options are available in the span tag, and all these are again part of the list, and all the lists are part of the user list UL tag.

Speaker A

one yeah many many ways you can write xath if I take 50 elements are matching I don't know where these 50 elements are coming from okay 10 elements are matching and uh inside this Li this is Li D we can skip all the D tags and we can directly

Speaker A

So accordingly, we can write the XPath. So first we will go to the UL tag, then list item. Okay, and if you want to specify this attribute for list item also, you can specify presentation role equal to presentation.

Speaker A

is again giving 50 elements so again I'm going to the above one so this one here I taken Ro equal to option when I take r equal to option D of r equal to option then it is giving so instead of taking

Speaker A

So for the list item also, you have an XPath at the rate role equal to presentation, okay, and then directly jump to the span element. Fifty elements are matching. When I say 50 elements are matching, I think this role is having many places.

Speaker A

it is giving 50 it's not accurate value so again I'll go to the above p parent this one so here I'm taking Ro equal to option so then it is giving 10 elements so this is the X path which is correct

Speaker A

So let me remove this. I think there are other list items having the same thing. So again, you can see 50 elements are matching. So this is not the right one. We need to get exactly these options.

Speaker A

there and uh then I can find I can read each and every option nor I have written normal for Loop you can also write enhanced for Loop suppose I want to select one of the option from that you

Speaker A

Okay, let's see another XPath will work or not. So let me check this one, and this XPath will keep changing, so I will put this XPath now. Okay, exactly 10 elements are matching.

Speaker A

one and uh the same option click it and after clicking it we no need to go with the further option as soon as you found required option just click it and after clicking that option you don't need to go further options so immediately just say break okay break it so based on the condition we

Speaker A

So let me show you the same XPath I have written. So slash ul at the rate role equal to listbox because this is the UL we have started from. UL, let me find this. Yeah, this is the UL role equal to listbox, and inside this, I'm directly going to the li tag.

Speaker A

and I got all the links in the web page so this is the way we can simply handle Auto suggest drop down this is auto suggest dropdown means as soon as you put some string it will show you all the

Speaker A

Inside this li tag, instead of span tag, I'm taking the div tag actually. So this is a li, inside the li there are multiple divs, and we need to find exactly in which div tag that item is present. Okay, actual tag is span tag, but maybe the other options are not there in the span tag, so we will take the parent one.

Speaker A

Google form as soon as you type something even without clicking on search box as soon as you type something Auto suggestions will come here okay so this is a simple example you can write this so so everybody's clear how to handle this Auto suggest box this is a one type of Auto suest

Speaker A

The span is also part of the div tag, so we'll take the div tag. Okay, so if I look at this again, there are multiple div tags. There is a parent div tag, and there are again three div tags. So let's go to the first div tag, expand this.

Speaker A

because this will be different some one type to another type so there are different type of Auto session boxes are there because developers will Design them in the different ways and the same approach may not be suitable for all kinds of Auto SES drop downs sometimes you need to change uh we

Speaker A

Okay, and find out where exactly that element is present. Okay, or else better to find one element. Okay, this is a span. Okay, so the role is option. Okay, I have taken this one. This is the element I have taken, role equal to option, and each and everything is an option here.

Speaker A

right so that's it and based on this you can just try other one and what is this bjs.com yeah this is also Auto suggest drop down same just like a Google this is also Auto suggest drop down you guys can try this okay this is the search box as soon as you type something uh okay

Speaker A

So if I filter by using role equal option, exactly we can filter 10 options. Okay, and this is the option I have taken. So where is it? It is the second div tag. Okay, so li tag contains one div tag, and inside this, the second div tag.

Speaker A

explain that later okay or I will do some coding and I'll upload it but you can try this that's not a big thing actually it's not it's a easy one you can try all right next one uh today's session we'll start with something called how to handle

Speaker A

So our element is present inside the second div tag, and inside this first div tag, and here role equal to option. This is the one I have taken, role equal to option, and inside the role equal to option li, do role equal to option.

Speaker A

capture the data and do some kind of validations okay basically there are three kinds of tables we can see on our applications uh static web table Dynamic web table and then page ination web tables so static web table means what there are fixed number of rows fixed number of columns

Speaker A

So I have taken this XPath. You can write this many ways. This is one of the...

Speaker A

keep adding and sometimes rows will be reduced the data is not fixed the data is dynamically changed that's called Dynamic web table and uh columns will be fixed okay in the dynamic web table columns will be fixed but the rows number of rows can be increased or reduced the data also

Speaker A

can be changed and table with pagination means suppose if the table contains 100 records right 100 rows but in the first table it will show only few records in the second page it will show show more records like that that's called pagination table so for example sample table I'm showing but

Speaker A

we will see this actual real time applications I look at this this is a static table fix the number of rows fixed number of columns the data also won't change the fixed type of data this is one type of web table static table pagination means what this is a page Nation So currently

Speaker A

five records are displayed if I go to the next page then it will show you some more records again if you go to the next page some more records next page some more records this is called page Nation table okay this is called page Nation table and this page Nation table design

Speaker A

can be different ways or designs are there the same design you cannot find okay let me show you uh but it is little bit tough to handle the dynamic page ination tables but we will also see how we can handle page Nation tables later so for example

Speaker A

uh I'll show you a sample page Nation table so admin open got yes at the table with multiple pages is called page Nation table so I'm just logging into this site this is I'm just showing the page Nation table how it will be in the real time applications okay so if we go back to the

Speaker A

customers okay this is another type of page Nation table you can see there are some customers list is displayed in customer name email address group status and added everything and if you go to the next one next page you can see some more details and you can navigate this each and every

Speaker A

page there are almost 1, 194 pages are there in this table and in the first each and every page it is displaying only 10 records okay so this is also a page Generation table but this is a little bit complex to handle but we will see that also but before directly going to this we

Speaker A

will see basic level tables we will try to understand actually what how to handle the table what are the tags we can find in HTML and how to write a dynamic xath and how we can pass parameters to the xath we have to learn few more Concepts before jumping into this table okay so

Speaker A

we'll see that also so static web table means what the data is static that will not change so this is the example so you can see book name other subject price and everything called This is called Static table no change every time same data same number of rows same number of columns

Speaker A

everything is same Dynamic web table means what the data keeps changing and also number of rows keeps adding that's called Dynamic table okay for example let's go to Orange HRM application and here you can see Dynamic table okay so once you loging into this okay so you can just go to admin see this is a dynamic table

Speaker A

actually this is also table but this is a more Dynamic so here you can see usern names user roles employee name status actions and here the columns are fixed but the data keeps adding or keeps removing deleting so suppose if you I want to remove some record here I can just remove it

Speaker A

so now number of rows are reduced one record is got removed so this is a dynamic table the data is not fixed every time okay and pagination table means this is a page Nation table you can keep changing the pages and you can read the data so these are the three different type of tables

Speaker A

now in the today's session we will try to handle the static table and in the next sessions we will see so pagination in the sense this is also Dynamic table because the data is also keeps changing here this is pagination plus Dynamic web table okay both are satisfied here dynamic as well

Speaker A

as pagination table okay so if in the dynamic web table if you just add pages that becomes a dynamic and pagination table so that we will see later tomorrow and today we will focus mainly on the static table because we want to learn some Basics from the web table and then only we can

Speaker A

can handle other type of tables so let's start with the static table first I'll show you all the tables first we'll start with the static table so you can see this is simple basic very basic table and we'll try to understand what are the different type of operations we can do on this

Speaker A

table okay so if you inspect this table first let us try to understand about the tags what are the tags we can find in HTML so if you look at here the table is a tag you can see the table

Speaker A

tag which is pointing the entire table and there is an attribute called name equal to book table and if you expand this table and you can see the T body tag table contains a t body T body means

Speaker A

table body it is representing the entire body of the table and inside the T body you can find multiple TR tags every TR is representing one table row how many many rows are in this those many number of TS you can find inside the T body so how many number of rows are there in the table

Speaker A

there are equivalent TRS you can find inside the T body so you can see every TR is representing a table row now if I expand the first TR first TR you can see the th tags so T is representing

Speaker A

table header table header so here book name other subject price so these are four items are there these four are the table headers so th is representing table header in each th there is a header name is present this is a first TR so first row is what header first row is considered

Speaker A

as a header now if you go to the second TI now from the second TI actual data is started so this data is represented with the TD tag TD is representing table data so in the second TR you

Speaker A

can see TD da each TD is having table data same thing is continued for every TR so third TR again multiple TDS are there fourth TR again multiple DDS so these DDS are representing the table data in the particular row so this is a structure of the web table so the table tag contains a

Speaker A

t body T body contains a TRS TR is nothing but a table row and the first TR contains a table head from the second here it is started table data TD tax and this is very very important so this

Speaker A

is the hierarchy of the table okay but sometimes some web tables you may not find uh TR tag for the heading okay they can put directly th tag okay so this keeps changing again table to table but these are the tags we can find in every table but the order can be different so

Speaker A

hierarchy same table T body inside the TRS each TR contains a table header okay now let us try to do some operations on this table so let's go to eclipse and create a new package for today this is a static

Speaker A

table okay so first of all uh I launch my page and everything so import this web driver and this is implicit weight and this is a page and this is a maximizing the web page okay now the first operation I'm going to do in this page so I want to find I want to find total number of

Speaker A

rows in a table so I want to find total number of rows in a table in this particular table I want to find total number of rows there are two different approaches are there so if you want to find total

Speaker A

number of r one approaches simply we can find number of TRS because every TR is representing every TR tag is representing row right so if you count number of TRS in a table that is exactly equivalent to number of rows so for example I'm writing One X path here first we go to the

Speaker A

table and there is a name for the table right what's the name attribute at theate name equal to uh Book Table Book Table so now this is matching with entire table one single table and inside this SL slash I'm directly go to T now we can see seven elements so this xath is returning all the rols

Speaker A

from a table this xath is returning all the rows from a table that is exactly equal to number of rows so by using this x paath we can capture the first requirement is find total number of rows in a table so now we can say driver dot find Elements by dot X paath okay now I can

Speaker A

put X path because this one is returning Seven Elements seven elements in the sense seven rows are exactly matching so when I say SL SL TR I can just skip T body as T body I can skip if you want

Speaker A

you can put T body also I can T body same value we will get but between whatever elements are there I can keep them right in the relative xath so I can say SL SL TR so this x path will return all

Speaker A

the TRS that I'm going to store in a variable or what I can do is you can simply use do size method directly because this will return return multiple web elements every row is considered as a web element every row is considered as a web element so once you get this at top of it

Speaker A

I'm using size method because this will written the list collection right a list of all the TRS on top of it I'm using size method so this will count to number of TI that means number of rows that I can store in a variable integer rows okay now I can just print so number of rows

Speaker A

is what gross so this is a one approach you can find you can write a next PATH which is pointing all the rows or which is capturing all the rows in a table and then you can count it yes okay so this is one approach so we have we got seven rows columns are represented by T

Speaker A

H yes so some tables you will have a SE column is separate tag column is included in the separate tag that is called th yeah th is also specified but in this table I have a th which is representing the columns as of now so these are columns which are representing table

Speaker A

header th tag and this th is a part of the TR tag first row contains a header part yes you are right okay now we find out the number of rows in a table so how we have done we have

Speaker A

find out all the rows and then on top of it we apply size method that is written number of row this is one approach there is another approach suppose instead of writing X paath I can use a tag name I can say driver dot find Elements by dot tag name so what is the tag name of all the rows

Speaker A

TR right so that I can specify here and this will also return all the rows it will also return all the rows and then I can find the size so this is also correct inter Rose okay but when I execute this earlier we got a seven right so now we'll see how many we'll get

Speaker A

so now this time we got a 14 what is a problem in this is this is actually counting the rows from all the tables which are present in your web page okay so this particular tag name of TR because in

Speaker A

the same page there are multiple tables are there this is one table this is another table is also there so this table is also having TRS right so basically what this tag name of TR will do this is counted TRS or table rows from all the tables which are present in the web page there

Speaker A

the reason we are not getting the right one so but this is right way okay this is also correct but when we have to use this one when we have to use this one if we have only one single table in

Speaker A

our web page if you have a one single table in your web page then you can use this approach tag name of TR single single table in the web page okay then it will work properly you can get the

Speaker A

all the TR from the table by using tag name but if you have a multiple tables in your web page if you have a multiple tables in the web page then better to write a EXA X path to capture the TRS

Speaker A

from the particular table because we are writing the locator for the particular table here right so we are capturing the TRS from the particular table okay so if we have a multiple tables in a web page then it is preferred okay this is preferred if you have a multiple tables if you have a one single

Speaker A

table in your web page then you can go with this approach both are correct but the second approach is not recommended if you have a multiple tables okay just remember that point so now current Curr I have a multiple tables I use first so this will give you seven rows present in a

Speaker A

table how does it Returns the TR of The Book Table because we specified in X paath right we specify x paath in x paath we specify the TR tag so it will return return all the TRS from the

Speaker A

table and in other way we can also specify the tag name whenever I say tag name of TR this will return return the TR of TR tags all the TR from the table so we use find elements anyway okay so in the second option we are not specified a specific table so it is rning TR from

Speaker A

all the tables that is a problem in the second but if we have a single table there is no problem it will also return the right one okay now similar way we can also find number of columns in a table

Speaker A

find total number of columns in a table so how to find a total number of columns in a table again we need to count number of columns and where exactly the columns are present in the first TR tag right the T body in the first TR actual columns are present so first we need

Speaker A

to go to the first TR tag and we need to find out how many T HS are there because the t is representing header or column so if you count how many ts are there that is exactly equal to number

Speaker A

of columns right so we will write an X paath for this now go to The Book Table in The Book Table I'll go to First TR s SL TR seven elements are matching but in which TR we have to go first TR

Speaker A

so we need to say index number one when I say TR of one now it is pointing header exactly you can see this when I say TR of one first row it is pointing when I said TR of two second row

Speaker A

pointing when it's a TR of three next row is pointing okay so to count to the header part how many columns are there we need to go to the first row so I say one inside this I have a th

Speaker A

tag so I can say th now four elements are there so exactly equal to four colums are there so can we try to reduce this x path can we reduce this x path by removing this TR of one because the

Speaker A

entire table the th tag is present only in this place and other TS don't have a th tag right can we remove the ster of one yes we can remove this now still it is giving four elements it is

Speaker A

directly jumped to the th so now we can use this x path to capture the number of columns or headers driver dot find Elements by do X paath okay dot size so this will exactly written number of columns so that I can print here number of Cs

Speaker A

done let's execute okay so number of columns are four can we use Tag name here tag name driver Dot find Elements by do tag name of what th right all the th tags I can capture do size store in

Speaker A

the variable now you can see so previously it is written four now we'll see what this will return see eight is rning because it is also counting from other tables so same approach again so the first one xath is preferable if you have a multiple tables

Speaker A

multiple table now if you have a single table then this is a preferable single table okay currently this is not applicable but there are two different ways we can capture it but using xath or by using tag name so mostly preferable is xath uh if you have a single

Speaker A

table in the web page then you can use a tag name okay nothing wrong in that so this is how we can find number of rows and number of columns in a table now the next operation so everything is depends on the tags only so we will count the number of tags TR tax that is

Speaker A

equal to number of rows when you count number of th tax that is exactly equal to number of column now the next requirement is suppose I want to read data from specific row and column read data from specific row and column I want to read data from specific row and

Speaker A

colum xath is most important right so when you working with the tables okay now I want to capture some data from this table let's say I want to capture this one master in selenium so that is the data I want to capture so how we can capture this if you inspect that element see I'm

Speaker A

inspecting this element it is giving One X path okay will this x path works every time so this xath will capture master in cylind and whichever row or whichever column it is doesn't matter so wherever it is in this table this xbo will able to capture this one but now my requirement is I want

Speaker A

to capture this from the specific row and column specific row and column so for example in which row this value is present here 1 2 3 4 5 fifth row and in which column it is present First Column

Speaker A

so my requirement is I want to capture the data from fifth row and First Column okay let's say an example fifth row and first colum fifth row and First Column whatever data it has doesn't matter I want to capture this fifth row and First Column then how we can write an X paath

Speaker A

for this element so let's try to write it so I will go to the table first table tag table at the rate name equal to Book Table I think T is uppercase Book Table so now I went to table and

Speaker A

in the table which row that element is present fifth row so I can say SL SL Dr and I say SL SL Dr it is pointing all s rows seven rows now which row we want to go fifth row so we pass the index

Speaker A

five fifth row now exactly it is pointing this xath is pointing fifth row so inside the fifth row there are multiple TD tags are there so which column data we want which TD you want first DD so SL slash TD of one TD of one so this is exactly pointing to the El so whatever value

Speaker A

is there inside in here that will be captured so tomorrow this values got changed still this xath will able to capture the value which is present in the fifth row and First Column so this xath I can use to captur the data so driver. findind element we are capturing one single data this

Speaker A

is not th th is representing header TD because from the second row all all these are present in the table data you can see TD de are there TD is representing table data th is only for first row okay if you want to capture the headers you can use first TR and th but the rest of the rows

Speaker A

are having TD table data okay so it should be TD of one so now I'm trying to use this xath driver.

Speaker A

find element by. XPath okay and this will return the element but from that web element we have to extract the text so how can extract the text from the web element so this will return return the web element so how to extract the text yeah continue dot get text okay so this will get the element

Speaker A

fifth row and First Column from that we are extracting the text value that is a actual value that I'm going to store in a string I'll name it as a uh book name that I can print so I can just

Speaker A

print book name like this okay so we can capture the data from specific row and specific column yeah now we can see master in selenium so we can capture the data from specific row and a specific column just we need to write an X paath and top of it we use

Speaker A

get text method so get text is a method which will capture the text from the web element okay so if you want to capture specific row and column just you need to change the row and column suppose I want to capture something called uh this one

Speaker A

JavaScript yes because this expert this is returning the output right get text method will return return the text value or string value that's the reason I'm storing into the variable and then I'm printing it here so from the web element I'm capturing the text value that I'm

Speaker A

storing in a variable that I'm printing here basic question okay now we can see this suppose I want to capture the JavaScript which is there in the last row last row and the third column so what is the row number here how to write a next part same TR TD but we can just change the numbers so TR of

Speaker A

7 7eventh row and the third column see JavaScript is pointing so just by changing the row number and TD number row number and column number TR is representing the row TD is representing the column so just by changing the row number and column number we can point any of the data in

Speaker A

this particular table okay so this expert this is the way we can write an expert so whichever data you want to capture from this table you can just change only row number and the column number that's it okay now suppose I want to read all the data from the table means all the rows and

Speaker A

adds all the columns everything so then we need to go for looping statement okay so by looping statement we can read both requin read all the all read the data from all the rows and columns read data from all the rows and columns it is very simple so this particular statement is

Speaker A

reading the data from specific row and specific column right now we need to put this inside the looping statement and every iteration we have to pass row number and column number now we need to parameterize the value into the xath so here we have hardcoded the row number and

Speaker A

column number but this time we have to pass this value dynamically in every iteration we have to pass a new row number a new column number so it is just like a matrix form so if I look at

Speaker A

the table it seems Matrix form right rows and columns seems a two dimensional array even in the two dimensional array also we have a kind we have a same kind of a structure right so if you want to read all the rows and columns we have to go with the nested for Loop because

Speaker A

to increment the number of rows we have to write one for Loop to increment The Columns we have to write another for Loop so two different for Loops are required now let me write a for Loop so outer for Loop is representing the outer for Loop is for what repeating the rows so inner

Speaker A

for Loop is what repeating the columns in every row so now observe how I writing the condition in outer for Loop integer are equal to so we already counted number of rows right here it is so that I'm going to start so row number one so row number one is what header part row number

Speaker A

one is a header part so we include we ignore it we will start from the second row because actual data is started from the second row so what I will do is I will start from the second row because first

Speaker A

row I have ignored because it is having header part now how many times we have to repeat depends upon the number of rows R less than or equal to rows because we already counted number of rows here so R less than or equal to rows every time we have to increase the R value by one r+ so this is

Speaker A

how we need to write outter fun okay because rows we already count size is also we already used here so finally we get the number of rows so that I can directly use now the second for Loop is for what

Speaker A

incrementing the number of columns so we can start columns from the one itself 1 2 3 four columns are there so in columns c equal to 1 C less than or equal to number of columns we already counted here

Speaker A

number of columns that I'm using and C++ every time I'll increase the column number by one now come here so we have already return One X paath to get exact value right that I'm going to copy so what I will do is to gapture the value from specific row and column first we need to go to the

Speaker A

table here whichever row number and column number we passed that particular value will be captured by the get text so instead of passing five and one here R is representing the row C is representing the column now I will pass this R and C here okay so here I'm passing the R value dynamically here

Speaker A

I'm passing column value dynamically so then what will happen in every iteration these values keeps changing so accordingly we will get all the data from the table okay now but here the problem is we cannot directly pass the variables inside the xon okay so R is one

Speaker A

variable C is another variable we can directly pass the numbers integers like this but we cannot directly pass the variables but how we can solve this problem so still if you want to pass the data through the variables we have to follow a small syn tax what you need to follow is whatever R you

Speaker A

specified okay and before and after first of all yeah before and after keep two plus and include everything in the double quotes like this this is a syntax okay keep this R between plus and plus and put everything in the double quotation this is the expart syntax I have not invented

Speaker A

this okay this is expath syntax if you want to pass parameters into the EXP path dynamically you can pass like this the variable you can keep between plus and plus and keep everything in the double quotes same thing is applicable for C also you can put C in the double quotes and

Speaker A

then add plus before and after C so this is the way we can pass Dynamic values into the xath okay so you never pass the strings into the xal you never pass strings into the X path only the index numbers you can pass only the index numbers you can pass so here r value C value you

Speaker A

cannot directly specify the variables instead of specifying the variables you can keep that in the double quotes along with plus before and after so now what happens r value C value keeps changing in every iteration and then the new values will be substituted and this will able to capture

Speaker A

the text value that I'm going to store in a string that's the string value and after that I will just try to print here system print I can just print value so this is how we can read all the data from the tables and how we can pass parameters to the xath very very important

Speaker A

how to pass parameters to the xath this is a syntax okay keep that variable in the double quotes first then add plus before and after the variable only two things keep the variable in the double quotes I'll show you one more time very simple syntax first keep the variable in

Speaker A

the double quotes then add plus before and after the variable everything should comes under the double code this is a syntax okay now let us run this so this is just like a two-dimensional array what it is called so this is a syntax of the X path okay normally uh if you take this

Speaker A

one you people are not concentrating actually so I'm repeating already multiple times see if you pass number let's say here I'm passing one okay here I'm passing two this is the static value so this will get the data from first row and second column and here I'm passing two here I'm

Speaker A

passing three and this will get the data from the second row and third column but how we can pass this value dynamically suppose I have something called row number is two and column number is three now I want to instead of passing the hardcoded value I want to pass this variables I

Speaker A

want to pass this variables so if you want to pass this variables what you can do is you can cannot directly specify R and C like this you cannot directly specify the variables inside the X paath so but how we can pass these variables the data how we can pass into xath so we need to follow

Speaker A

the xath syntax so first keep the variable in the double quotes and add plus before and after same thing here also keep that variable in the double quotes and before and after add plus operator so now this r value two will be substituted here C value 3 will be substituted here okay so this

Speaker A

is how we need to write an X path if you want to pass the variables as a parameters you need to follow the syntax you understood everyone is this clear to everyone please confirm in the chat box so there is no specific name for the syntax this is syntax which you have to follow in xath

Speaker A

if you want to pass parameters to the xath we have to follow the syntax just put the variable in the two double quotations and you add plus plus before and after this is a syntax we have to follow okay so very very important this will be very very useful in the coming

Speaker A

examples just remember this how to pass parameters into the X paath same thing we applied so now let us execute and see whether it is able to read all the data yes right so now we got all the data but it is not exactly in the table form we just captured

Speaker A

the text right but if you want to align exactly in the table format so I want to get the data exactly uh in the same format at and the table format how we can do we can just slightly design

Speaker A

it instead of print Ln you can say only print and after completion of inner for Loop here you can just write one print Ln so that will jump to the next line and after printing the value you can

Speaker A

just give one tab space when I say slash T it will add one tab space between the data okay or you can say empty value so this will give add or else you can put something called SLT so this will

Speaker A

also add one tab space after the value so now you'll get exactly the data in the tabular format okay I think this is a forward slash okay so now we can see this is a backward slash we have to use so this is a Java

Speaker A

command R okay if I put backward SL T after printing the value it will give one tab space see now you got exactly in the table form so this is the first row the second row third row fourth fifth and sixth row so we got all the rows except

Speaker A

the header part okay so now suppose if you want to print header also I want to print the header also then how we can do this I just want to print header so here we are starting from row number two

Speaker A

we have just ignore the first one right so can we put row number one here if you put row number one can we get header yes or no according to the table when I say from the first row can we get

Speaker A

the header part when I start from one actually we should get header also but in this table there is a problem actually what is a problem let me show you so this is the xath we have written right go

Speaker A

back and see this is the xath we have written so here whatever row number we specified and TD means table data specified it is capturing the data from the table it is just changing the row number and a

Speaker A

column number okay suppose if you put row number one row number because I want to get the header also so I put row number one and table data also right tdf one so then see Zero element why it is

Speaker A

zero element because in the first row there is no TD tags in the first TR there are no TD tags only th tags are there okay so if you write an X paath like this this is valid for all the rows except

Speaker A

the first row because in the first row there is no TD tag in the first row there is a th tag so what is a problem in this if you put a th here then we cannot read the rest of the rows if you put

Speaker A

TD here then we cannot read the header because header is having a separate tag and the data is also having a separate tag so that's the reason I have eliminated header part I have started from the second okay but if you still want to print header you can simply write one print statement

Speaker A

here only header right you can just print one statement print Ln so you can put header like this so you can put book name first header is what book name okay and then give one tab space and also concatenate the second column is what other second Colum colum

Speaker A

is other concatenate again one more tab space and the next column is what subject concatenate and give one more tab space concatenate and the last column is a price just print a column column names okay now you'll get a column names

Speaker A

now we can see along with the column names we got all the data from the table so this is how we can read data from the table by passing values into X path or to parameters the data into

Speaker A

X so is this clear everyone so to read all the data from the table we have to use a nested for Loop fine now let me show you another requirement sometimes we have to retrieve the data based upon certain condition okay so let me show you something

Speaker A

else conditional based we can also retrieve the data so here we have WR all the data all the columns now my requirement is read data from okay read data or we can say I want to print book names whose author is mes so this is a conditional based see in the table I have

Speaker A

multiple books there are multiple books but I want to print book names only if the author is Mukesh so according to this data how many books are there how many books are written by Mukesh two books this is the one book and this is another one right these two books are written by

Speaker A

Mukesh now I want to print only book names they are written by mukes that's my requirement so how can we do this we need to think about the logic so first condition is what condition is based upon the name of the other other name right so I want to print book names it can be any book

Speaker A

but the author of the book should be Mukesh that's a condition so what we need to do now we have to read each and every other one by one wherever you find a mukes from the same row we

Speaker A

have to capture the First Column data and suppose mukes is matching here then immediately capture this book and next go to the next rows and here one more time it is matching so capture this so like this we have to repeat each and every other name and wherever the mukes is matching we have

Speaker A

to capture that value okay first thing let us print other names how to print this only other names from this table let us write an expert only other names I want to print one by one so other name is in which column second column so the TD should be what two when I say TR of

Speaker A

one from two we will start so now we can see TR of two second row second column first order is matching and suppose I say TR of three second order CR of four next order TR of five next

Speaker A

one TR of six next one TR of seven next one so just by Chang ing TR number I will I will get all the other names one by one right so I will try to use this xath to capture the other names

Speaker A

one by one inside the looping statement okay so I will write one first a looping statement and here I will start r value from two R less than or equal to number of rows all the rows I want to continue then r++ and here I'm writing one xath driver. find element

Speaker A

by. XPath okay here I'm passing the R value but two value is fixed two is fixed dot get text so this will actually return the other name so I can say string other name so here just by changing row number we will able to get the others or not the column number is

Speaker A

constant two we don't need to change but just by changing row number one two next three okay just by changing the row number we are able to get other names so what I will do this r value I will pass here instead of seven I'll pass r value so then what is the syntax here put that

Speaker A

in the double quotes use plus operator before and after so after that I will just print other names okay I will just print a other name here so what this Loop will do for now this Loop will read all the others from the table every other so let's try to execute and see we

Speaker A

will get all others from The Book Table so we captured only others column from all the rows yeah perfect now we got all the others one by one we are getting getting into the looping statement but this is not our requirement what is our requirement if this particular other name

Speaker A

is mukes then we will capture the book name so instead of printing what I will do I will put one condition what is the condition if this particular other name dot equals mes okay if the other name is a mes so then what we should do if other name is mesh what we should do suppose here

Speaker A

I put seven where is the Mukesh second row for example okay now it is pointing to second row and second column second row second column is Amit third row third row and second column is Mukesh now this xer is matching with Mukesh now I captured Mukesh what is our requirement if he

Speaker A

is a mukes then I want to capture the data from the book name I want to capture the book name again it is the same row it is the same row but the column value is but one column value is one

Speaker A

so in the second column author name is there First Column book name is there so this xath is matching for what mukes then on the same row that means on the same third row we have to capture the first

Speaker A

Value First Column that is a book name so what I will do is I capture the Other Name by using this x path if other name is equal to mukes then from the same row I will capture the First Column

Speaker A

data and that becomes the book name you understood now everybody's understood this condition okay so first I have captured the other name if he is a mukes then immediately what I have done same row whatever row we have referred same row but we went to First Column and captured

Speaker A

the book name I think this book name variable we already used somewhere com okay now I got a book name so then I will print here system. out. print and book name that's it so every row only row value will be incrementing but here the column values are constant so we don't

Speaker A

need to write another for Loop just one for Loop is now just observe it is just wring the books which are written by the so this is the way we can also retrieve the data based on the condition yeah now we can see learn Java master in selenia so I got a book names

Speaker A

but along with this book names I want to also print other name we already capture the other name right can I print it here yes give one tab space and then con with the other name so now I'll get a two columns book name plus other

Speaker A

name okay perfect so this is a book name is mes book name and also mes so this is how we can also read the data based on the condition so first we capture other names and with then compare with Mukesh if it is equal then capture the book name and print it if other than mukes

Speaker A

if you get any other other the condition become false then again it will go up and repeat the loop so everybody's understood this how to retri the data based on the condition everything is xath guys if you know the xath how to create and how to

Speaker A

use everything will be easy yeah SLT is representing the one tab space so this is just a one tab space after printing the book name it will give you one space then it will print auor name so this is actually Java SLT will give you Java SLT

Speaker A

if there is a duplicate mukes it will count all the Mukesh see Mukesh is duplicated right here and here two times are repeated so there the reason it is written in two books it is written in two books have you seen the output in the output it

Speaker A

is displaying two books no problem even it is a duplicated it is counting all the mes the question is doesn't make any sense actually because I already put two times mes is repeated two times here and here duplicate you can have any number of times doesn't matter

Speaker A

it will read all the books from mes okay so now let me show you another requirement on the same table so here the the last column you have a prizes for each book there is a one some prizes there now I want to capture all the prices and I want to find the total price

Speaker A

of the books that's my another requirement here is only first name but what if both makes has a different last name you can use contains method instead of equals you can use contains method equals method exactly match with string okay if you have a first name and last name totally

Speaker A

different then you can use contains method and whichever is common you can put that everything is depends on the methods okay how we can use effectively right now let's see how we can find total price of all the books so how we can get it so first we need to

Speaker A

capture the price for each book then finally we have to find out total price but first of all we have to capture the prices for every book right so let us see how we can achieve this next one find total price of all the books find the total price first of all we have to capture the

Speaker A

prices for every book so what I can can do is I can write One X path for this which column it is fourth column so first go to the second row and fourth column so 300 is matching just

Speaker A

change only row number column number is constant so only just change the row number I say three now 500 matching four then 300 is matching when I say fifth row 3,000 is matching sixth row 2,000 matching seventh row 1,000 matching just by changing row number we are getting the

Speaker A

prices right same xath we can use so same Loop same concept but slightly we have to change okay so here instead of other name we will get the price so we are passing the row number and what is the column number of price four that we can specify here let's try to print the prices

Speaker A

okay I'm just printing the price see you got all the prices so when you capture the value from the web application everything will be in the string format so even though it is displaying the numbers when you read the data by using get text the get text method is always written the string format

Speaker A

data so if the data is in string format can we do arithmetic operations can we find Total if the data is in string format can we find the total of the prices no no if it is in string

Speaker A

format we cannot find total price because it will be concatenated basically when I use L operator it will be concatenated so what we should do now we should convert this price into number format integer format right then we can add so what I will do instead of printing the price I will take

Speaker A

a one variable here total integer total equal I'm making a zero initially now what I will do is here I will write an expression total equal to Total plus because every time whatever I'm getting a price I will add the price to the total value but if I add like this is a syntax error why because

Speaker A

the total is an integer variable whereas price is a string type of variable so we cannot perform uh arithmetic operations so we need to convert the price into numeric format how to convert how to convert yes in Java we already learned it integer dot percent of price so we converted

Speaker A

this into integer format and then we have added to the total and after that so after completion of the F Loop because in every iteration you are getting new price that will be added to the total and once the loop is completed this total variable contains a total price so After

Speaker A

exiting from the for Loop here we have to print the total total price of the books here I'll print the okay 7,100 fine so this is how we can handle web table so we can do different type of operations depends upon

Speaker A

our requirement and depends upon the test case so everybody's understood how to handle static web table how to handle the static web table so how to find the rows how to find the columns how to find the data how to read specific row and column data how to read all the rows and columns

Speaker A

data everybody's clear yes now based on this I'll give you an assignment today and rest of the tables we'll discuss in the next sessions uh Dynamic table page Nation we will see in the next class and the today's session I'll give you an assignment you guys can try this

Speaker A

so this is a web application blaz demo.com go to this website okay so here uh it is just like a booking a ticket functionality so here we already know how to handle the dropdowns in the last class we already seen so what you have to do is from

Speaker A

this particular page select the departure City whichever City you want select a destination city from the drop down and click on the find flights then you will see the table and in this table what you have to do is you have to find the lowest price in the table lowest price so

Speaker A

there are multiple prices are there which one is the lowest $200 is the lowest price and once you find the lowest price go to that row and click on the choose this flight whichever is lowest you need to click on that okay now you will get another form in this you can fill all

Speaker A

these data first name address city state all the these are all normal input boxes again this is the drop down box put some dummy data and check box and then click on the purchase flight so once you click on the purchase flight you will see this message thank you for your purchase today so you

Speaker A

have to validate this message we have to validate this message so this is a one test case you have to automate and the major challenging thing is finding the lowest price in the table and this price may not be in the third row sometimes it will be in the first row sometimes the lowest

Speaker A

price will be the last row sometimes the lowest price will be in the middle of the row wherever it is you need to find it for that one logic we need to implement what we need to do was we need

Speaker A

to capture the prices information all prices into an array variable we have to create one array all prices we have to capture in that particular array and after that we have to sort that array sorting of elements so once you sort an elements you will get the lowest to highest right so first value

Speaker A

you have to take from AR okay let me explain the logic just try to implement this because we already know Java arrays concept everything so we have to implement here see whatever topics we learn in Java we are going to implement see these are the current prices which we have so we need to

Speaker A

capture all the prices into array so for example let's say this is my array I have taken so 470 2 432 200 765 233 okay so first we need to capture all the elements one by one into array variable

Speaker A

now we need to sort these elements by using arrays do two sort method is there built-in method once you sorted now all the values will be ordered in ascending order once you arrange them in the ascending order first value will be 200 rest of the values will be added so once you sorted okay

Speaker A

you need to capture the first value 200 okay and wherever 200 is matching you need to read each and every value wherever the 200 is matching you need to go there and click on this link or button in

Speaker A

the same row you have to click on this button this is a logic you have to implement I will upload the solution also first try yourself your own self and whenever you get a doubt just refer my example and rest of the thing is everything is same normal flow only this is the tricky

Speaker A

stuff but other than this everything is a normal flow can just go back and here is a starting point so you need to select the departure City and destination city from the drop downs whichever you want click on the find flights then you'll get a

Speaker A

table find the lowest price and click on the choose this flight and fill all the details click on the purchase flight then verify this message this message is correctly displayed or not at least thank you message should be there can you do it so this is the assignment for

Speaker A

today try this I will also upload the solution for this and if you have any doubt or if you stuck somewhere you can go through my solution you will understand at least the Sorting technique you can understand okay so let us stop here for today's session tomorrow we

Speaker A

will discuss other things Dynamic table along with the page ination we'll see in the tomorrow session okay so one more thing uh when you're converting that into array uh I think you don't need to uh convert actually because let me tell

Speaker A

you so when you read these prices into array it will come as a string actually because the first character is a dollar so you will read all the values in the form of strings and strings also you can sort right even you can s because the dollar is the same for every value so

Speaker A

anyway it is sorting based on the values only so string array can sort string array you can sort so you don't need to convert this into numbers not at all needed just capture this data in the single Dimension array then sort it and capture the first value from array that

Speaker A

will be the 200 and go to this link and click on it so you don't need to convert this into number nothing no need because we can also sort string arrays right St sort method will work for Strings also so there is no necessity of converting the data so just follow as it

Speaker A

is fine so that's all for today I'll stop here tomorrow we'll discuss uh one table which is dynamic as well as page Nation both in one single table but practice this today session you need to understand this otherwise you can't understand the page Nation table but in the page

Speaker A

table there are so many things uh we need to understand something new stuff we will learn in the the page Nation table all right so that's all for today I'll stop here tomorrow we'll

Topics:SeleniumJavaAuto-suggest dropdownDynamic dropdownXPathWeb automationGoogle search dropdownSDETQA automationWeb element inspection

Frequently Asked Questions

What is an auto-suggest dropdown in Selenium automation?

An auto-suggest dropdown is a dynamic dropdown where the options change based on the input text, such as Google search suggestions. It requires handling dynamic data and element order in Selenium scripts.

How do you locate dynamic dropdown options using XPath?

You start from a stable parent element like a UL with a specific role attribute, then navigate to LI elements representing options, and finally to nested span tags containing the option text, creating a dynamic XPath that matches all options.

Why is waiting important when handling auto-suggest dropdowns?

Because the dropdown data is fetched dynamically from the server, there is a delay before options appear. Waiting ensures the data is fully loaded before Selenium interacts with the elements, preventing errors.

Get More with the Söz AI App

Transcribe recordings, audio files, and YouTube videos — with AI summaries, speaker detection, and unlimited transcriptions.

App Store Google Play

Or transcribe another YouTube video here →