Cypress.io make async request in custom login command

Question

I want to configure a custom login command in which I have to make a signIn call which returns a promise.

commands.js:

Cypress.Commands.add("login", () => {
  AuthLib.signIn(username, password).then((data) => {
    cy.setLocalStorage("accessToken", data.accessToken);
  });

AuthLib.signIn() returns a promise.

Then I want to use this command in an before block:

  before(() => {
    cy.login();
    cy.saveLocalStorage();
  });

I notice that the promise is not resolved. A 'hacky' fix would be to add cy.wait(4000) between login() and saveLocalStorage(). But that makes my test depend on the loading time of the auth server

I found this 'related' issue: Cypress.io How to handle async code where https://www.npmjs.com/package/cypress-promise is referred. But this library cannot be used in before or beforeEach

How can I await the promise returned from login() / make sure the promise from login() is resolved before doing cy.saveLocalStorage()?

Update

I added the examples of what works and does not work in : https://github.com/Nxtra/Cypress-Amplify-Auth-Example/blob/main/cypress/support/commands.js

A solution would be to start with cy.then():

Cypress.Commands.add("login", () => {
  cy.then(() => AuthLib.signIn(username, password)).then((data) => {
    cy.setLocalStorage("accessToken", data.accessToken);
  });

This is simply legendary. I struggle with it for hours and can verify that cy.then(...) approach is the ONLY one which works. — Timofey Pchelintsev
– Timofey Pchelintsev, Commented Apr 1, 2022 at 16:06

oKonyk · Accepted Answer · 2020-10-17 14:58:58Z

1

Make sure that you return that promise inside Cypress.Commands.add callback. It's a bit confusing to deal with promises in Cypress context, since a lot of async behavior is magically handled within cy. commands.

Cypress.Commands.add("login", () => {
  return AuthLib.signIn(username, password).then((data) => {
    cy.setLocalStorage("accessToken", data.accessToken);
  });
});

4 Comments

xtra Over a year ago

In the before block, should I then await the login: await login()?

xtra Over a year ago

Either calling making before async and calling await cy.login() or just calling cy.login() makes that the test keeps hanging in the before function.

oKonyk Over a year ago

Hmmmm, interesting cy.login() should work. Adding other solution to original answer.

xtra Over a year ago

I have the feeling one cannot return a Promise from a Cypress command. Unless it is wrapped in cy.then(). That's the only way I got it working (see update in question). I have tried your suggestions but then Cypress keeps on hanging on the promise.

Collectives™ on Stack Overflow

Cypress.io make async request in custom login command

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related