Если вы интегрировали Cypress с проектом, использующим GraphQL, вы, вероятно, заметили, что отсутствует поддержка первой стороны и сообщества. В этой статье будут подробно описаны решения этих проблем.

Сетевые заглушки и псевдонимы

В отличие от REST API, все запросы GraphQL отправляются в одну конечную точку. Это вызывает проблемы из-за того, что Cypress использует сопоставление шаблонов с URL-адресом, чтобы определить, какие исходящие запросы заглушить.

К счастью, мы можем использовать встроенную в Cypress функцию перехвата, чтобы легко перехватывать сетевые запросы на основе любых определенных нами критериев (например, имени операции). Ниже приведены пользовательские утилиты для правильного сопоставления, заглушек и псевдонимов операций GraphQL API:

Используя эти служебные функции, теперь вы можете использовать псевдонимы и операции-заглушки, которые не являются анонимными. Функция aliasOperation автоматически создаст псевдоним для каждой операции на основе имени операции. Например, мутация с именем deleteReminder будет иметь псевдоним deleteReminder. Параметр ответа является необязательным. Если он не указан, то aliasOperation будет только псевдонимом сетевого вызова, что может быть полезно для тестов e2e.

Хотя эти служебные функции работают хорошо, я хотел сделать заглушки запросов GraphQL немного более эргономичными. Имея это в виду, я создал пользовательскую команду Cypress, чтобы позволить мне устанавливать и автоматически использовать значения по умолчанию (например, шаблон URL). При этом значения по умолчанию могут быть исключены, если не требуются переопределения.

С помощью этой пользовательской команды мы теперь можем автоматически использовать установленные значения по умолчанию, если только нам не нужно делать что-то вроде псевдонимов и заглушек отдельной операции GraphQL API.

Утверждения

Следующая важная часть необходимой функциональности — это возможность утверждать данные исходящих сетевых запросов, например, при отправке формы. Чтобы включить эту функцию, я использую следующую пользовательскую команду:

Пользовательская команда использует небольшой пакет под названием graphql-query-to-json для преобразования строк запроса в json. Используя этот пакет, он сравнивает исходящие сетевые запросы строки запроса json с переданной в качестве параметра.

Теперь, если операции не соответствуют ожидаемому значению, Cypress выдаст ошибку, содержащую информацию об ожидаемых и фактических значениях, что упростит отладку.

Вот и все!

Используя эти пользовательские команды, вы теперь сможете заглушать, псевдоним и утверждать операции GraphQL.