Тестирование навигации

Universal Router — это гибкая библиотека для управления маршрутизацией в JavaScript-приложениях. При разработке приложений важно не только правильно настроить маршруты, но и убедиться, что навигация работает корректно. Тестирование навигации позволяет выявить ошибки в сопоставлении URL с маршрутами, неправильную передачу параметров и некорректное выполнение обработчиков.

Проверка сопоставления маршрутов

Основная цель тестирования маршрутов — убедиться, что каждый URL корректно сопоставляется с ожидаемым маршрутом. Для этого создается экземпляр UniversalRouter с набором маршрутов:

import UniversalRouter from 'universal-router';

const routes = [
  { path: '/', action: () => 'Главная' },
  { path: '/about', action: () => 'О нас' },
  { path: '/users/:id', action: ({ params }) => `Пользователь ${params.id}` },
];

const router = new UniversalRouter(routes);

Для теста сопоставления используется метод resolve():

const result = await router.resolve('/users/42');
console.assert(result === 'Пользователь 42', 'Маршрут /users/:id должен возвращать корректный результат');

Ключевые моменты при тестировании сопоставления:

Проверка маршрутов с параметрами (:id, :slug).
Проверка маршрутов с необязательными параметрами (:id?).
Проверка маршрутов с регулярными выражениями.
Проверка маршрутов с подмаршрутами и вложенными структурами.

Тестирование обработки параметров

Universal Router передает параметры URL в объект params. Важно убедиться, что они корректно извлекаются:

const result = await router.resolve('/users/123');
console.assert(result === 'Пользователь 123', 'Параметр id должен быть корректно передан в action');

Дополнительно проверяются случаи:

Пустые или отсутствующие параметры.
Параметры с особыми символами (например, /users/john-doe).
Несовпадение типов параметров (число вместо строки, и наоборот).

Проверка вложенных маршрутов

В Universal Router поддерживаются вложенные маршруты. Тестирование вложенных маршрутов позволяет убедиться, что маршрутизация правильно передает управление по иерархии:

const routes = [
  {
    path: '/users',
    children: [
      { path: '/', action: () => 'Список пользователей' },
      { path: '/:id', action: ({ params }) => `Профиль пользователя ${params.id}` },
    ],
  },
];

const router = new UniversalRouter(routes);

const listResult = await router.resolve('/users');
console.assert(listResult === 'Список пользователей');

const profileResult = await router.resolve('/users/7');
console.assert(profileResult === 'Профиль пользователя 7');

Особое внимание уделяется:

Совмещению маршрутов с одинаковой базой (/users и /users/:id).
Приоритету более конкретных маршрутов.
Корректной работе вложенных action.

Тестирование асинхронных действий

Universal Router поддерживает асинхронные action. Тестирование асинхронной навигации требует использования async/await или промисов:

const routes = [
  { path: '/data', action: async () => {
    const response = await fetchData();
    return response;
  }},
];

const router = new UniversalRouter(routes);

const result = await router.resolve('/data');
console.assert(result === 'Данные загружены', 'Асинхронный маршрут должен вернуть данные');

Особенности тестирования асинхронных маршрутов:

Проверка корректной обработки ошибок (например, fetch вернул 404).
Проверка последовательности вызова действий.
Проверка отмены или прерывания навигации.

Обработка ошибок и некорректных URL

Важно тестировать сценарии, когда URL не соответствует ни одному маршруту. Universal Router позволяет задать errorHandler или обрабатывать ошибки через resolve():

try {
  await router.resolve('/nonexistent');
} catch (err) {
  console.assert(err.message === 'Route not found', 'Должна выбрасываться ошибка для неизвестного маршрута');
}

Рекомендуется проверять:

Некорректные URL (например, лишние слэши или недопустимые символы).
Ошибки в action (исключения или rejected промисы).
Поведение при отсутствии обработчика ошибок.

Интеграционное тестирование навигации

Для крупных приложений тестирование маршрутов в изоляции недостаточно. Интеграционные тесты позволяют проверить совместную работу Universal Router с интерфейсом, например, с реактивными компонентами или серверным рендерингом. Основные подходы:

Эмуляция переходов между страницами и проверка отображаемого контента.
Проверка изменения URL и состояния приложения.
Использование фреймворков для тестирования (Jest, Mocha, Cypress).