Конфигурация

Передайте параметры адаптеру PageFlow:

PageFlow.vite({
  enabled: true,
  previewPath: '/__unplugin-pageflow/',
  appUrl: '/',
  dynamicParams: {
    '/products/:id': { id: 'demo-product' },
  },
})

Параметры

Параметр	По умолчанию	Описание
enabled	true	Включает PageFlow на сервере разработки.
previewPath	/__unplugin-pageflow/	URL визуальной карты.
appUrl	/	Маршрут для обнаружения роутера приложения.
dynamicParams	{}	Задаёт примеры динамических параметров маршрута.
pageTests	{}	Явно связывает glob маршрутов с glob тестовых файлов.
testCommands	{}	Включает выполнение тестов каждого типа с явными командами без shell.

Тесты страниц

PageFlow автоматически связывает тесты, импортирующие компонент страницы, использующие одноимённый файл или переходящие к полному маршруту в тестовом сценарии. Неоднозначные тесты можно сопоставить явно:

PageFlow.vite({
  pageTests: {
    '/orders/**': ['tests/orders-*.spec.ts'],
  },
  testCommands: {
    unit: { command: 'pnpm', args: ['vitest', 'run', '{file}', '-t', '{name}'] },
    component: { command: 'pnpm', args: ['vitest', 'run', '{file}', '-t', '{name}'] },
    e2e: { command: 'pnpm', args: ['playwright', 'test', '{file}', '-g', '{name}'], timeoutMs: 180_000 },
  },
})

{file} и {name} заменяются индексированными файлом и именем сценария. Команды выполняются из корня проекта с shell: false; по умолчанию ни одна команда не угадывается и не включается. Тест может выполняться 120 секунд, а timeoutMs задаёт предел от 1 секунды до 30 минут.

PageFlow хранит последние 500 результатов в .unplugin-pageflow/cache/test-results.json. Изменение тестового файла автоматически делает предыдущий результат недействительным. Сохранённый вывод ограничен последними 20 КБ на тест; каталог кэша должен игнорироваться Git.

Параметры динамических маршрутов

PageFlow нужны конкретные значения для отображения маршрута вроде /products/:id:

PageFlow.vite({
  dynamicParams: {
    '/products/:id': {
      id: 'demo-product',
    },
    '/users/:userId/orders/:orderId': {
      userId: 'alice',
      orderId: 'order-100',
    },
  },
})

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

Готовность превью

Перед снимком PageFlow ждёт загрузки шрифтов и изображений, а также стабилизации DOM. Страница с долгой асинхронной работой может явно сообщить о готовности:

window.__UNPLUGIN_PAGEFLOW_READY__?.()