1 text field of 4 errors with "not Interactable" has JavaScript Listener attached

Greetings,

I’m new to the Katalon Studio and have what I hope is a simple issue to overcome.

I’ve looked in the docs, checked the forum for similar post, read the ones I can find, but haven’t been able to overcome this issue.

The issue is, I have 4 text fields on a simple screen, 3 of them work perfectly in setting input to them. The 4 errors out as element not interactable, and the only difference in the 4th field from the other 3 is the 4th field has a JavaScript Event Listener attached to it for focusin.

I attempted to place a WebUI.focus event directly before the WebUI.setText event, but the focus event gives the same error as the setText, so obviously, I’m missing something.

Any direction would be appreciated.

In essence, the field is “not ready”. Did you try the waiting APIs? Basically, waiting for things to be present/visible and ready is something you need to do frequently – hell, always is safer.

Start here, and check item 3…

https://docs.katalon.com/katalon-studio/docs/troubleshooting-common-issues-related-to-interacting-with-an-element.html

Hey Russ,

Thanks for the reply.

Yes I did try placing a waitForElementVisible in front of the focus just for kicks, but that command times out after the 20 second interval I specify saying the element isn’t visible.

It’s strange, as this is the 6th or 7th field that is to populate on the screen, all others work perfectly.

Let’s not worry about those kind of things, this is a general problem, rarely a specific/special one.

What happens if you try to wait for its presence? Does that time out?

  1. Present: element is present in the DOM.
  2. Visible: element is present AND visible.

Ah, that is something I had NOT tried.

  1. Present passes
  2. Visibile fails

2019-06-07 16:20:49.163 DEBUG testcase.Login - 27: waitForElementPresent(findTestObject(“Page_Dashboard - User Dashboard/input__cellphone”), 10)
2019-06-07 16:20:49.188 DEBUG testcase.Login - 28: waitForElementVisible(findTestObject(“Page_Dashboard - User Dashboard/input__cellphone”), 10)
2019-06-07 16:20:59.464 WARN k.k.c.w.k.b.WaitForElementVisibleKeyword - Object ‘Object Repository/Page_Dashboard - User Dashboard/input__cellphone’ is not visible after 10 second(s)

So we know input__cellphone is present.

Question: are you 100% certain input__cellphone is the element you are meant to be addressing with setText? IOW, have you stored the wrong TestObject?

Good question.

I recreated the project from scratch to see if I possibly did something wrong in the initial setup. I added the commands in and got the same result, so at least I’m consistent (consistently wrong in this case).

In the attached screenshots I show the element via WebSpy, and it highlights the correct element, and seems to be happy.

I also show the html and the script where it stops populating right after the zip code.

Again, appreciate the input, I know it has to be “pilot error”, just can’t pinpoint the issue…

Screen%20Shot%202019-06-07-3

Crazy idea… What does this show:

Devtools/console, type document.querySelectorAll("#cellphone").length

We want 1. Not 0 and certainly not anything greater than 1.

If you get 1, I’m stumped. But I will say this, if you set the value via JavaScript, it will work.

Scott, this assumes you got a 1 above. What does this do?

def cp = findTestObject('cellphone')
WebUI.waitForElementPresent(cp, 20)
WebUI.delay(20)
WebUI.setText(cp, '555-123-4567')

Drop that in the relevant spot and give it a go…

Russ,

You were correct, at the point the script stops the length is 1.

When I put the above commands in I get a ubiquitous “Unable to save part” error

Screen%20Shot%202019-06-07-5 Screen%20Shot%202019-06-07-6

My fault:

def cp = findTestObject('Page_Dashboard - User Dashboard/input__cellphone')
WebUI.waitForElementPresent(cp, 20)
WebUI.delay(20)
WebUI.setText(cp, '555-123-4567')

you need your full path to cellphone (I’m lazy) :stuck_out_tongue:

I’m assuming the element can be set by hand, correct? And if so, what happens when you type into it? Do you happen to know what the focus handler is doing (and can you share that code)?

You are correct, it sets by hand just fine. The eventHandler applies a mask. I put in a screenshot of the code. Also I removed the eventHandler and tried it again, and it did the same thing…

I’m striking out with copy and pasting code as well :frowning:

32%20PM

Oops file upload snafu…

I must have done something else to the script, I took out the 4 lines and got the same error on execution…checking for stray keystrokes

Ok, it seems to be telling me the object is Present, but then doesn’t exist…or I’m misreading.

Okay…

  1. The element is present
  2. There is only one element with that ID.
  3. You’re hitting the “Unable to save part” bug for no apparent reason.
  4. You’re using jQuery (that’s good news, because) …

It’ll make your life easier when you come to use JavaScript to target that control.

Oh, and 5, I can’t type for shit after hours :wink:

Go read section 3 of that link I sent above. If you code up the JS, it’ll work fine. Something like this:

// check for presence, perhaps a delay too, then...
WebUI.executeJavaScript('$("#cellphone").val("555...");', Arrays.asList(null))

Later you can get fancy and pass your value to a method in a class of helpers you can keep around for future use. But for now, we just want to kick this oddball over the line.

Much appreciated Man. I closed the studio and reopened and the weird error went away.

Go enjoy whatever’s left of the evening in your timezone.

I’ll work on it tomorrow and post any progress I make!

Cheers…

Russ,

Wanted to close the loop on this.

I took the javascript suggestion and it didn’t fail, but nothing showed on the screen! Seems earlier in the script a radio button selection changed the fields that displayed (a cellphone field but for another entity). Once the correct “cellphone” field was identified, viola, works like a charm.

Thanks for taking time to walk me through this, I learned from it!

Scott

1 Like