Как я могу заставить эту функцию принимать динамические значения?

#javascript #typescript #cypress

Вопрос:

Я создал функцию для проверки поля ввода, в настоящее время функция принимает 6 входных данных, 3 из них-вводимый текст, а остальные 3-сообщения об ошибках, которые мы получаем при вводе определенного текста, это работает нормально. Функция будет циклически работать в зависимости от количества введенных текстов, поэтому в этом случае она введет текст, а затем нажмет кнопку Отправить, а затем проверит сообщение об ошибке. Это будет сделано 3 раза, потому что я передаю 3 текстовых значения. Однако я хочу сделать его динамичным, чтобы он мог принимать любые числовые значения и циклически повторяться в зависимости от того, сколько их передано.

 Cypress.Commands.add('checkErrMsg', (fieldText1, fieldText2, fieldText3, errorText1,errorText2, errorText3) => { 
var fieldValues = [fieldText1, fieldText2, fieldText3];
var errorValues = [errorText1, errorText2, errorText3];
var sum =0;

fieldValues.forEach(function(entry) {
    cy.get('.textBox').clear().type(entry)
    cy.get('.addBtn').click()
    cy.get('#errMsg').should('be.visible').and('have.contain',(errorValues[sum  ])).click();
});
})
 

Я добавляю пользовательскую команду в пространство имен, как того требует проект typescript на Кипре.

 declare namespace Cypress {
interface Chainable {
    checkErrMsg(fieldText1: string, fieldText2: string, fieldText3:string, errorText1:string
    ,errorText2: string, errorText3:string): Chainable<string>;
}
}
 

Ответ №1:

Лучший способ создать такого рода вариативную функцию — использовать параметр rest. Сложность заключается в том, что вам нужно два — одно для полей, одно для ошибок — если у вас есть каждый из них в качестве отдельного аргумента. Одним из вариантов является [string, string] тип кортежа для каждой пары полей и ошибок. Декларация будет выглядеть следующим образом:

 declare namespace Cypress {
    type FieldAndErrorValues = [string, string];
    interface Chainable {
        checkErrMsg(...fieldAndErrorValues: FieldAndErrorValues[]): Chainable<string>;
    }
}
 

И осуществление:

 Cypress.Commands.add('checkErrMsg', (...fieldAndErrorValues: Cypress.FieldAndErrorValues[]) => { 
    fieldAndErrorValues.forEach(function([fieldValue, errorValue]) {
        cy.get('.textBox').clear().type(fieldValue);
        cy.get('.addBtn').click();
        cy.get('#errMsg').should('be.visible').and('have.contain',(errorValue)).click();
    });
});
 

И возможный вызов:

 cy.checkErrMsg(['field1', 'error1'], ['field2', 'error2']);