docs: make project documentation self-contained
This commit is contained in:
@@ -1,51 +1,34 @@
|
||||
# Frontend Workflow
|
||||
# Frontend: ответственность и проверка
|
||||
|
||||
Frontend требует Node 22. В `frontend/` чистая установка и полный локальный quality gate выполняются так:
|
||||
Frontend предоставляет пользовательские экраны, навигацию и представление
|
||||
финансовых данных. Он получает данные только через публичный API backend;
|
||||
credentials T-Bank остаются на сервере. Состав приложения и потоки показаны
|
||||
в [обзоре системы](../architecture/system-overview.md).
|
||||
|
||||
```bash
|
||||
nvm use --silent
|
||||
npm ci
|
||||
npm run verify
|
||||
```
|
||||
## Совместимость с backend
|
||||
|
||||
`verify` проверяет OpenAPI drift, TypeScript, Biome, один coverage-backed запуск Vitest, Knip,
|
||||
FSD dependency rules, runtime graph stories и отдельные сборки приложения и
|
||||
Storybook. Он работает без backend. Coverage
|
||||
остаётся anti-regression constraint; правила выбора тестов зафиксированы в
|
||||
[engineering governance](engineering-governance.md).
|
||||
Типизированный клиент frontend производится из опубликованного backend
|
||||
OpenAPI. Согласованность клиента с сохранённым описанием API и согласованность
|
||||
этого описания с работающим backend проверяются отдельно.
|
||||
Изменение публичного контракта требует обновления производного клиента;
|
||||
подробности — [согласованность OpenAPI](runtime-openapi-verification.md).
|
||||
|
||||
Изолированные примеры реальных компонентов и композиций запускаются в Storybook
|
||||
через `npm run dev:catalog`. `npm run build:catalog` создаёт `storybook-static/`,
|
||||
а `npm run preview:catalog` обслуживает эту статическую сборку. Структура каталога,
|
||||
работа с Docs, Controls и Actions, доступность и ограничения описаны в
|
||||
[UI-каталоге Storybook](ui-catalog.md).
|
||||
## Проверка интерфейса
|
||||
|
||||
Для UI задачи используйте каталог как reference существующего решения.
|
||||
Ожидаемые экраны, states и interactions определите по [задаче](engineering-governance.md#ui-решения).
|
||||
Storybook показывает реализацию; визуальное соответствие и доступность
|
||||
проверяются отдельно от сборки. SDD-пакет для этого не обязателен.
|
||||
Локальная проверка frontend охватывает корректность типов, статический анализ,
|
||||
автоматические сценарии, зависимости и сборку приложения и UI-каталога.
|
||||
Она может выполняться без запущенного backend. Покрытие тестами ограничивает
|
||||
регрессии; само по себе число покрытых строк не доказывает правильность
|
||||
финансового расчёта, доступность или прохождение пользовательского сценария.
|
||||
|
||||
Backend остаётся источником OpenAPI. После изменения опубликованного
|
||||
backend-контракта разработчик обновляет в `frontend/` committed snapshot
|
||||
`src/shared/api/spec/openapi.json` копированием backend OpenAPI document, затем
|
||||
запускает:
|
||||
|
||||
```bash
|
||||
npm run openapi:generate
|
||||
```
|
||||
|
||||
Команда использует только committed snapshot и регенерирует
|
||||
`src/shared/api/generated/schema.d.ts` offline. Проверку соответствия backend
|
||||
runtime contract и frontend snapshot выполняют отдельной backend-командой
|
||||
`npm run test:openapi-contract`.
|
||||
[Каталог](ui-catalog.md) показывает существующие визуальные решения.
|
||||
Соответствие задаче, широкий и узкий экран, клавиатурная навигация и восстановление
|
||||
после ошибок проверяются в интерфейсе отдельно от успешной сборки.
|
||||
|
||||
## Состояние тестового клиента
|
||||
|
||||
`frontend/src/test/query.tsx` предоставляет `createTestQueryClient` с отключёнными
|
||||
test retries и query-only `createQueryWrapper`. Независимый case получает свой
|
||||
client до React wrapper render; rerender сохраняет тот же экземпляр и seeded
|
||||
cache. Auth и T-Bank tests используют эту же фабрику. Mantine, Router и
|
||||
AuthProvider остаются явно выбранными локальными providers.
|
||||
|
||||
Общий teardown последовательно выполняет RTL cleanup, сброс auth client и
|
||||
сброс MSW handlers. Production query defaults этой инфраструктурой не меняются.
|
||||
Независимые проверки получают изолированное состояние клиента. Обновление
|
||||
представления внутри одного сценария сохраняет его кэш; следующий сценарий
|
||||
не наследует сессию и ответы предыдущего. Повторные попытки в тестовой среде
|
||||
могут быть отключены для предсказуемого результата. Это не меняет
|
||||
[политику обновления данных приложения](../adr/007-react-query-fetch-policy.md).
|
||||
|
||||
Reference in New Issue
Block a user