node.js - Ako vrátiť zoznam objektov z vlastných príkazov Cypress v TypeScripte


Používam Cypress na moje end-to-end integračné testy. Mám prípad použitia, ktorý zahŕňa vrátenie zoznamu objektov z Cypress vlastných príkazov a mám s tým problém. Tu je môj ukazovateľ kódu:

index.ts

declare global {
    namespace Cypress {
        interface Chainable<Subject> {
            getTestDataFromElmoDynamoDB({locale, testType}): Cypress.Chainable<JQuery<expectedData[]>> // ??? not sure what return type should be given here.
        }
    }
}


Cypress.Commands.add('getTestDataFromDynamoDB', ({locale, testType}) => {
    // expectedData is an interface declared. My use case is to return the list of this type.
    let presetList: expectedData[] 
    cy.task('getTestDataFromDynamoDB', {
        locale: locale,
        testType: testType
    }).then((presetData: any) => {
        presetList = presetData;
        // the whole idea here is to return presetList from cypress task
        return cy.wrap(presetList) //??? not sure what should be written here
    })
})

sampleSpec.ts

describe('The Sample Test', () => {

    it.only('DemoTest', () => {
        cy.getTestDataElmoDynamoDB({
            locale: env_parameters.env.locale,
            testType: "ChangePlan"
        }).then((presetlist) => {
           // not sure on how to access the list here. Tried wrap and alias but no luck.
          presetList.forEach((preset: expectedData) => {
             //blah blah blah
           })
        })
    })
})

Pracoval už niekto na podobnom prípade použitia?

Ďakujem, Saahith

Odpoveď č. 1

Tu je môj vlastný príkaz na presne toto.

Cypress.Commands.add("convertArrayOfAlliasedElementsToArrayOfInteractableElements", (arrayOfAlliases) => {

    let arrayOfRecievedAlliasValues = []

    for (let arrayElement of arrayOfAlliases) {
        cy.get(arrayElement)
            .then(aelement =>{
                arrayOfRecievedAlliasValues.push(aelement)
            })
    }

    return cy.wrap(arrayOfRecievedAlliasValues)

})

Spôsob, akým to robím, je preposlať to v poli a použiť cy.wrap na pole, pretože ti to umožňuje reťaziť príkaz s interaktívnym poľom.

Kľúčový bod je - musí byť odovzdaný ako pole alebo objekt, pretože sú to referenčné typy, a v Cypress je ťažké pracovať s let/var/const, ktoré sú hodnotové typy.

Objekt cy.wrapped si môžete tiež podľa želania aliasovať.

Spôsob, ako ho použiť v kóde, je: cy.convertArrayOfAlliasedElementsToArrayOfInteractableElements(ArayOfElements)

Odpoveď č. 2

To, o čo ste požiadali, môže byť implementované nasledovne, ale neviem, aký typ je expectedData, takže predpokladajme, že expectedData: string[], ale môžete nahradiť string[] svojím typom.

plugins/index.ts
module.exports = (on: any, config: any) => {
  on('task', {
    getDataFromDB(arg: {locale: string, testType: string}){
      // generate some data for an example
      const list: string[] = [];
      list.push('a', 'b');
      return list;
    },
  });
};
commands.ts
declare global {
  namespace Cypress {
    interface Chainable<Subject> {
      getTestDataElmoDynamoDB(arg: {locale: string, testType: string}): Cypress.Chainable<string[]>
    }
  }
}


Cypress.Commands.add('getTestDataElmoDynamoDB', (arg: {locale: string, testType: string}) => {
  let presetList: string[] = [];
  cy.task('getDataFromDB', arg)
    .then((presetData?: string[]) => {
      expect(presetData).not.be.undefined.and.not.be.empty;
      // if the data is incorrect, the code will break earlier on expect, this line for typescript compiler
      if (!presetData || !presetData.length) throw new Error('Present data are undefined or empty');
      presetList = presetData;
      return cy.wrap(presetList); // or you can return cy.wrap(presetData)
    });
});
db.spec.ts
describe('Test database methods', () => {
    it('When take some test data, expect that the data was received successfully ', () => {
        cy.getTestDataElmoDynamoDB({ locale: 'someEnvVar', testType: 'ChangePlan' })
          .then((list) => {
            expect(list).not.empty.and.not.be.undefined;
            cy.log(list); // [a,b]
            // You can interact with list here as with a regular array, via forEach();
        });
    });
});

Môžete tiež pristupovať k údajom a prijímať ich z cy.task priamo v súbore špecifikácie.

describe('Test database methods', () => {
    it('When take some test data, expect that the data was received successfully ', () => {
        cy.task('getDataFromDB', arg)
            .then((list?: string[]) => {
                expect(list).not.be.empty.and.not.be.undefined;
                cy.log(list); // [a,b] — the same list as in the version above
        });
    });
});