<<Previous Post << Complete Tutorial>> Next Post>
In the previous article, I have practically demonstrated text() XPath Function.
In this article, I am going to explain the next XPath Function known as contains()
Difference between text() and contains() XPath Functions
While we need to provide the entire text of the UI element to the text() XPath Function in locating the UI element, whereas we can provide the partial text to the contains() XPath Function for locating the UI elements.
Using contains(), we not only locate the UI elements using their text, but we can also provide this function with the partial values of attributes in the HTML tags.
Let’s get started with practical demonstrations.
Selenium Locators – contains() XPath Function
Follow the below steps for practicing the contains() XPath Function:
1) Before demonstrating the contains() XPath function, first I would like to practically demonstrate that the text() XPath function cannot locate the UI elements using partial text.
Open http://omayo.blogspot.com/ in Chrome Browser, where ChroPath is already installed (Refer ChroPath installation in Chrome Browser here and its usage in Chrome Browser here ) as shown below:
Right click on the below text element and select ‘Inspect’ option as shown below:
From the below HTML code that got highlighted on inspection, observe that there is some text between the start and end tags:
From the above-highlighted text, let’s take the partial text say ‘PracticeAutomation’ and build the below Relative XPath Expression:
//p[text()=’PracticeAutomation‘]
Let’s execute the above Relative XPath Expression having text() function in ChroPath and observe that it won’t be able to locate the UI element using the partial text as shown below:
Hence text() XPath Function cannot locate the UI elements using the partial text, instead, we need to provide it with complete text to locate.
We can overcome this problem using contains() method using which we can locate the UI elements using their partial text.
I will build the Relative XPath function using both contains() and text() along with above said partial text as sh0wn below:
//p[contains(text(),‘PracticeAutomation‘)]
Note: You need to clearly follow the above syntax.
Let’s execute the above Relative XPath Expression having contains() and text() functions in ChroPath and observe that we are able to locate the UI element using the partial text as shown below:
We can also use the dot (.) instead of text() function in the above XPath Expression as shown below:
//p[contains(.,‘PracticeAutomation‘)]
Let’s execute the above Relative XPath Expression having contains() and dot in ChroPath and observe that we are able to locate the UI element using the partial text as shown below:
Hence we are able to locate the UI elements on their page using their partial text by using contains() in XPath Expressions.
2) As already mentioned at the beginning of this article, contains() not only locate the UI elements using their partial text, but also using the partial values assigned to the attributes of HTML tags.
Let me demonstrate this with an example.
First, let’s inspect the below Checkbox UI element on the page and observe that the HTML for the checkbox got highlighted as shown below:
From the above-highlighed HTML code, let’s select the value=’orange’ attribute & its value.
Now, out of the above orange text, lets only take the partial text ‘ra‘ and create the Relative XPath Expression using the contains() function as shown below:
//input[contains(@value,’ra‘)]
Let’s execute the above Relative XPath Expression having contains() and observe that we are able to locate the UI element using the partial attribute value text as shown below:
Hence we are also able to locate the UI elements using their partial values of HTML attribute inside tags by using contains() function.
3) Till now we have understood, how the contains() function can be used to locate the UI elements using their partial text or partial attribute values.
Now, I am going to explain the actual purpose of contains() function in real time Selenium Automation cases.
There may be some situation where we won’t be able to locate the UI elements on the page as their attribute values change dynamically.
For example: In the id=’123QAFox123‘, the before & after numbers are dynamically changing to something say id=’456QAFox456‘.
We can simply create a Relative XPath Expression using contains() function as //tagName[contains(@id,’QAFox‘)]
Though I cannot replicate the above purpose and example in a real-time web application now, we can simply use the above strategy to deal with such dynamical changing things in real time applications.
Here concludes this article.
In the next article, I will practically demonstrate the starts-with() XPath function.
Next Steps:
- > To learn more about Selenium, continue to the next post (Click on Next Post link below)
- > Check complete Selenium Tutorial Contents here (Click here)
Please leave your questions/comments/feedback below.
Happy Learning ?
On a mission to contribute to the Software Testing Community in all possible ways.
<<Previous Post << Complete Tutorial>> Next Post>