Повторяющиеся команды

Question

У меня есть несколько тестов на странице с поисковым вводом.

Все тесты в основном одинаковы, за исключением первого: команда type - меняется.

Есть ли способ избежать дублирования кода в каждом тесте??

it('Search test1', () => {
    searchedString = '0987416572';
    cy.get('input[data-test="Search"]').type(searchedString); //same for all test
    cy.get('span[data-test="Submit"]').should('be.visible'); //same for all test
    cy.get('input[data-test="Search"]').should('have.value', searchedString); //same for all test
    cy.get('span[data-test="Submit"]').click(); //same for all test
    cy.contains('No results');
  });

  it('Search test2', () => {
    searchedString = 'rewretretre';
    cy.get('input[data-test="Search"]').type(searchedString); //same for all test
    cy.get('span[data-test="Submit"]').should('be.visible'); //same for all test
    cy.get('input[data-test="Search"]').should('have.value',  searchedString); //same for all test
    cy.get('span[data-test="Submit"]').click(); //same for all test
    cy.contains('No results');
  });

  it('Search test3', () => {
    searchedString = '1234';
    cy.get('input[data-test="Search"]').type(searchedString); //same for all test
    cy.get('span[data-test="Submit"]').should('be.visible'); //same for all test
    cy.get('input[data-test="Search"]').should('have.value', searchedString); //same for all test
    cy.get('span[data-test="Submit"]').click(); //same for all test
    cy.get('div[data-test="Results"]').should('be.visible');
  });

Имеет ли смысл добавить функцию для команды duplicates и вызвать эту функцию?Есть ли лучший способ?

Answer 1

Как уже упоминалось в документации Cypress о пользовательских командах , не все должно быть пользовательской командой.В этом случае функции работают отлично.

В верхней части файла укажите:

 const submitSearch = (searchedString) => {
   cy.get('input[data-test="Search"]').type(searchedString)
   cy.get('span[data-test="Submit"]').should('be.visible')
   cy.get('input[data-test="Search"]').should('have.value', searchedString)
   cy.get('span[data-test="Submit"]').click()
 }

, затем в ваших тестах:

it('Search test1', () => {
  submitSearch('0987416572')
  cy.contains('No results');
});

Answer 2

Вы можете создать Custom Command:

Cypress поставляется со своим собственным API для создания пользовательских команд и перезаписи существующих команд.

Ваша пользовательская команда может выглядеть (добавлено к cypress/support/commands.js):

Cypress.Commands.add('search', searchString => {
    cy.get('input[data-test="Search"]').type(searchedString)
    cy.get('span[data-test="Submit"]').should('be.visible')
    cy.get('input[data-test="Search"]').should('have.value', searchedString)
    cy.get('span[data-test="Submit"]').click()
})

, тогда вы можете использовать ее в своем тесте, например:

it('Search test3', () => {
    cy.search('1234')
    cy.get('div[data-test="Results"]').should('be.visible');
  })