Why are promise function in executing in wrong order?

const getUsername = new Promise((resolve, reject) => {
  console.log("Getting username...")
  setTimeout(() => {
    //getting from db
    let username = "srishti"
    console.log(`Username = ${username}`)
    resolve(username)
  }, 3000);
})

const validateUsername = (username) => {
  return new Promise((resolve, reject) => {
    console.log("Validating username...")
    if (username !== undefined && username !== null && username !== "") {
      console.log("Valid Username!");

    } else {
      console.log("Invalid Username! Please try again!");
    }
    resolve(username)

  })
}

const getPassword = new Promise((resolve, reject) => {
  console.log("Getting password...")
  setTimeout(() => {
    let password = "upgrad"
    console.log(`Password = ${password}`)
    resolve(password)
  }, 3000);
})

const validatePassword = (password) => {
  return new Promise((resolve, reject) => {
    console.log("Validating password...")
    if (password !== undefined || password !== null || password !== "") {
      console.log("Valid Password!");

    } else {
      console.log("Invalid Password! Please try again!");
    }
    resolve(password)
  })
}



const done = () => {
  console.log("BOTH VALID!")
}


const login = () => {
  getUsername.then(username => {
    return validateUsername(username)
  }, err => {
    console.log(new error(err))
  }).then(password => {
    return getPassword(password), err => {
      console.log(err)
    }
  }).then(password => {
    return validatePassword(password)
  }, err => {
    console.log(err)
  })
  done()
}

login()

When I am executing separately that program gives the right solution but when I run all four it got messup.

Expected Output:

Getting username…
Username = srishti
Validating username…
Valid Username!
Getting password…
Password = upgrad
Validating password…
Valid Password!
BOTH VALID****

When I pass the first two functions as a callback function, it will then print the result as expected but when I pass all four functions as callback functions it prints not in sequence and prints double.

Answer

You have a combination of setting variables to a Promise instance (which will start it executing immediately) and fefining functions which return a Promise instance (which will start executing when the function is called).

Everything here should be doing the latter. You should also make sure done is called as part of your promise chain. You also had another error when you were handling the err => ... part of one of your promises.

Working code below.

const getUsername = () => new Promise((resolve, reject) => {
  console.log("Getting username...")
  setTimeout(() => {
    //getting from db
    let username = "srishti"
    console.log(`Username = ${username}`)
    resolve(username)
  }, 3000);
})

const validateUsername = (username) => {
  return new Promise((resolve, reject) => {
    console.log("Validating username...")
    if (username !== undefined && username !== null && username !== "") {
      console.log("Valid Username!");

    } else {
      console.log("Invalid Username! Please try again!");
    }
    resolve(username)

  })
}

const getPassword = () => new Promise((resolve, reject) => {
  console.log("Getting password...")
  setTimeout(() => {
    let password = "upgrad"
    console.log(`Password = ${password}`)
    resolve(password)
  }, 3000);
})


const validatePassword = (password) => {
  return new Promise((resolve, reject) => {
    console.log("Validating password...")
    if (password !== undefined || password !== null || password !== "") {
      console.log("Valid Password!");

    } else {
      console.log("Invalid Password! Please try again!");
    }
    resolve(password)
  })
}



const done = () => {
  console.log("BOTH VALID!")
}


const login = () => {
  getUsername().then(username => {
    return validateUsername(username)
  }, err => {
    console.log(new error(err))
  }).then(password => {
    return getPassword()
  }, err => {
      console.log(err)
  }).then(password => {
    return validatePassword(password)
  }, err => {
    console.log(err)
  })
  .then(done);
}

login()

You should also make sure your handling errors properly in your Promise code an call reject when necessary.