Тестирование сервис-воркеров: общие подходы

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

Регистрация и активация сервис-воркеров

Первый шаг — проверка успешной регистрации сервис-воркера. Это включает:

  • Регистрация скрипта через navigator.serviceWorker.register().
  • События жизненного цикла: install, activate, statechange.
  • Управление версиями: проверка, что новый сервис-воркер корректно обновляет старый без конфликтов.

Пример проверки регистрации в автоматизированном тесте:

navigator.serviceWorker.register('/sw.js')
  .then(registration => {
    if (!registration.active) {
      throw new Error('Service worker не активен');
    }
  });

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

Кэширование и стратегии работы с ресурсами

Workbox предоставляет готовые стратегии кэширования, которые необходимо тестировать в разных сценариях:

  1. Cache First — сначала проверяется кэш, затем сеть. Тестирование должно включать:

    • Поведение при наличии закэшированного ресурса.
    • Загрузку новых версий при отсутствии кэша.
    • Очистку устаревших кэшей через expiration и cacheName правила.

  2. Network First — сначала сеть, затем кэш. Особенности тестирования:

    • Симуляция отсутствия сети.
    • Проверка обновления кэша при успешном сетевом ответе.
    • Корректная обработка ошибок сети.

  3. Stale While Revalidate — возвращает кэшированное содержимое сразу, одновременно обновляя его из сети. Тесты должны убедиться, что:

    • Пользователь получает закэшированную версию мгновенно.
    • Новые данные записываются в кэш для последующих запросов.

Пример конфигурации Workbox для Cache First:

workbox.routing.registerRoute(
  ({request}) => request.destination === 'image',
  new workbox.strategies.CacheFirst({
    cacheName: 'images-cache',
    plugins: [
      new workbox.expiration.ExpirationPlugin({ maxEntries: 50 }),
    ],
  })
);

Тестирование жизненного цикла кэшей

Ключевой аспект — управление версиями кэшей:

  • Добавление ресурсов в кэш во время события install.
  • Очистка устаревших кэшей в событии activate.
  • Проверка взаимодействия с плагинами Workbox (ExpirationPlugin, CacheableResponsePlugin) для корректного удаления и обновления данных.

Тестирование может включать автоматизированные проверки с помощью Puppeteer или Playwright, эмулирующих закрытие и повторное открытие вкладок, чтобы убедиться, что новые версии сервис-воркеров корректно активируются.

Обработка сетевых запросов и офлайн-режим

Сервис-воркеры работают как промежуточный слой между приложением и сетью. Тесты должны проверять:

  • Обработку GET и POST запросов.
  • Сценарии офлайн-доступа к ресурсам.
  • Корректную работу при нестабильном соединении.

Пример теста офлайн-доступа с использованием Puppeteer:

await page.setOfflineMode(true);
const response = await page.goto('/index.html');
const content = await page.content();
if (!content.includes('Основной контент')) {
  throw new Error('Офлайн-доступ не работает');
}

Логирование и отслеживание ошибок

Workbox поддерживает плагины для логирования:

  • Debug logging: помогает отследить события кэширования.
  • Custom plugins: можно создавать плагины для проверки успешности запросов и обработки исключений.

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

Автоматизация тестирования сервис-воркеров

Используются инструменты для имитации поведения браузера:

  • Jest + jsdom: ограничено, подходит для unit-тестов.
  • Puppeteer / Playwright: полный контроль над вкладками и состоянием сети.
  • Workbox Testing Utilities: встроенные утилиты Workbox для проверки стратегий кэширования.

Примеры автоматизации:

  • Проверка регистрации и активации сервис-воркера.
  • Тестирование различных стратегий кэширования с симуляцией сетевых условий.
  • Контроль версий кэша при обновлении приложения.

Особенности тестирования push-уведомлений и фоновых синхронизаций

Сервис-воркеры могут обрабатывать push-сообщения и синхронизацию данных в фоне. Тестирование включает:

  • Эмуляцию событий push и sync.
  • Проверку вызова соответствующих callback-функций.
  • Контроль отображения уведомлений через showNotification.

Автоматизированные тесты часто используют моки браузерных API:

self.addEventListener('push', event => {
  event.waitUntil(
    self.registration.showNotification('Новое сообщение')
  );
});

Тонкости работы с Workbox

  • Precaching: ресурсы, перечисленные в precacheManifest, должны быть проверены на актуальность и доступность.
  • Runtime caching: динамически загружаемые ресурсы требуют проверки всех сценариев (сеть, кэш, офлайн).
  • Версионирование и управление старыми кэшами: ключевой момент, особенно при крупных обновлениях приложения.

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

Оглавление