Работа с window объектом

Объект window является корневым объектом браузера и предоставляет доступ к глобальному контексту веб-страницы. В контексте тестирования с Cypress его использование позволяет взаимодействовать с глобальными переменными, функциями, локальным хранилищем (localStorage) и сессиями (sessionStorage). Cypress обеспечивает удобный API для работы с window, сохраняя при этом контроль над асинхронностью и гарантируя стабильность тестов.

Получение объекта window

Для получения доступа к глобальному объекту страницы используется команда:

cy.window().then((win) => {
  // win — объект window страницы
});

Ключевой момент: Cypress автоматически ожидает загрузки страницы перед вызовом cy.window(). Это исключает необходимость ручной синхронизации с событием load.

Пример:

cy.visit('/dashboard');
cy.window().then((win) => {
  expect(win.document.title).to.equal('Dashboard');
});

Доступ к глобальным переменным и функциям

Многие приложения создают глобальные объекты для конфигурации или вспомогательных функций. Через window можно их получить и протестировать:

cy.window().then((win) => {
  expect(win.myAppConfig.apiUrl).to.contain('https://api.example.com');
  win.initializeWidgets();
});

Важно помнить, что прямое вмешательство в глобальные объекты может влиять на последующие тесты, поэтому изменения стоит ограничивать локально.

Работа с localStorage и sessionStorage

Cypress позволяет безопасно манипулировать данными хранилищ браузера через объект window:

cy.window().then((win) => {
  // Сохраняем данные
  win.localStorage.setItem('token', '123456');
  
  // Проверяем значение
  expect(win.localStorage.getItem('token')).to.equal('123456');
  
  // Удаляем данные
  win.localStorage.removeItem('token');
});

Для sessionStorage принцип аналогичен:

cy.window().then((win) => {
  win.sessionStorage.setItem('sessionId', 'abc123');
  expect(win.sessionStorage.getItem('sessionId')).to.equal('abc123');
});

Существуют также специальные команды Cypress cy.setLocalStorage() и cy.getLocalStorage(), но использование cy.window() позволяет гибко управлять любыми аспектами хранилища.

Мокинг и шпионирование функций

Объект window предоставляет возможность перехватывать вызовы функций и контролировать их поведение. Для этого используют cy.stub() или cy.spy():

cy.window().then((win) => {
  cy.stub(win, 'alert').as('alertStub');
});

// Вызов функции на странице
cy.get('#submit').click();

// Проверка вызова
cy.get('@alertStub').should('have.been.calledWith', 'Форма отправлена');

Такой подход позволяет тестировать обработчики событий и глобальные функции без реального выполнения побочных эффектов.

Управление таймерами

Если приложение использует setTimeout или setInterval, объект window позволяет контролировать их с помощью Cypress:

cy.window().then((win) => {
  cy.spy(win, 'setTimeout').as('timeoutSpy');
});

// Инициация таймера
cy.get('#startTimer').click();

cy.get('@timeoutSpy').should('have.been.called');

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

Вызов методов и доступ к свойствам через цепочку

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

cy.window()
  .its('myApp')
  .invoke('initializeWidgets')
  .then(() => {
    cy.get('#widgetContainer').should('exist');
  });

Метод .its() позволяет напрямую получить вложенное свойство объекта, а .invoke() — вызвать функцию, сохраняя синхронизацию с Cypress.

Практические рекомендации

  • Использовать cy.window() только после полной загрузки страницы или целевого компонента.
  • Изменения глобальных объектов должны быть минимальными и локализованными.
  • Для проверки глобальных переменных предпочтительно использовать .its() и .should().
  • Для контроля сторонних эффектов (например, alert, confirm) применять cy.stub() или cy.spy().

Объект window в Cypress открывает доступ к глубинным возможностям браузера, позволяя тестировать как функциональность страницы, так и интеграцию с глобальными переменными, хранилищем и таймерами. Грамотное использование cy.window() обеспечивает стабильные и масштабируемые тесты с высокой степенью контроля над поведением приложения.

Оглавление