How can I handle date pickers using Katalon? Here’s my scenario
I am supposed to select 22-12-1991 in date picker,
Url of datepicker Demo of core features in jQuery DateTimePicker widget | Kendo UI for jQuery
I wanted it to handle dynamically, so that I can pass value ‘22-12-1991’ from Testcase only
In selenium I used to handle with List & Hashmap but too much of code. Is there any optimized way to handle this in Katalon?
Please take a look at the url of date picker
Hi Vinh,
I am having the same challenges on Datepicker as per this thread. Could i ask
whether you can provide me the custom keyword as mentioned previously"I can try to create a custom keyword to select a date based from your example send a reply to you soon, but I it will not always work for other date pickers due to different implementations"
further i was experimenting with your recommendation but not getting the date injected. could you explain the argument textbox please def driver = DriverFactory.getWebDriver()
((JavascriptExecutor)driver).executeScript("arguments[0].value=arguments[1]", textbox, '22-12-1991')thanks
Agreed, but using Javascript method we cannot confirm that datepicker is really functional as expected. We may set value like document.getElementById(‘DOB’).value=“2222-12ss-1991” but from web interface it’s not possible to set that value.
That’s the reason I would suggest one to handle Datepickers with custom coding rather than using Javascript
Hi there,
I think javascript is widely used in most of the current web applications. The point is date picker object can be very different between web applications, even between pages within the sane application.
I can try to create a custom keyword to select a date based from your example send a reply to you soon, but I it will not always work for other date pickers due to different implementations.
Thanks
Can’t we try other way? For few date pickers we can’t pass value using javascript executor as well. I was expecting a solution with List collection & itetrations
Oh that’s quite another simple case, just inject and execute javascript code to pass in value in this case. The below code will resolve non-readonly and readonly field.
def driver = DriverFactory.getWebDriver()
((JavascriptExecutor)driver).executeScript("arguments[0].value=arguments[1]", textbox, '22-12-1991')
Thanks
What if the field is readonly, then setText wont work. How can we handle this with custom coding?
Hi there,
The simplest way to handle date picker from my point of view is just… type the date into textbox, that will simplify a lot of choosing dates step, e.g
WebUI.setText(findTestObject('Page_Kendo\txt_DateField'), '22-12-1991' )
Hi,
Any luck with the selection of date picker. Please let me know if there is any update.
Thanks in Advance.
Well handling date picker is super complicated if you want to do it using custom keyword. Luckily I’ve found a custom keyword from the original author of this topic (Hari) which will greatly help you guys:
@Keyword
public static void handleDatepicker(TestObject calender, String exp_Date, String exp_Month,
String exp_Year)throws Exception{
String expDate = null, calYear = null,datepickerText=null,minYear=null,maxYear=null;
int expMonth = 0, expYear = 0;
WebElement datePicker;
List<WebElement> noOfDays=null,noOfMonths=null,noOfYears=null;
boolean dateNotFound = true;
List<String> monthList = Arrays.asList("None","Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul",
"Aug", "Sep", "Oct", "Nov", "Dec");
def driver = DriverFactory.getWebDriver()
WebElement SelectCalender = WebUiCommonHelper.findWebElement(calender, 20);
// JavascriptExecutor executor = ((JavascriptExecutor)driver);
// executor.executeScript("arguments[0].click();", SelectCalender);
SelectCalender.click()
// Set your expected date, month and year.
expDate = (exp_Date);
expMonth = Integer.parseInt(exp_Month);
expYear = Integer.parseInt(exp_Year);
WebElement datePicker_Heading1 =(driver).findElement(By.xpath("//div[@class='datepicker-days']/table/thead/tr[1]/th[2]"));
WebDriverWait wait = new WebDriverWait(driver,10);
wait.until(ExpectedConditions.elementToBeClickable(datePicker_Heading1));
datePicker_Heading1.click();
//executor.executeScript("arguments[0].click();", datePicker_Heading1);
WebElement datePicker_Heading2 =(driver).findElement(By.xpath("//div[@class='datepicker-months']/table/thead/tr[1]/th[2]"));
wait.until(ExpectedConditions.elementToBeClickable(datePicker_Heading2));
datePicker_Heading2.click();
while (dateNotFound) {
WebElement datePicker_Heading3 =(driver).findElement(By.xpath("//div[@class='datepicker-years']/table/thead/tr[1]/th[2]"));
wait.until(ExpectedConditions.visibilityOf(datePicker_Heading3));
datepickerText =datePicker_Heading3.getText();
String[] datepickerYear = datepickerText.split("-");
minYear =datepickerYear[0];
maxYear = datepickerYear[1];
// If current selected month and year are same as expected month
// and year then go Inside this condition.
if((expYear >= Integer.parseInt(minYear)) && (expYear<=Integer.parseInt(maxYear)))
{
datePicker = (driver).findElement(By.xpath("//div[@class='datepicker-years']/table"));
noOfYears = datePicker.findElements(By.xpath("//span[contains(@class,'year')]"));
firstloop:
for (WebElement year : noOfYears) {
// Select the date from date picker when condition
// match.
if (year.getText().equalsIgnoreCase((String)exp_Year)) {
year.click();
Thread.sleep(1500);
datePicker = (driver).findElement(By.xpath("//div[@class='datepicker-months']/table"));
noOfMonths = datePicker.findElements(By.xpath("//span[@class='month']"));
Thread.sleep(1000);
for (WebElement month : noOfMonths) {
System.out.println(" the expected month in int is : "+expMonth);
System.out.println(" the expected month is : "+monthList.get(expMonth));
System.out.println(" the Actual month is : "+month.getText());
if ((monthList.get(expMonth)).equalsIgnoreCase(month.getText())) {
month.click();
datePicker = (driver).findElement(By.xpath("//div[@class='datepicker-days']/table"));
noOfDays = datePicker.findElements(By.xpath("//td[@class='day']"));
Thread.sleep(1500);
for (WebElement cell : noOfDays) {
if (cell.getText().equalsIgnoreCase(expDate)) {
cell.click();
break firstloop;
}
}
}
}
}
// else{
//
// throw new Exception()
// }
}
dateNotFound = false;
}else if (expYear > Integer.parseInt(maxYear)) {
WebElement Next =(driver).findElement(By.xpath("//div[@class='datepicker-years']/table/thead/tr[1]/th[@class='next']"));
if(Next.getAttribute("style").equalsIgnoreCase("visibility: visible;"))
{// Click on next button of date picker.
Next.click();
}else {
throw new Exception("This is exception")
}
}
// If current selected month and year are greater than expected
// month and year then go Inside this condition.
else if (expYear < Integer.parseInt(minYear)) {
WebElement Previous =(driver).findElement(By.xpath("//div[@class='datepicker-years']/table/thead/tr[1]/th[@class='prev']"));
if(Previous.getAttribute("style").equalsIgnoreCase("visibility: visible;"))
{
// Click on previous button of date picker.
Previous.click();
}else{
throw new Exception("This is exception")
}
}
}
}
Hi,I have other kind of datepicker , ui-datepicker.
The field 205 is read only:
the xpath for the calendar i attach in this message. I would like to know how I should handle this component class?
Hi Hari / Alex,
How do I integrate the custom keyword DatepickerHandler.groovy into my Katalon test project? Can I get step by step instructions to do that?
Fernanda Lopez said:
Hi,I have other kind of datepicker , ui-datepicker.
The field 205 is read only:
the xpath for the calendar i attach in this message. I would like to know how I should handle this component class?
Please use below code…
def intyear = findTestData(‘Give your Data File Path’).getValue(‘Year’, 1)
def intmonth = findTestData(‘Give your Data File Path’).getValue(‘Month’, 1)
def intdate = findTestData(‘Give your Data File Path’).getValue(‘Day’, 1)
WebUI.selectOptionByLabel(findTestObject(‘Give your Data File Path’), intmonth, false)
WebUI.selectOptionByValue(findTestObject(‘Give your Data File Path’), intyear, false)
WebDriver driver2 = DriverFactory.getWebDriver()
WebElement tb =driver2.findElement(By.xpath(“.//*[@id=‘ui-datepicker-div’]/table/tbody”))
List hr = tb.findElements(By.tagName(“tr”))
List tcells
for(int i=0;i<hr.size();i++)
{
tcells= hr.get(i).findElements(By.tagName("td"))
for(int j=0;j<tcells.size();j++)
{
//System.out.println(tcells.get(j).getText());
if(tcells.get(j).getText().toString().equals(intdate))
{
tcells.get(j).click()
}
}
}
Sukanya Kulkarni said:
Hi Hari / Alex,
How do I integrate the custom keyword DatepickerHandler.groovy into my Katalon test project? Can I get step by step instructions to do that?
Once you created your Custom Keyword then follow below step to use created custom keyword in your script
For Example: CustomKeyword.DatepickerHandler.handleDatepicker(TestObject calender, String exp_Date, String exp_Month,String exp_Year)
I would like to know, how should I handle this Date picker.
Hari Charan said:
Agreed, but using Javascript method we cannot confirm that datepicker is really functional as expected.
I think what you say only makes sense if you’re testing the datepicket component itself. If it’s just part of the workflow, it should be ok to directly manipulate the textfield.
Hi Team,
Could you please help me to handle the below Date & Time:
I am unable to execute my script using xpath
Hi guys,
Is there any solution for Android’s default date picker…???
please help…
Thanks in advance…
Hello Hari, Vinh,
Thanks for this post and help.
I am trying to use this custom date picker to select a date but running into the below issue:
org.codehaus.groovy.runtime.InvokerInvocationException: groovy.lang.MissingMethodException: No signature of method: static org.openqa.selenium.remote.server.DriverFactory.getWebDriver() is applicable for argument types: () values: []
at myKeywordPackage.datePicker.invokeMethod(datePicker.groovy)
at com.kms.katalon.core.main.CustomKeywordDelegatingMetaClass.invokeStaticMethod(CustomKeywordDelegatingMetaClass.java:49)
at TC004_FillCommonDetails.run(TC004_FillCommonDetails:18)
at com.kms.katalon.core.main.ScriptEngine.run(ScriptEngine.java:194)
at com.kms.katalon.core.main.ScriptEngine.runScriptAsRawText(ScriptEngine.java:119)
at com.kms.katalon.core.main.TestCaseExecutor.runScript(TestCaseExecutor.java:321)
at com.kms.katalon.core.main.TestCaseExecutor.doExecute(TestCaseExecutor.java:312)
at com.kms.katalon.core.main.TestCaseExecutor.processExecutionPhase(TestCaseExecutor.java:291)
at com.kms.katalon.core.main.TestCaseExecutor.accessMainPhase(TestCaseExecutor.java:283)
at com.kms.katalon.core.main.TestCaseExecutor.execute(TestCaseExecutor.java:222)
at com.kms.katalon.core.main.TestSuiteExecutor.accessTestCaseMainPhase(TestSuiteExecutor.java:129)
at com.kms.katalon.core.main.TestSuiteExecutor.accessTestSuiteMainPhase(TestSuiteExecutor.java:112)
at com.kms.katalon.core.main.TestSuiteExecutor.execute(TestSuiteExecutor.java:81)
at com.kms.katalon.core.main.TestCaseMain.startTestSuite(TestCaseMain.java:149)
at com.kms.katalon.core.main.TestCaseMain$startTestSuite$0.call(Unknown Source)
at TempTestSuite1543973108313.run(TempTestSuite1543973108313.groovy:36)
Caused by: groovy.lang.MissingMethodException: No signature of method: static org.openqa.selenium.remote.server.DriverFactory.getWebDriver() is applicable for argument types: () values: []
at myKeywordPackage.datePicker.handleDatepicker(datePicker.groovy:24)
at myKeywordPackage.datePicker.invokeMethod(datePicker.groovy)
at com.kms.katalon.core.main.CustomKeywordDelegatingMetaClass.invokeStaticMethod(CustomKeywordDelegatingMetaClass.java:49)
at Script1543856760287.run(Script1543856760287.groovy:18)
… 13 more
I am new to Katalon and programming. Could you please help me here…
