Генерация BDD тестов с помощью ChatGPT и запуск их через Playwright

В текущих проектах я применяю подход Behavior Driven Development (BDD) для написания end-to-end тестов. Хотя раньше я скептически относился к Given-When-Then синтаксису, теперь часто его использую. Главная причина - я больше не пишу BDD-сценарии вручную, а генерирую их с помощью ChatGPT.

В статье расскажу, как вы можете генерировать AI-тесты в своем проекте и запускать их в реальном браузере с помощью Playwright.

Для примера я буду использовать демо-приложение TodoList, разработанное командой Playwright. Это веб-страница со списком, в который можно добавлять записи, помечать их выполненными и фильтровать по статусу. Конечная цель — покрыть это приложение end-to-end тестами, при этом написать минимум кода вручную и делегировать максимум работы ChatGPT. В идеале тесты запускаются и проходят вообще без дополнительных правок. Ниже проверим, насколько это возможно.

План

А мой список дел для статьи следующий:

1. Сформулировать требования (user story)

2. Сгенерировать описания шагов

3. Сгенерировать BDD сценарии

4. Запустить тесты

5. Подвести итог

1. Сформулировать требования (user story)

Пользовательская история (user story) — важнейший элемент BDD. Это описание действий пользователя для достижения конкретной цели в приложении. Для тестирования TodoList возьмём следующие требования:

As a user I want to manage items in todo list: 
create items, complete items and filter to see only completed items.

Все тексты, относящиеся к запросам в ChatGPT, будут на английском — прим. переводчика.

Дальше я буду использовать этот текст в запросах к ChatGPT.

2. Сгенерировать описания шагов

Описание шага (step definition) — это конкретная реализация действия пользователя. Например:

Given I open TodoApp page

превращается в команду для браузера:

await page.goto('https://demo.playwright.dev/todomvc/');

Или

When I click the button

становится:

await page.getByTestId('button').click();

Набор описаний шагов можно объединить в Page Object Model — класс, соответствующий определенной странице приложения в тестовых сценариях.

Для списка дел потребуется один класс TodoPage с методами для создания, маркировки и фильтрации записей. Сложность в том, что реализация шагов сильно зависит от структуры HTML, поэтому я не буду делегировать это искусственному интеллекту. Но... ChatGPT отлично справится с генерацией шаблона для такого класса.

На выходе я хочу получить код на TypeScript с использованием пакетов @playwright/test и playwright-bdd — чтобы потом запустить эти тесты на Playwright.

Запрос к ChatGPT для генерации шаблона TodoPage :

Create Page Object Model 'TodoPage' in Typescript
for the following feature:

As a user I want to manage items in todo list: 
create items, complete items and filter to see only completed items.

* Use page from '@playwright/test' as constructor parameter.
* Use Given, When, Then from 'playwright-bdd/decorators' as BDD decorators, for example: @Given('pattern {string}').
* Don't fill methods body.

Отправляю запрос в чат и жду результат. Меня всегда немного гипнотизирует процесс авто-генерации кода