Question

0

240

Views

Using JavaScript, how do I get this code to autofill Username & click button, delay, or wait, then autofill Password & click log in?

document.getElementsByName("Username")[0].value = 'FamilyGuy'

function myFunction(){
    //pag 1, delay a second. Giving user name time to fill
    document.getElementById("NextButton").click();
}
//delay
setTimeout(myFunction, 1000);

function myFunction(){
    //page 2, delay a second. Giving passwrd time to fill befor logging in
    document.getElementsByName("Password")[0].value = 'this1sth3p4ssw0rd!'
}
//delay
setTimeout(myFunction, 1000);

document.getElementById("LoginButton").click();

//I am using this extension using this extension
[1]: https://i.stack.imgur.com/LNMiJ.png

about 4 years ago · Juan Pablo Isaza

2 answers

Answer question

0

This may be one possible implementation to achieve the below-described (what is assumed to be the desired) objective:

A screen with input-boxes username, password and buttons 'Next', 'Login' is rendered
After waiting for some time (say 1.5 seconds), username is auto-populated
Another delay of 2 seconds and 'Next' button click is programatically triggered
After delay of 2 seconds, password is auto-populated
Finally, another delay of 1 second and 'Login' button is programatically triggered.

The time-delays are just randomly assigned in the snippet and may be altered as required.

It would definitely helpful to understand the context within which this is being used - to cater a more suitable answer.

const btnClicked = name => console.log(`${name} button clicked `);
setTimeout(
 () => {
  document.getElementById("Username").value = 'FamilyGuy';
  setTimeout(
    () => {
      document.getElementById("NextButton").click();
      setTimeout(
        () => {
          document.getElementById("Password").value = 'this1sth3p4ssw0rd!';
          setTimeout(
            () => {
              document.getElementById("LoginButton").click();
            },
            1000
          )
        },
        2000
      )
    },
    2000
  )
 },
 1500
);

<html>
<body>
<input id='Username' />
<button id='NextButton' onclick='btnClicked("Next")'>Next</button>
<input id='Password' />
<button id='LoginButton' onclick='btnClicked("Login")'>Login</button>
<script src='script.js'></script>
</body>
</html>

about 4 years ago · Juan Pablo Isaza Report

Answer question

Find remote jobs

Accepted Answer · 2022-07-03T15:08:12.795Z

setTimeout is an asynchronous function. It doesn't pause the execution of code that follows it.

This means that, in your example code, the two timeouts will run simultaneously, and your login button will be pressed immediately. To fix this, put the second timeout at the end of your first function, rather than in the main body of code. Also put the pressing of the login button inside the second function.

document.getElementsByName("Username")[0].value = 'FamilyGuy'


function myFunctionB(){
    //page 2, delay a second. Giving passwrd time to fill befor logging in
    document.getElementsByName("Password")[0].value = 'this1sth3p4ssw0rd!'
    document.getElementById("LoginButton").click();
}

function myFunctionA(){
    //pag 1, delay a second. Giving user name time to fill
    document.getElementById("NextButton").click();
    
    //delay
    setTimeout(myFunctionB, 1000);
}

//delay
setTimeout(myFunctionA, 1000);

I don't know the way the NextButton operates, but the use of a delay to wait until the Username value changes is probably unnecessary. Consider using the following code:

function myFunction(){
    document.getElementsByName("Password")[0].value = 'this1sth3p4ssw0rd!'
    document.getElementById("LoginButton").click();
}

document.getElementsByName("Username")[0].value = 'FamilyGuy'
document.getElementById("NextButton").click();
    
//delay
setTimeout(myFunction, 1000);

0

240

Using JavaScript, how do I get this code to autofill Username & click button, delay, or wait, then autofill Password & click log in?

2 answers

0

0

Find remote jobs

Andres GPT