1

hi folks i am new in ui/cypress automation i am trying to create a custom command which read a data from ui and return it to calling command where i can compare it with test data and validate the result e.g. enter image description here

for custom command in support\commands.js below is my code which take companyname as parameter and read the contact info from ui

Cypress.Commands.add('readContactInfo', (companyName) => {
cy.get('.simple-table__cell:nth-child(1)').contains(companyName).parent().within(function()
{
cy.get('div').eq(2).then(function(res)
{
cy.log(res.text())
})
})
})

and when i call the it from test.spec.js file like below

cy.readContactInfo('Magazzini Alimentari Riuniti')

the output is like

 log       Giovanni Rovelli

but i wanted that the readContactInfo will return the text value to the cypress command like what normal function do..

what i tried

Cypress.Commands.add('readContactInfo', (companyName) => {
    cy.get('.simple-table__cell:nth-child(1)').contains(companyName).parent().within(function()
    {
    cy.get('div').eq(2).then(function(res)
    {
    return cy.wrap(res.text())
    })
    })
    })

and when i call the it from test.spec.js file like below

 cy.readContactInfo('Magazzini Alimentari Riuniti').then(text)=>{
cy.log(text);
}

the ouput is like

8  get        .simple-table__cell:nth-child(1)
9  -contain   Magazzini Alimentari Riuniti
10 -parent
11 -within
12 get        div
13 -eq        2
14 wrap       Giovanni Rovelli
l5 log        <li.simple-table__row>
Fody
  • 23,754
  • 3
  • 20
  • 37
Anil Tiwari
  • 71
  • 8

2 Answers2

3

You are on the right track, but note you don't need to return anything, the cy.wrap() is enough (Cypress set's your res.text() as the current subject).

The problem is .within() always resets the subject, and since it wraps the subject you want it has the last word, so-to-speak.

Replace it with .find()

Cypress.Commands.add("readContactInfo", (companyName) => {
  cy.get(".simple-table__cell:nth-child(1)")
    .contains(companyName)
    .parent()
    .find("div")
    .eq(2)
    .then(function (res) {
      return cy.wrap(res.text());
    });
});

You can also shorten the res.text()

Cypress.Commands.add("readContactInfo", (companyName) => {
  cy.get(".simple-table__cell:nth-child(1)")
    .contains(companyName)
    .parent()
    .find("div")
    .eq(2)
    .invoke('text')
});

Ref .within()

Yields

.within() yields the same subject it was given from the previous command.

Fody
  • 23,754
  • 3
  • 20
  • 37
2

You'll have to return the entire chain command of the subject you want to return.

Cypress.Commands.add('readContactInfo', (companyName) => {
  return cy.get('.simple-table__cell:nth-child(1)')
    .contains(companyName)
    .parent()
    // find command limited to previous subject
    .find('div')
    .eq(2)
    // will invoke .text() and return it
    .invoke('text')
})

Now whenever you use the custom command, the text will be returned.

cy.readContactInfo('Magazzini Alimentari Riuniti')
  .should('eq', 'text you want to verify here')
jjhelguero
  • 2,281
  • 5
  • 13