How to Find Xpath in Selenium C#

During the Automation, We need XPath to interact with elements, In the last selenium C# tutorial, We have seen how to create a custom Xpath in Selenium C# In this tutorial, we will see how we can find Xpath of TextBox, Input box, Link, Button, and Check boxes that are present on the webpage.

Find Xpath in Selenium C#

As we see many things on a webpage they are referred to as components or elements, some common components that we generally see on any webpage are Text boxes, Buttons, links, Check Boxes, and Radio Buttons. Let’s create some simple examples to get the Xpath of these HTML elements.

XPath using Textbox or input in Selenium C#

We see a Text box as a common component on the webpage which is used to take user input in the form of text. When we want to find the Xpath of any  TextBox then we can find it by writing the Xpath with node name with their attribute names.

Syntax:

//<Nodename>[@attribute='value']
//<Nodename>[@att1='value' and @att2='value'....]

For example- if we want to find an input box or Text box which has attribute id =”email” then we will write it’s Xpath like below.

//input[@id='email']
//input[@name='email']
//input[@id='email' and @autocomplete='username']

We can write the Xpath by combining the attributes with and operator.

Find Button’s Xpath in Selenium C#

Another common component we see on web pages is the Button most of the web pages have a Button on it for any submitting purpose, for any calculating things or for moving us to the next page, etc.

To Get Button XPath, just Inspect element and Observe the attributes of the button. Now create Button’s XPath using node name and attribute.

The button can be an input element or can be a button element. Here we can write both in the place of node name input as well as button.

Syntax:

//<Nodename>[@attribute='value']
//<Nodename>[@att1='value' and @att2='value'...]

For example- if we want to find XPath of any log-in button which is present on the webpage so we can write their Xpath like below.

//button[@id='loginbutton'] 
//button[@name='login'] 
//button[@id='loginbutton' and @type='submit']

XPath of Check Box in Selenium C#

Check boxes are also shown on the web pages where webpage taking any input in the form of selection from more than one option can be selected.

When we want to find the Xpath of any  Check Box then we can find it by writing the Xpath with node name with their attribute names. Here the node name will be input.

Syntax:

//<Nodename>[@attribute='value'] 
//<Nodename>[@att1='value' and @att2='value'...]

For example-

//input[@id='sponsored-shortcuts']
//input[@type='checkbox']
//input[@id='sponsored-shortcuts'and @type='checkbox']

XPath of a Hyper Link in Selenium C#

Hyperlink work on a webpage that redirects us to another webpage that is connected with it. The Hyper Link is always written with the anchor tag <a> with the “href ” attribute.

It doesn’t have any further attribute, whenever we see <a href=’ ‘>it means it is representing a hyperlink. When we want to find the Xpath of it so follow the instructions.

For example- if we see a hyperlink which is <a href=”https://drive.google.com/drive/my-drive”>To continue to Google Drive</a> so we can write the Xpath like.

//a[@href='https://drive.google.com/drive/my-drive']

But here is one drawback for using this Xpath, that if in future the webpage name will change so our Xpath will also fail.

For example- if the webpage name will change from https://drive.google.com/drive/my-drive to https://drive.google.com/drive/my-drive1 so here what we can do is, as you can see there is some string written between the anchor tag we will use here the text() for Finding the webpage. The solution is like below.

//a[text()='To continue to Google Drive']

Now when we write this Xpath and click on eval then it will highlight the corresponding hyperlink present in the webpage.

XPath of a Radio button in Selenium C#

We see the Radio button on the webpage where only one option could be selected while selecting them. Radio buttons are also created with the help of input tags so for finding its Xpath we can use the syntax.

Syntax:

//<Nodename>[@attribute='value']
//<Nodename>[@att1='value' and @att2='value'...]

For example, the First and the third example will show us the exact same corresponding radio button but using the second example which is //input[@type=’radio’] it’s not appropriate for finding the Xpath of anyone’s radio button.

//input[@id='u_3_4_Kf']
//input[@type='radio']
//input[@id='u_3_5_0B' and @type='radio']

Because it gets confused while choosing between more than one radio button which are present on the webpage and they all have the type property as ‘radio’ so it will select or highlight all the radio buttons of the webpage.

So avoid using such kind of Xpath. Instead of this, I will prefer you to use another two Examples of the Xpath for Radio button.

These are some Xpath for finding the common components on the webpage in Selenium C#, I hope you have understood it properly.