Миграция с TestCafe

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

Главное отличие: Cypress выполняет тесты в реальном времени в контексте браузера, что обеспечивает мгновенную обратную связь и возможность отладки через DevTools. TestCafe, напротив, запускает тесты из Node.js и взаимодействует с браузером удаленно.

Структура тестов

В TestCafe тесты обычно оформляются через функции fixture и test, а селекторы строятся через Selector. В Cypress структура тестов строится на базе Mocha:

describe('Пример теста', () => {
  it('Должен проверять элемент на странице', () => {
    cy.visit('https://example.com');
    cy.get('#element').should('be.visible');
  });
});

Особенности:

  • describe — группа тестов (аналог fixture в TestCafe).
  • it — отдельный тест (аналог test).
  • cy.get(selector) — поиск элементов (аналог Selector в TestCafe).
  • Асинхронность управляется встроенными командами Cypress, нет необходимости использовать await для стандартных действий.

Работа с селекторами

В TestCafe селекторы создаются через Selector('css') или Selector с фильтрами. В Cypress используется цепочка команд:

cy.get('.button')
  .contains('Отправить')
  .click();

Особенности Cypress:

  • Все команды автоматически ожидают элемент (implicit wait), нет необходимости вручную добавлять t.expect(...).ok().
  • Возможность использовать .should() для проверки состояния элемента, что упрощает ассерты.

Асинхронность и ожидания

TestCafe требует явного использования await для асинхронных действий:

await t.click(Selector('#submit'));

Cypress управляет асинхронностью через цепочки команд:

cy.get('#submit').click();

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

Работа с HTTP-запросами и API

TestCafe использует встроенные методы для перехвата и модификации запросов через RequestMock или RequestLogger. В Cypress используется команда cy.intercept():

cy.intercept('GET', '/api/users', { fixture: 'users.json' }).as('getUsers');
cy.visit('/users');
cy.wait('@getUsers').its('response.statusCode').should('eq', 200);

Преимущества:

  • Полная интеграция с сетевыми запросами.
  • Возможность асинхронного ожидания и проверки ответа.
  • Поддержка перехвата, подмены и записи данных.

Работа с состоянием и куки

В TestCafe управление состоянием браузера осуществляется через t.setCookies, t.getCookies. В Cypress используются команды:

cy.setCookie('session', 'abc123');
cy.getCookie('session').should('have.property', 'value', 'abc123');

Также Cypress позволяет напрямую работать с localStorage через cy.setLocalStorage и cy.getLocalStorage.

Снимки и скриншоты

В TestCafe скриншоты делаются через t.takeScreenshot(). В Cypress это делается с помощью:

cy.screenshot('имя_скриншота');

Cypress поддерживает автоматические скриншоты при падении теста и видео записи, что упрощает анализ ошибок.

Миграция ассертов

TestCafe использует встроенные t.expect:

await t.expect(Selector('#title').innerText).eql('Заголовок');

В Cypress ассерты делаются через Chai и .should():

cy.get('#title').should('have.text', 'Заголовок');

Особенности:

  • Cypress автоматически повторяет проверку до таймаута.
  • Можно комбинировать различные цепочки .should('be.visible').and('contain', 'Текст').

Использование команд и хуков

TestCafe поддерживает хуки через fixture.beforeEach и fixture.afterEach. Cypress использует Mocha хуки:

beforeEach(() => {
  cy.visit('/login');
});

afterEach(() => {
  cy.clearCookies();
});

Стратегия миграции тестов

  1. Переписать fixture → describe и test → it.
  2. Заменить селекторы Selector() на cy.get(), при необходимости использовать .contains().
  3. Убрать await и заменить ассерты на .should().
  4. Переписать работу с сетью через cy.intercept().
  5. Обновить хуки beforeEach и afterEach.
  6. Проверить скриншоты и видео на соответствие новой инфраструктуре.

Преимущества миграции

  • Более высокая скорость выполнения за счет работы внутри браузера.
  • Мгновенная обратная связь через Cypress Test Runner.
  • Более простая работа с асинхронностью и повторными попытками.
  • Расширенные возможности для перехвата и модификации HTTP-запросов.
  • Интеграция с CI/CD и визуальные отчеты с видео и скриншотами.

Миграция с TestCafe на Cypress требует внимательной перестройки структуры тестов и синтаксиса, но в итоге обеспечивает более гибкую и производительную автоматизацию.

Оглавление