<<Previous Post << Complete Tutorial>> NextPost>>
WebDriverIO – waitUntil Command
waitUntil Command by its name only speaks about that it will wait Until it found something on DOM. waitUntil Command returns true based on the conditions applied as per its syntax under the provided time out.
Syntax:- $(selector).waitUntil(condition, { timeout, timeoutMsg, interval })
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 wait until Mr. Option checkbox gets enabled after a certain period of time on the omayo.blogspot.com web application.
Exercise:-
1) Navigate to http://omayo.blogspot.com/
2) Find the Xpath of the Button to be clicked which can lead to enablement of Mr Option checkbox after 10 seconds of time.
3) Find the Xpath of the Mr Option Checkbox so that after clicking on Check this button if it gets enabled after certain period of time then we can verify that.
4) Now Use waitUntil Command on the enabled checkbox and verify the results.
Practical Demonstration:
Following are the steps to Perform above exercise (i.e., to click on Check this button and waitUntil Mr Option checkbox gets enabled and verify it by using waitUntil Command)
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 ‘waitUntil_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 using waitUntil() Command of WebDriverIO on checkboxes present on the page on ‘omayo.blogspot.com’ web application.
You can understand this code, by reading the comments provided in the below code:
describe('This Example show usage of waitUntil command in webdriverio', () => {
it('should wait until Mr Option checkbox gets enabled after certain period of time ', ()=> {
browser.url('http://omayo.blogspot.com');
$("//input[@id='timerButton']").scrollIntoView();
browser.pause(3000);
$("//button[contains(text(),'Check this')]").click();
browser.waitUntil(function () {
let element = $('#dte');
let elementEnabled = element.isEnabled();
console.log("Mr Option Checkbox is Enabled? " + elementEnabled);// Returns True if element is enabled
return elementEnabled;
},
{ timeout: 20000, timeoutMsg: 'Mr Option checkbox is not enabled'});
});
});
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 ‘waitUntil_command_test.js’ will get executed successfully. The chrome Browser will launch, then it will look out the check This Button 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 waitUntil() command of WebDriverIO to wait for a particular element for a given period of time as provided by the user. 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>> NextPost>>
