AWS Cognito Log in Client

hola, estoy intentando realizar los test unitarios de mi aplicacion pero no puedo iniciar sesion en el formulario de aws cognito.

mi robot:
*** Settings ***

library Selenium2Library

*** Test Cases ***

Abrir navegador

open browser        https://url

Log in

Wait Until Page Contains Element    id:signInFormUsername        

Wait Until Element Is Enabled    xpath://*[@id="signInFormUsername"]    10

input text      //*[@id="signInFormUsername"]    user

input text      Id:signInFormPassword    pass

click button    name:signInSubmitButton

error:
en input text //*[@id=“signInFormUsername”] user
ElementNotInteractableException: Message: element not interactable
(Session info: chrome=79.0.3945.130)

intente con el id o con xpath, relentizando el robot, wait pero nada funciona.

Hola Miguel,

Bienvenido! No deberias de usar esa library, Selenium2Library. Abandonala y mejor usa SeleniumLibrary que es la mas actual y reciente. Aunque eso no tiene nada que ver con el problema que tienes de ElementnotInteractable. Ese es otro tema.

Existe algun otro control o algo tapando o bloqueando el elemento input al tratar de llenar tu nombre de usuario?

Hi Miguel,

Sorry I don’t speak Spanish, I read your question with Google Translate, Hopefully you can read my answer the same way.

I have seen a few web frameworks that have a pattern where the form elements are “hidden” behind a stylised div something like this:

<div  id="nnn_signInFormUsername" >
    <div class="some css makes this appear as a form input"  id="signInFormUsername_input" ></div>
    <input class="some css that hides this element" id="signInFormUsername" ></input>
</div>

Sometimes the input is hidden, sometimes it is simply layered behind the div, either way when the user interacts with the page, they are not entering text into the form element but the div element and some javascript is updating the form element.

You didn’t provide what https://url is so I can’t check for you, If your site is using something like this you may need to change your script to input text to the inner div rather than the form input.

Hope this helps,

Dave.

Hi Miguel,

Well this is where dev tools in your browser of choice can become your best friend.

A quick tip; in dev tools you can test any xpath you want and can experiment with different xpaths to get the one you want, just use the $x('<put your xpath here>') syntax in the console tab of dev tools.

when I did that with your xpath on that site, sure enough there are 2 matches:

so I had a bit of a look, there is actually 2 complete copies for the login form

one inside this div

<div class="modal-content background-customizable modal-content-mobile visible-xs visible-sm">

and one inside this div

<div class="modal-content background-customizable modal-content-mobile visible-md visible-lg">

the modal-content-mobile class was the clue here as to what is going on, switch the browser to mobile device mode the first form became active.

FYI This feature in chrome based browsers gives you the ability to view a site as though you were using a mobile device:
Screen Shot 2021-04-01 at 6.50.53 pm

So I guess you are testing with a desktop browser and as selenium’s default behaviour is to take the first match when multiple matches are found, you are hitting the first form which is hidden, and that explains your error and why the previous step passed.

Probably the easiest way to deal with it is:

Wait Until Element Is Visible    xpath://div[contains(@class, "visible-lg")]//*[@id="signInFormUsername"]    10
input text      //div[contains(@class, "visible-lg")]//*[@id="signInFormUsername"]    user

Note the change from “Wait Until Element Is Enabled” to “Wait Until Element Is Visible”.

You’ll probably need to do the same for password and sign in button.

Hope that helps,

Dave.

This still does not work. Do you have any other suggestions that can be used. I am starting to guess the page is protected by some mechanism

Hi Kelvin,

There is a trick that sometimes helps, you can wait till the page finishes loading and running the on load javascript, before trying to interact with elements. so before any Wait Until Element Is Enabled, Wait Until Element Is Visible, etc insert this:

Wait For Condition	return document.readyState == "complete"

I suggested it for someone else and it solved their issue, and it helped me on one site too.

Basically it’s waiting for the browser to report that it’s finished running all the java script, you do this because some sites the java script creates the web elements or modifies them as part of the page load, so you wantt to wait for all this type of behaviour to stop before trying to interact with the page elements.

Dave.