Return value from cypress custom command and reuse in another function in test.cy.js file

Question

I have created a custom command cy.createUser("userCreate") in commands.js that creates a userID variable.

Cypress.Commands.add("createUser", (payload) => {
    cy.makeUserviaAPI(payload).then((userID) => {
    cy.openUserProfile(userID);
    })
});

I want to use this usedID in other methods also in my test.cy.js file. i.e. I want to pass userID as a variable in new method cy.updpateUser(userID)

beforeEach(() => {
    cy.createUser("userCreate")
    cy.updpateUser(userID)
});

I have tried following modifications:

Cypress.Commands.add("createUser", (payload) => {
    cy.makeUserviaAPI(payload)
    .then((userID) => {
    cy.openUserProfile(userID);
    })
    .then((userID) => {
            return userID;
    })
});

beforeEach(() => {

let uid = cy.createUser("userCreate")
    cy.updpateUser(uid)
});

But I am getting userID as null or with some windows object. Can someone please please guide me on how to pass return variable userID and use it in new function as updateUser(userID) in test.cy.js.

NOTE: I can't move updateUser() inside createUser() as they needs to be independent of each other.
Also there will be multiple functions in future that will be needing userID as primary parameter to operate.

Answer 1

Since you specify one spec file test.cy.js, it is possible to use an alias to wrap the value of userID.

Here I have simple versions of your commands to show the value abc is persisted in the right places:

Cypress.Commands.add('makeUserviaAPI', () => {
  const userID = 'abc'                           // simple assign and return result
  return userID
})

Cypress.Commands.add('openUserProfile', () => { 
})

Cypress.Commands.add("createUser", (payload) => {
  cy.makeUserviaAPI(payload).then((userID) => {
    cy.openUserProfile(userID)
    cy.wrap(userID).as('userID')                 // publish the userID 
  })
})

Cypress.Commands.add('updateUser', (userID) => {
  expect(userID).to.eq('abc')                     // checking - it passes
})

beforeEach(() => {
  cy.createUser("userCreate").then(userID => {
    cy.updateUser(userID)
  })
})

it('test1', () => {
  cy.get('@userID').should('eq', 'abc')                   // checking - it passes
  cy.get('@userID').then(userID => cy.updateUser(userID)) // passes call to update                  
})

it('test2', () => {
  cy.get('@userID').should('eq', 'abc')                   // checking - it passes
  cy.get('@userID').then(userID => cy.updateUser(userID)) // passes call to update    
})

Answer 2

You can achieve same by adding a .then block at end and wrapping the variable that you need as a parameter in test.cy.js function.

Cypress.Commands.add("createUser", (payload) => {
cy.makeUserviaAPI(payload)
.then((userID) => {
cy.openUserProfile(userID);
})
.then(() => {
    cy.log('userID=========>', userID) //Added log for verification
    cy.wrap(userID);
    return cy.wrap(userID);
});
})

});

test.cy.js

Cypress.Commands.add("createUser", (payload) => {
cy.makeUserviaAPI(payload).then((userID) => {
.then(userID=>{
        cy.log('userID=========>', userID) //Added log for verification
cy.openUserProfile(userID);
 })
})

});