Как проверить, что фронтенд корректно отправляет запрос на сохранение клиента

Что проверяют

Умеете ли вы отделить работу фронтенда от работы бэкенда: запрос ушёл правильный, а сохранил ли сервер данные, уже другой вопрос. Следом обычно спрашивают, как понять, чей это баг, если клиент не сохранился.

Как отвечать

Основной инструмент это вкладка Network в DevTools. Отфильтруйте Fetch/XHR, включите Preserve log (иначе при переходе после сохранения запрос пропадёт), нажмите «Сохранить» и разберите запрос:

• метод и URL: обычно POST на создание и PUT или PATCH на редактирование, эндпоинт сверяете со спецификацией в Swagger или OpenAPI;
• заголовки: Content-Type: application/json, Authorization с токеном, CSRF-токен, если он есть в проекте;
• тело (Payload): все поля формы на месте, ключи названы как в контракте, типы верные: телефон строкой, дата в согласованном формате, пустое необязательное поле уходит так, как договорились;
• число запросов: двойной клик не создаёт двух клиентов, кнопка блокируется на время отправки;
• реакция на ответ: при 201 форма показывает успех, при 400 и 422 подсвечивает поля, при 500 и обрыве сети не теряет введённое.

Ошибочные ответы удобно подменять, не ломая бэкенд: Local overrides в Chrome DevTools, breakpoint в Charles или Fiddler, throttling для медленной сети. В автотестах то же делают cy.intercept в Cypress или page.route и page.waitForRequest в Playwright с проверкой тела запроса.

Последний шаг: убедиться, что клиент реально появился, через GET по API или запрос в базу. Если в базе не то, что было в payload, это бэкенд; если в payload не то, что ввели в форму, это фронтенд.

Где спотыкаются

Смотрят только на сообщение «Сохранено». Тост может появиться и при ошибке, если фронтенд не проверяет статус ответа.

Проверяют только полностью заполненную форму. Баги живут в пустых необязательных полях, пробелах по краям, спецсимволах и кириллице.

Пишут в баг-репорте «клиент не сохраняется» без запроса и ответа. Приложите cURL из DevTools (Copy as cURL) или HAR, и разработчик сразу увидит, на чьей стороне проблема.