Jest 是一个流行的 JavaScript 测试框架，可以用于测试 Web 应用程序中的各种技术栈。它同样也适用于 GraphQL 接口测试，可以帮助前端开发者更快速、高效且准确地测试自己的 GraphQL 接口。
在本文中，我们将深入探讨如何使用 Jest 对 GraphQL 接口进行测试，并提供具有指导意义的示例代码和学习内容。
测试环境的准备
在开始使用 Jest 对 GraphQL 接口进行测试之前，我们需要为测试环境准备好一些必要的设置。
首先，我们需要安装必要的依赖包。我们需要安装 graphql 以及用于执行 GraphQL 查询的 graphql-tag 和 apollo-boost。
npm install --save-dev graphql graphql-tag apollo-boost
然后，我们需要创建一个用于测试的 GraphQL 服务器，用于处理我们的 GraphQL 查询。在本文中，我们将使用 GraphQL Playground，它可以帮助我们更轻松地验证 GraphQL 查询。
最后，我们需要在我们的项目中添加一个用于测试的 .graphql 文件夹，它用于存放我们的 GraphQL 查询语句。
现在，我们已经准备好了测试环境，我们可以开始使用 Jest 对 GraphQL 接口进行测试了。
查询语句的编写
测试我们的 GraphQL 接口，首先需要编写一个查询语句，以便我们可以测试我们的 API。如果你不知道从哪儿开始写 GraphQL 查询，请查看 GraphQL 的官方文档。
在我们的测试用例中，我们将使用 graphql-tag 包来编写查询语句：
-- -------------------- ---- -------
------ --- ---- --------------
----- --------- - ----
----- -------- -
----- -
--
----
-----
-
-
--在这个示例中，我们编写了一个查询名为 getUsers，查询了 users 域，并返回了 id、name 和 email。
我们在这里将查询分配给变量 GET_USERS，以便在我们的 Jest 测试用例中使用。
Jest 测试用例
现在我们已经编写了我们的查询语句，我们可以开始编写我们的 Jest 测试用例了。
首先，我们需要导入我们的 GraphQL 服务器：
-- -------------------- ---- ------- ------ - ------------ - ---- ---------------- ------ - --------- --------- - ---- ----------- ------ - ---------------- - ---- ------------------------ ----- ------ - --- -------------- --------- ---------- --- ----- - ----- - - -------------------------
在这个示例中，我们使用 ApolloServer 创建一个新的 GraphQL 服务器，并传递了 typeDefs 和 resolvers。接着，我们使用 createTestClient 从服务器实例中创建一个测试客户端的实例，这个实例中包含了可以用于执行 GraphQL 查询的 query 方法。
然后，我们需要编写一个测试用例来运行我们的查询，这个测试用例会测试查询是否返回了我们期望的结果：
-- -------------------- ---- -------
--------- ----- ----- ------- ------ ----- -- -- -
----- - ----- ------ - - ----- ------- ------ --------- ---
-------------------------------
----------------------
------ -
-
--- ----
----- --------
------ --------------------
--
-
--- ----
----- ------
------ ------------------
--
--
---
---在这个测试中，我们首先使用 query 方法运行我们的查询，并从结果中检查是否存在错误。然后，我们检查我们的查询结果，看是否与我们期望的结果一致。
总结
在本文中，我们深入探讨了 Jest 如何测试 GraphQL 接口。我们学习了如何编写查询语句以及如何使用 Jest 进行测试。
我们强烈建议前端开发者总是进行单元测试和集成测试，以确保我们的代码在不同的条件下都能正常工作。
示例代码可以在 https://github.com/Hanqing1996/GraphQLTestWithJest 中获取，欢迎使用和交流讨论！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6461763d968c7c53b02d8e6d