@storyshots/web-api-mocks

Подменяет Date, таймеры и локальные хранилища на их тестируемые аналоги через инвазивный метод.

install

Подменяет недетерминированный браузерный API. Возвращает Clock.

import { install } from '@storyshots/web-api-mocks';

// Замораживает время на странице на отметке 13.01.2024 12:00
export const clock = install({ now: new Date(2024, 0, 13, 12) });

Внимание

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

clock

Объёкт управления временем.

Работает по следующим правилам:

• Дата остаётся фиксированной и не изменяется с течением времени.
• Таймеры (setTimeout, setInterval) на странице выполняются в обычном режиме.

подсказка

clock доступен в глобальном объекте window, что делает доступным его использование в exec.

tick

Проматывает время вперёд на указанное кол-во ms.

Рассмотрим поведение:

// Уведомление закрывается через 5 секунд
setTimeout(() => closeNotification(), 5_000);

Для того чтобы не ждать в истории так долго, можно воспользоваться специальным методом tick:

it('closes notification', {
  act: (actor) =>
    actor
      .screenshot('NotificationShown')
      // Перемотать на 5 секунд вперёд
      .exec(() => window.clock.tick(5_000))
      .screenshot('NotificationHidden'),
});

примечание

Метод влияет только на таймеры, текущая дата остаётся не тронутой. См. unfreeze

setSystemTime

Устанавливает текущую дату:

it('...', {
  arrange: (externals) => {
    // Для данной истории дата будет установлена как 13.01.2024
    clock.setSystemTime(new Date(2024, 0, 13));

    return externals;
  },
});

примечание

Метод влияет только на текущую дату, таймеры не пересчитываются.

unfreeze

Размораживает текущую дату:

it('...', {
  arrange: (externals) => {
    // Для данной истории дата будет изменяться с течением времени
    clock.unfreeze();

    return externals;
  },
});

Внимание

Функция unfreeze по сути возвращает естественное течение времени на страницу, частично отменяя действия @storyshots/web-api-mocks.

Полезен крайне редко, например при использовании debounce. В остальном, не рекомендуется к применению.

Состояние

@storyshots/web-api-mocks также подменяет локальные хранилища на те, что хранят свои данные во временной памяти.

// Данная запись будет автоматически стёрта при запуске новой истории
localStorage.setItem('token', '...');

примечание

IndexedDB не заменяется данным модулем.