Комплексное руководство по отображению меток времени в миллисекундах с помощью Cypress

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

Метод 1: Использование метода JavaScript getTime()
Cypress позволяет нам выполнять код JavaScript в наших тестах. Мы можем использовать встроенный объект DateJavaScript и его метод getTime()для получения временных меток в миллисекундах. Вот пример:

it('displays timestamp in milliseconds using getTime()', () => {
  cy.visit('/your-page'); // Replace with your page URL
  cy.window().then((win) => {
    const timestamp = new Date().getTime();
    cy.log(`Timestamp in milliseconds: ${timestamp}`);
  });
});

Метод 2: использование функций cy.clock()и cy.tick()Cypress
Cypress предоставляет функцию cy.clock()для управления виртуальными часами, используемыми браузер во время выполнения теста. Объединив ее с функцией cy.tick(), мы можем вручную перевести часы на желаемое количество миллисекунд. Вот пример:

it('displays timestamp in milliseconds using cy.clock() and cy.tick()', () => {
  cy.visit('/your-page'); // Replace with your page URL
  cy.clock();
  const milliseconds = 1000; // Replace with your desired number of milliseconds
  cy.tick(milliseconds).then(() => {
    const timestamp = new Date().getTime();
    cy.log(`Timestamp in milliseconds: ${timestamp}`);
  });
});

Метод 3: Пользовательская команда с Cypress.on()и window.performance
Мы можем создать пользовательскую команду Cypress, используя прослушиватель событий Cypress.on()и API window.performance. Этот метод позволяет нам фиксировать событие загрузки страницы и извлекать время начала навигации. Вот пример:

Cypress.Commands.add('getTimestamp', () => {
  Cypress.on('window:before:load', (win) => {
    win.performance.mark('start');
  });
  return cy.window().then((win) => {
    win.performance.getEntriesByName('start')[0].startTime;
  });
});
it('displays timestamp in milliseconds using custom command', () => {
  cy.visit('/your-page'); // Replace with your page URL
  cy.getTimestamp().then((timestamp) => {
    cy.log(`Timestamp in milliseconds: ${timestamp}`);
  });
});

В этой статье мы рассмотрели несколько методов отображения временных меток в миллисекундах в тестах Cypress. Предпочитаете ли вы использовать метод getTime()JavaScript, функции cy.clock()и cy.tick()Cypress или создать собственную команду с помощью 17и window.performance, теперь у вас есть инструменты для точного измерения и отображения временных меток в миллисекундах. Включив эти методы в рабочий процесс тестирования Cypress, вы сможете получить ценную информацию о временных аспектах вашего веб-приложения.

Не забудьте выбрать метод, который лучше всего соответствует вашим конкретным потребностям тестирования, и удачного тестирования с Cypress!