0
votes

Using Robot Framework (with Selenium) to automatically fill a form - it's a checkout page on a ecommerce website, It bugs at the very last step, when trying to enter the CVC code of a test credit card, Robot throws a "InvalidElementStateException: Message: invalid element state: Element is not currently interactable and may not be manipulated" when the field is clearly visible and actionable.

Using Chrome, not Firefox (can't get it to work at all with FF)

I made sure the test scrolls the page down to see the field, but it still considers that field to be hidden or not actionable.

Has anyone run into the same issue here?

Section of the code that fails is here:


Card Payment is Visible
    Execute JavaScript    window.scrollTo(0,700)
    Wait Until Page Contains    Expires
    Focus   xpath=//*[@id="securityNumber"]

I Enter the CC Security Code Input Text securityNumber ${CHECKOUT_CARD_CODE}

I Click Submit Order Submit Form forms.payByCardForm

(the bits about "Focus" and "Input Text" are the ones that fail. I validate the text "Expires" is visible, it's right above the CVC field...)

I also tried: Wait Until Element is Visible id=securityNumber

But it still fails. It takes a screenshot and it's clearly there...

2
Can you show us your Robot code so we can help debug it for you?Goralight
You have to define locator for Input Text the same way as you did for Focus. securityNumber isn't valid locator.Jan Kovařík
securityNumber is also the "name" of the field (not just the "id"), and it works for every other field. Focus actually fails, But i'll give your advice a try right awayJonathan L
...still fails. I am also looking at the computer css styles, but there's nothing there that prevents the field from being visible.Jonathan L
Just throwing out what my methods are when I get an error - try a sleep | 3s just before the Input Text and the Focus. It may be down to timing or chrome being too quick or something. Again, may not work but it's what I tend to do to help debug!Goralight

2 Answers

2
votes

Oh well...payment forms you don't build yourself will always be trouble. This one is built using AngularJS so it's even more trouble.

I found how to locate the proper field by using a css property, since there is a hidden form that contains the same field with the same ID and Name.

I did have to use "Sleep" for it to work as well (thx Goralight).

And thanks to everyone else.

0
votes

Use unique identifiers. Had same issue with the "description" field. Upon using View Source [Code] I see "description" in my HEAD META tag. Changed id fields to use "product_description" - error is gone. Code works.