How to select date from date picker?

The field shows both the date and time, the X to clear the data.

Can you do an experiment with the setText() we have above but before using it, you clear any date in the field (if there is) with the X and see if that does anything? If you have to enter a time along with the date, then do that as well with the same setText(), like:'the X button'))
WebUI.setText(findTestObject('the date textbox'), "12/25/2022, 09:00")

I don’t know why when this button step fails. I have taken the source code to include in the selected locator but it also failed.

Can you right click on the “Start date” textbox and select “Inspect” (do this twice)? The HTML code for the “Start date” should display. Can you display the HTML for the “Start date”? From the HTML, we can formulate a pathway for the element.

Also, note that you have SVG in your xpath, so the below may be of interest.


Is the URL of your target web page public? Is is possible for us to open the URL in the browser of on our side? If so please share the URL.


Your question is dependent on the structure of the HTML source. Therefore we need to be able to open it in browser in hand to see the HTML source code and study in detail.

HTML source code matters! Please understand this.

If you can not share the live URL and username/password for security reason, please save the target page (after login) into a MIME HTML file, and share the file here. The following post tells you how to save a web page into a MIME HTML file.

The credentials (username/password) will not be included in the MHT file. So you need not be worrried about the security.

Provided with the saved HTML shared, others will be able to open the HTML in their own browser and look at the HTML structure precisely. Then somebody would be able to give you some productive advices.

Please show how your “Object Repository/Page_feedbackonline - Task System/path start date” is defined. Please take the screenshot of the definition and show it here.

Sorry, it’s the company’s own website, I can’t make it public

Feedbackonline.mht (49.2 KB)

here you are

Is it this?

this looks like a reactjs. you can build a utility like this below.

public static void setDateUsingFlatPicker(String Locator,String NewDate) {

	String ExtractLocatorXpath = ('document.evaluate(' + Locator) + ', document , null ,XPathResult.FIRST_ORDERED_NODE_TYPE,null,).singleNodeValue'

	String DateManipulation = '"' + NewDate + '"'

	String SetDate = ExtractLocatorXpath + '._flatpickr.setDate('+ DateManipulation +',true);'

	System.out.println('New SetdataJs : ' + SetDate)

	WebUI.executeJavaScript(SetDate, null)


	String TriggerRuleAction = ('jQuery(' + ExtractLocatorXpath) + ').trigger({ type: \'datetimechange\', isManualTrigger: true });'

	WebUI.executeJavaScript(TriggerRuleAction, null)


String Locator = ‘xpathofwebelement’

Utility.setDateUsingFlatPicker(Locator, ‘2022-04-25 12:30:00’)

How do I use them? I’m new so I don’t know how to use it

Create a Custom Keyword inside Keywords section and then use the above method implemented method into your testcases in script window and pass the date value as arguments.

Please refer this below.

Introduction to Custom Keywords | Katalon Docs

I tried to open the mht file you provided. But I saw just a blank window. My Chrome browser could not render the mht file at all. I do not know why.

I could not see the page on my PC, so that I have no idea about your issue. I will quit, sorry.

The only thing I could found was that your target web page is a javascript driven Single Page Application.

@phanuyend Check the <iframe>-s, because it might ruin all your other approaches toward the datepicker.

Thanks for helping me!

How to check it?

Check to see if your datepicker widget lives within an <iframe>.