Автоматизация проверки форм на сайте
Клиент
Этот кейс мы сделали для себя — для команды Manao Dev. Но сама задача хорошо знакома маркетологам, агентствам и компаниям с активным сайтом, где формы — основной источник лидов и заявок.
Задача
У нас на сайте много форм. И чтобы не терять клиентов, важно, чтобы каждая работала. Раньше мы проверяли их вручную — открывали страницы, заполняли формы и сверяли отправки с лидами в CRM.
С развитием сайта форм стало больше, и проверка начала занимать до 2,5 часов в месяц. Процесс был долгим, скучным и зависел от человеческого фактора. Нужно было с этим что-то делать.
Почему это важно
Форма на сайте — это последняя точка контакта между пользователем и бизнесом. Если она не работает, компания теряет не данные, а реальные заявки и деньги.
Проблема в том, что ошибки в формах редко заметны сразу. Сайт может выглядеть нормально, кнопка «Отправить» нажимается, сообщение об успехе показывается — а в CRM при этом ничего не появляется. Особенно критично это в моменты, когда на сайт идёт платный трафик или активные рекламные кампании.
Чем больше сайт и чем чаще в него вносятся изменения, тем выше риск, что какая-то форма сломается незаметно. Ручная проверка в таком масштабе перестаёт быть надёжной — что-то легко пропустить или недопроверить. Именно поэтому мы решили сделать инструмент, который выполняет эту рутину автоматически и стабильно.
Первые попытки автоматизации
Техническое задание
-
Какие формы проверятьМы собрали список всех форм на сайте и описали их поведение: обязательные и необязательные поля, валидацию, сообщения об ошибках и успешной отправке. Это нужно, чтобы скрипт корректно повторял действия реального пользователя, а не просто «нажимал кнопки».
-
Какие данные использоватьМы подготовили тестовые данные, которые отправляются в CRM в отдельную категорию и не попадают менеджерам. Так мы проверяем реальные процессы, не мешая работе отдела продаж.
-
Как должен работать процесс
Мы хотели максимально простой сценарий:
-
запускаем проверку одной командой;
-
система сама открывает страницы;
-
заполняет формы по двум сценариям (полное и минимальное заполнение);
-
отправляет данные;
-
фиксирует результат;
-
формирует единый HTML-отчёт.
Без ручных сверок, таблиц и дополнительной обработки.
-
-
Каким должен быть отчёт
Отчёт должен быть понятным маркетологу, а не только разработчику. Мы сразу заложили, что в нём должно быть видно:
-
какую форму проверяли;
-
на какой странице;
-
по какому сценарию;
-
успешно ли отправилась заявка;
-
есть ли ошибка и в чём она.
-
Создание автотестов: как мы реализовали решение
Когда техническое задание было сформировано, мы перешли к реализации. Наша цель была не просто «написать автотесты», а построить понятный и устойчивый процесс, который можно использовать регулярно, без участия разработчиков и без ручных проверок.
Мы двигались по шагам — от общей логики к деталям, постоянно проверяя, что решение остаётся удобным именно для маркетинга, а не только технически корректным.
Шаг 1. Проверка должна выглядеть как действия реального пользователя
Первое, с чего мы начали, — отказались от абстрактной проверки «работает / не работает».
Нам было важно, чтобы система повторяла поведение живого посетителя сайта: открывала страницы, закрывала всплывающие окна, заполняла поля и нажимала кнопки так же, как это делает обычный пользователь.
Поэтому в качестве основы мы выбрали Playwright.
Он позволяет эмулировать реальные пользовательские действия и стабильно работает с современными интерфейсами. Это критично, когда формы отличаются по дизайну, расположению и логике работы.
Зачем это было нужно: если форма проходит такую проверку — с высокой вероятностью она работает и для реальных клиентов.
Шаг 2. Разделили логику проверки и сами формы
Следующий шаг — сделать решение масштабируемым. Мы понимали, что формы будут добавляться, удаляться и меняться, поэтому нельзя было «зашивать» логику проверки в каждый тест отдельно.
-
заполнение полей;
-
отправка формы;
-
ожидание результата;
-
проверка успешной отправки.
Так появился универсальный класс GenericForm — шаблон поведения формы. Теперь, чтобы добавить новую форму в проверку, не нужно писать новый тест — достаточно передать параметры конкретной формы.
Почему это важно: маркетологу не нужен «уникальный код под каждую форму». Ему нужен инструмент, который легко поддерживать и расширять.
Напишите, а мы подготовим ТЗ, план работ и диапазон бюджета со сроками
Оставить заявкуШаг 3. Зафиксировали элементы форм, чтобы изменения дизайна не ломали проверки
Формы на сайте со временем меняются: кнопки переезжают, поля переименовываются, добавляются новые элементы. Если не учитывать это, автотесты начинают ломаться от малейших правок.
Чтобы этого избежать, мы вынесли все элементы форм в отдельный слой — класс Locators. Он хранит локаторы кнопок, полей и сообщений.
Что это даёт на практике: если на сайте меняется дизайн, достаточно обновить локатор в одном месте, а не переписывать всю логику тестов.
Шаг 4. Описали сценарии проверки так, как ведут себя реальные пользователи
На этом этапе мы перешли к сценариям тестирования. Мы сознательно отказались от одного «универсального» сценария и реализовали два отдельных варианта.
Он помогает выявить ошибки, связанные с необязательными полями, дополнительной валидацией и сложной логикой.
Именно здесь чаще всего возникают проблемы: неправильно размеченные поля, сломанные проверки, ошибки отправки. На практике оказалось, что большинство критичных багов мы ловим именно в этом сценарии.
Оба сценария были заложены как обязательные — без возможности «пропустить».
Шаг 5. Сделали запуск и отчёты понятными не только разработчикам
Когда логика проверки была готова, мы сосредоточились на том, как пользователь будет работать с результатом.
Для запуска тестов мы использовали файл Pytest — он позволил структурировать проверки и запускать их одной командой из консоли, без лишних настроек. Для отчётности подключили Pytest-html.
В результате каждый запуск формирует наглядный HTML-отчёт, который можно открыть в браузере и сразу увидеть:
-
какая форма проверялась;
-
на какой странице;
-
по какому сценарию;
-
успешно ли отправилась заявка;
-
есть ли ошибка и где именно она возникла.
Важно: этот отчёт понятен маркетологу и руководителю, а не только разработчику.
Также мы подумали о том, как этим инструментом будут пользоваться на практике.
Нам было важно, чтобы автопроверка форм не осталась «решением для разработчиков», которое страшно трогать без технического бэкграунда. Поэтому мы подготовили пошаговую инструкцию по использованию.
Шаг 6. Проверили устойчивость решения в реальных условиях
На финальном этапе мы прогнали проверки в условиях, максимально приближённых к реальным:
-
с всплывающими баннерами;
-
с разными типами страниц;
-
с реальными сценариями заполнения.
Дополнительно мы предусмотрели обработку тестовых заявок в CRM так, чтобы они не мешали отделу продаж и не попадали менеджерам в работу.
Это позволило превратить автотесты не в разовую разработку, а в рабочий инструмент для регулярного использования.
Как выглядит отчёт
Каждый запуск проверки формирует HTML-отчёт, который можно открыть в браузере. В нём собрана вся ключевая информация по проверке — без ручных сверок и повторных прогонов.
В отчёте видно, какую форму проверяли, на какой странице и по какому сценарию. Для каждой формы фиксируется результат отправки, сообщение сайта и наличие ошибки, если она возникла. После этого достаточно зайти в CRM и убедиться, что тестовые лиды дошли.
Как теперь проходит проверка
Процесс, который раньше занимал до 2,5 часов ручной работы, теперь занимает около 30 минут в месяц, включая просмотр отчёта.
Проверка запускается несколькими командами в консоли. Дальше система работает сама: обходит страницы, отправляет тестовые заявки, фиксирует результаты и формирует отчёт. А если на сайте появляется новая форма, она просто добавляется в конфигурацию. Если форму убрали — исключается из проверки. Решение спокойно масштабируется вместе с сайтом.
Следующий шаг — интеграция отчётов с Bitrix24, чтобы в одном месте видеть не только факт отправки формы, но и факт создания лида в CRM. Это позволит полностью отказаться от ручных проверок и сверок.
Заключение
В результате мы получили удобный и надёжный инструмент для регулярной проверки форм на сайте. Он снимает рутинную нагрузку с команды, снижает риск потери заявок и даёт понятный контроль над тем, как сайт принимает лиды.
Этот кейс хорошо отражает наш подход: мы делаем решения, которые можно использовать на практике, а не просто «один раз внедрить и забыть». Если на сайте много форм и важно быть уверенными, что каждая из них работает корректно, такую систему проверки можно внедрить и в вашем проекте.
Почему мы?
Хотите пообщаться о задаче?
Рекомендуем
Наши клиенты
Бренды, проекты которых нам доверяют наши партнеры. Мы работаем с локальными и глобальными компаниями из разных отраслей, что позволяет нашим сотрудникам приобретать уникальный опыт, создавая полнофункциональные решения с учетом особенностей и потребностей бизнеса наших клиентов.
Наши услуги
Мы компания, умеющая не только разрабатывать сайты, но и хорошо выполняем роль субподрядчика на средних и больших проектах. Разрабатываем и внедряем решения на базе 1С-Битрикс / Битрикс24. Всегда боремся за успешное доведение проекта до финала, гибко планируя производственный график.
Сначала мы пробовали автокликер — записывали клики и запускали проверку как сценарий. Но малейшее изменение экрана ломало всю логику: клики смещались, программа зависала, а времени тратилось столько же, если не больше.
Потом попробовали Selenium IDE — хотели написать простой скрипт для проверки. Но он то не запускался, то не сохранял результаты.
В какой-то момент я просто вспомнила, что мы вообще-то работаем в компании разработчиков, и попросила коллег написать нормальный автотест.