Множественные перенаправления в Cypress

Из этой статьи вы узнаете, как протестировать множественные перенаправления (redirect) с одной страницы на другую в Cypress.

БЕСПЛАТНО СКАЧАТЬ КНИГИ в телеграм канале "Библиотека тестировщика"

Давайте рассмотрим одно очень простое приложение. В нем, нажав на кнопку “Let’s go!”, мы попадем на page2.html, а с нее нас немедленно перенаправит на page3.html.

Все происходит очень быстро, но если присмотреться, то можно увидеть, что перенаправление происходит в течение примерно секунды в адресной строке. Давайте напишем тест для всех наших перенаправлений, чтобы знать, что каждое из них действительно происходит.

Наш тест будет выглядеть следующим образом:

it('redirects to page2 and page3', () => {

  cy
    .visit('/')

  cy
    .get('a')
    .click()

  // test first redirect
  cy
    .location('href')
    .should('eq', 'page2')

  // test second redirect
  cy
    .location('href')
    .should('eq', 'page3')

});

Однако, когда мы запускаем наш тест, мы видим, что он не работает. Наше перенаправление происходит слишком быстро. Поскольку Cypress ждет полной загрузки страницы, наше утверждение приходит слишком поздно, и тест проваливается.

Мы видим, что Cypress регистрирует событие перенаправления. Это происходит следующим образом: всякий раз, когда изменяется url, это отмечается программой. Используя команду cy.on, мы можем зарегистрировать событие под названием url:changed. Оно возвращает url, на который происходит перенаправление, поэтому мы можем поместить его в массив всех наших перенаправлений и протестировать массив. Например, таким образом:

it('passing test', () => {

  const urlRedirects = [];

  cy
    .visit('/')

  cy
    .on('url:changed', (url) => {
      urlRedirects.push(url);
    });


  cy
    .get('a')
    .click()

  cy
    .then(() => {

      expect(urlRedirects).to.have.length(3);
      expect(urlRedirects[1]).to.eq(`${Cypress.config('baseUrl')}/page2`);
      expect(urlRedirects[2]).to.eq(`${Cypress.config('baseUrl')}/page3`);

    });

});

Вместо использования команды .location() мы теперь просто проверяем наш массив urlRedirects. Важно отметить, что здесь нам необходимо использовать команду .then(), иначе наше утверждение будет выполнено до того, как массив будет заполнен значениями.

Перевод статьи «Dealing with multiple redirects in Cypress».

Оставьте комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *