Hi,
I’m facing a problem using Katalon Recorder.
When I recorde my page, I have this script
click | id=datetime-input |
type | id=datetime-input | 2023-02-14T17:20:00
But I run the same script, nothing happens and I’m confused.
If you could please direct me
Thanks
Is the field a text input field? Seems like the syntax for a pop-up calendar.
Yes I can either type the date and time or choose from the calendar
When I inspect the page I have this :
<input id=“datetime-input” type=“datetime-local” name=“datetime-input” class=“input” step=“1” required=“” aria-describedby="datetime-error>
It’s been quite a while since i’ve worked with a pop-up calendar, but pretty sure that value you were trying is the value generated by the pop-up calendar, via JavaScript (typically). So, it appears as a single ‘word’ (e.g. no spaces present), as that’s what the backend likely is expecting (and may be doing a date transformation with).
In the past, I seem to recall that I found the XPath / DOM selectors for the items within the pop-up calendar and ‘clicked’ on these, e.g. click Month, click Day, click Hour, click Minute.
I get that’s a lot more steps than just a single entry into a text input field, but I don’t believe in this case you’ll successfully be able to just pass a value to this field either, as it relies on JavaScript events to do its own ‘processing’ of this data.
There may be better ways to do this than that, but pretty sure it’s what I did in the past anyhow.
Thank you very much for your response.
Do you still have the script for these selectors so I can get an idea please?
In the past, I seem to remember finding the XPath / DOM selectors for the contextual calendar items and “clicking” on them, e.g., clicking on the month, day, hour and minute.
Not claiming that the following code will actually work, but created a script that would more or less model the way i’d likely approach doing this… (in this case, the pop-up calendar has just day, months, year, but not time), so it should still give you a good idea of how I might tackle this.
Note: What’s not below is a step to click to display the pop-up calendar, before then carrying out all the following steps.
Modelled it from the calendar here: Datepicker | jQuery UI
Thank you @guy.mason, for your reply.
I do not succed to adapt your script to my specific case.
However, I managed to get 50% with this script found here and there:
Only 50%, because I can write the date in the right space but the form doesn’t take it into account and I have to manually increment/decrement the date before I can submit it.
Is it because required aria-describedby = “datetime-error” ?
Generating the time date values via JavaScript is as it sounds like generating the string in the correct format / syntax, but as the text input field is relying on JavaScript events, this is why even when you use runScript to inject the fully formed string, the UI is still waiting on that JS event to occur. Which is why you then manually selecting something via the UI is triggering the event it’s waiting on.
If you could even automate just the date increment/decrement after injecting it, you could then automate the lot, but that depends on if you find the right DOM selector / XPath or not (and whether or not the UI element is being rendered via a Shadow DOM too).
I still can’t find the right DOM Selecter or Xpath to override this.
Thank you @guy.mason for your response and for your time.
