Now that we have learned how to open our URL, now let's understand how we can, you know, work with
some things like locating the elements, interacting with the elements and stuff like that.
Now if I want to, let's say let's go back to our old, uh, code that we did in the last episode.
Let's just run it.
So it just opened Yahoo!
Now let's say I want to locate this search bar.
How can I do this?
I can simply do this by one.
Multiple methods.
And this is the first step of web automation is always to go and look for possible options.
So let's say I have.
Yahoo!
Dot com.
Let's just go to this yahoo.com site.
So the very first thing is to go to this site and see the possible outcomes.
And what you want to do is you want to right click on it inspect.
You can do this by shift control.
And I also so basically we want to open and locate the you know this particular element in our uh code
here.
So we can see that this is the element.
Now one thing you can do is you can simply go ahead and check for the name.
This is one way to do this.
Otherwise ID.
So these are the two methods.
One is by name, another is by id.
And let's try to fetch these information first.
And then we will try.
Because name and IDs are always unique with elements classes are not.
So two elements can have same classes but ID is unique for each element.
That's why we can use id or name.
All right.
So what we do is that after we get into this URL, what do we want to do is we want to locate this element.
And we can locate this element by using a certain command.
But to use that command we have to import something which is from selenium dot webdriver dot common
dot by import by.
So we want to be using that by so that we say okay by ID or by name right.
Like that.
So what we want to do is we want to say driver dot find elements.
So basically find element.
And after that it takes two argument.
So the find my find element uses two element.
One is by what so we say by.id.
And then the second element is the value of that by.
So in this case our id is this.
So let's just copy this and just paste it over here.
So we just located that element right.
So let's save this into a variable called search bar equals right.
So let's try to um what do we want to do is let's say I want to feed in the value.
So what I can do is this is an input field.
You can see this is an input field into any kind of input field.
What we can do is we can say that field dot send keys and whatever we want to send.
So let's say test.
Strain.
Right.
So if I do this and run it.
So it'll open yahoo.com.
It will locate that element that search bar.
Let it load and then you can see it just sent that key test string.
Now it's waiting for 10s our time dot sleep.
And once it is done, it will just close.
Now that's awesome.
That is magic.
Basically what we were able to do was we were able to go into a website, find an element and pass our
keys.
That is awesome, right?
This is really next level.
All right.
So that is one way to interact with an element.
This is an example of interacting with an input element right.
How about if I wanted to click on the button here on this search button.
It's not that hard.
We just do the same thing.
Go inspect on it and check for the you know, labels.
Now here let's say I want let's say this does not have any values right.
This does not have an ID.
How would I do that then.
If it didn't have any ID then what I would do is for example, um, everything has ID here.
We'll come to another example, maybe where it does not have ID, maybe we'll try over there.
But for this also we'll use by ID let's say so ID so what do we want to do is we want to say a new element.
This is search button BTN equals same thing.
Find driver dot find element by id.
And inside that ID it is this search button.
Now once I have located that button what I can do is I can just click on that button.
So search button dot click.
So if I do this and run it it opens Google Yahoo.
It passed in test string and clicks on that button search.
So you can see automatically, I didn't do anything right.
Just click that button.
And now we have this here.
This is really awesome.
So that's how we can click on an element.
So let's say I passed in a button you know a a value.
Let's say let me go to let's try this same thing with Google.
So let's say I go just to um covet just my name.
Okay.
We have a pretty good information about this.
So let's say I go to firstly to Google and I can you know, what I can do is I can okay.
Here.
The thing is let's say I go and inspect here so I can also click here and just like that.
So I get the text area here and here it has ID also.
So let's try with Google now.
So let's say I remove everything from here I just comment everything.
All right.
So what do we get is we just get the google.com and search bar is just going to be by ID this one.
So we just pass in that ID right there.
And let's say I want to send the key covet 20 which is my name.
And let's say I also want to find the button which is this Google search button.
So let's try to inspect that.
Okay.
For example, this does not have any ID.
How can I access this?
Now one way is to get with the name.
Another way is by right clicking on it.
Copy XPath.
XPath is an awesome tool to do this.
So now not anymore by ID but now by XPath.
So since it does not have ID so I'll just paste that XPath here.
So this XPath means basically it's an XML path which is which derives where that element is.
So it's inside HTML body tag.
Uh second div tag third div fourth div tag.
There is a form.
There is a second div and there is another second div.
There is another fourth div.
And then there is a center tag.
And then input tag right.
So like that it knows that's where it is.
And I can just click on it right.
So let's try this.
Google search.
Awesome.
This is this happened automatically just in like milliseconds, right?
Awesome.
So now that we have this, how about if we if we can get a particular information.
So let's say I want to get and click on the first link.
How would I do this I would do this basically.
Uh firstly I would increase the length of it because the, you know, site and the, the, the site
opened by the Google and Google from here are different.
So that's why I would want to wait for this here.
It just opened.
Now I just want to go into this inspect.
Let's say I want to find this first link.
And I would just just go ahead and.
So the first link is gonna be.
This one here.
So let's try to this a ref.
So let's try to get into this element.
So copy XPath.
Let's try.
So let's say I say I will say first link is equal to driver dot find element.
So now again by XPath.
So XPath and I just pass in that XPath.
And I just say first link dot click.
So once I do that let's try.
So it just opens it.
Google Covid search and clicks on the first link goes to LinkedIn.
So that's my LinkedIn profile.
This is really like a magic.
Like if you can do this in proper way and if you can learn the proper techniques of this, this is a
game changer.
And there are lots of, you know, pros using web automation with selenium.
Now this is just one part of how we can, you know, send information, click on information.
You know, things like that.
There are lots of other things that we can do and, uh, perform.
All right.
So the next thing that we'll be doing is, uh, we learned how to locate and interact with elements
in our Chrome and in our browser.
Now, the next thing that we'll be learning is basically going into this test login platform.
And we'll be, you know, trying to log in into this form.
It will create a session with this login code.
And we'll save this session into a cookie.
And next time we'll run it.
So next time we open this thing it will not ask for let's say the it will not ask for this thing.
So it will automatically log in.
So that's what we'll be doing.
So it's called saving the browser session as cookies.
So I'll see you in the next one.
Till then you can practice and locate elements and interact with elements.