<<Previous Post << Complete Tutorial>> Next Post>>
WebDriverIO – isExisting
isExisting Command Returns true if the element you are looking for exists in the DOM. In Simple words Based on the selector passed, it will look into Document Object Model whether that selector is present or not. If it is present then it will return True else False.
Syntax :- $(selector).isExisting()
Pre-requisite: Have ‘Visual Studio Code’ IDE installed in your machine (Click here to install if not installed in your machine)
Here is the small Exercise where we will check Hidden Element which is just a Hidden Button is present on the page is found by isExisting() command of WebDriverIO or not?
Using isExisting() Command
First, I will demonstrate the exercise where we will see the place of Hidden Button where it is existing in DOM, and then by the Help of isExisting(), we will see we are able to find it’s existence on DOM or not.
Exercise:-
1) Navigate to http://omayo.blogspot.com/
2) Observe the Hidden Button with Value Hidden But Button is present on the Dom.
3) Hidden Button can be seen on the Webpage on removing Value Hidden from its properties.
Practical Demonstration:-
Following are the Steps to Perform above exercise (i.e., to identify button element is present in DOM with being a hidden property associated with it) using WebDriverIO Automation code in ‘Visual Studio Code’ IDE :
Pre-requisite: Download the project from here (Click here to Download) and Unzip it.
1) Open Visual Studio Code on your system.
2) Click on File and select Open Folder. Select the project folder on which your workspace is present.
3) Expand ‘test’ from the Explorer, right-click on the displayed ‘specs’ and select ‘New File’ option as shown below:
4) Give any name of the newly created file say ‘isExisting_command_test.js’ and copy the below-given code into the newly created file as shown below and save the file:
The following is the WebDriverIO sample code for finding out the hidden Element is present on the page by using isExisting() command of WebDriverIO on ‘omayo.blogspot.com’ application.
You can understand this code, by reading the comments provided in the below code:
describe('This Example show usage of isExisting() command in webdriverio',() => { it('should give us true if element is present on the page else returns false',()=> { browser.url('http://omayo.blogspot.com'); var elementPresent = $('#hbutton').isExisting(); console.log(elementPresent); }); });
5) Click on ‘wdio.conf.js’ to open in the IDE, and make sure the Test file name is updated properly and browser name should be changed from firefox to chrome in this file as shown below and save it:-
6) Click on Terminal and Open New Terminal.
7) Git Bash Terminal will look like this as below:-
8) Start Selenium Standalone server using the command as given below:-
./node_modules./bin./selenium-standalone start
9) Open Another Terminal like we did in step 6 and run below command
./node_modules./bin/wdio wdio.conf.js

Observe that the ‘isExisting_command_test.js’ will get executed successfully. The chrome Browser will launch, then it will look out the element based on the XPath and respective action will be taken by WebDriverIO Automation code.
And also, the result will be displayed as ‘Passed’ in the terminal as shown below:-

This is how we can take the help of isExisting() command of WebDriverIO to check the desired element is present in DOM or not. I will explain other commands to perform different operations on WebPages using WebDriverIO in the upcoming Articles.
Next Steps:
> To learn more about WebDriverIO, continue to the next post (Click on Next Post link below)
> Check complete WebDriverIO Tutorial Contents here (Click here)
Please leave your questions/comments/feedback below.
Happy Learning ?
Connect to me on LinkedIn (Click here)
On a mission to contribute to the Software Testing Community in all possible ways.
<<Previous Post << Complete Tutorial>> Next Post>>