前言
随着GraphQL在前端领域的日益普及，我们需要一个强大的测试工具来确保我们的GraphQL服务的正确性和稳定性。Jest作为目前非常流行的前端测试框架，已经与GraphQL完美结合，提供了强大的支持，本文将深入探讨Jest对GraphQL的支持以及如何使用它来测试GraphQL服务。
Jest对GraphQL的支持
Jest提供了名为jest-graphql的插件来增强其对GraphQL的支持。该插件提供了以下优秀的功能：
- 支持对GraphQL查询的快照测试
- 支持对GraphQL查询的变量测试
- 支持对GraphQL查询的错误处理测试
如何使用Jest测试GraphQL服务
1. 安装jest-graphql
作为一个npm包，我们可以直接通过npm安装它：
npm install --save-dev jest-graphql
2. 使用jest-graphql测试GraphQL查询快照
在GraphQL服务中，我们通常会定义许多查询和变异。但是，一旦我们开始修改GraphQL schema，我们不得不确保这些查询和变异的行为仍然是正确的。jest-graphql提供了一个非常强大的工具来实现这一点：snapshot testing。
首先，我们需要安装graphql-tag，它允许我们定义GraphQL查询使用带有语法高亮的字符串：
npm install --save graphql-tag
然后，我们创建我们的第一个测试：
-- -------------------- ---- -------
------ - ----- - ---- ----------
------ --- ---- --------------
------ - ---------------- - ---- ------------------------
------ - ------------------- - ---- ------------
------------- ----- ------- -- -- -
---------- ------ --- ------- ----- -- -- -
----- - ------- ---------- - - ----------------------
----- - ----- - - -------------------------
----- --------------- - ----
----- -
-----
-
--
----- -------- - ----- ------- ------ --------------- ---
-----------------------------------------------
---
---在此文件中，我们使用createTestClient和constructTestServer函数从我们的GraphQL服务器中创建了一个模拟客户端。我们还编写了一个返回“world”的“hello”查询，并使用它调用query函数。
这是snapshot测试的核心部分：
expect(print(response.data)).toMatchSnapshot();
这一行代码将使用“response.data”打印GraphQL查询结果，并将其与以前创建的快照比较。如果结果与以前的不同，将会抛出一个错误，让我们知道数据已经更改。
3. 使用jest-graphql测试GraphQL查询变量
GraphQL查询通常需要变量，它们在GraphQL schema定义中允许我们指定预期类型和默认值。这意味着在我们运行我们的GraphQL服务时，我们必须以某种方式传递这些变量。为此，我们将使用stringify函数将变量转换为字符串，并将其添加为查询选项之一：
-- -------------------- ---- -------
----- ------------------- - ----
----- ---------------- ---- ------- ------- -
------------ ------- ------ ------- -
----- -
--
-
-------- -
---------
-----------
-
-
-
--
------- -------- -------- ------- ----- -- -- -
----- - ------- --------- - - ----- ----------------------
-- ------- --- --------- ------ --- ---- -----
----- ---- - - ------ - --
-- ---- ----- ---- -- ------- -- --- ----- --------
----- --- - ----- -----------------
------ --------------------
-------- - ---------- ---- -
---
--------------------------------------------
-------------------------------------------------------
--------------------------------------------------------
---在这个特定的示例中，我们在查询选项中传递了一个名为“variables”的对象。变量包含查询期望的“first”参数和“after”参数，这些参数在GraphQL schema定义中定义。
4. 使用jest-graphql测试GraphQL查询错误处理
类似于处理其他API的测试，我们需要确保我们的GraphQL服务正常处理错误。我们使用toThrowError函数来测试预期的错误是否发生。toThrowError需要接收一个对象（如果错误是正确的对象例如“UserNotFoundError”），或者您可以简单地传递一个字符串，让它搜索错误信息以验证是否抛出正确的错误。
-- -------------------- ---- -------
------ - ---------------- - ---- ------------------------
------ --- ---- --------------
------ - ------------------- - ---- ------------
--------------- ------- -- -- -
---------- ----- ------- ------ ----- -- -- -
----- - ------- --------- - - ----- ----------------------
----- - ----- - - -------------------------
----- --- - ----- -------
------ ----
-
----- -
----- -
--
-
-
-
-
---
--------- -- -
-- ---------------------------- --- -- -
----- --- ------------ -- -- -------
-
------------------
---
---在这个测试中，我们尝试从未经授权的用户那里查询数据。之后我们断言更改后的查询是否返回错误。
结论
Jest作为前端领域非常受欢迎的测试框架，当与GraphQL结合使用时，它可以为我们提供极致的测试体验。在本文中，我们详细讨论了Jest对GraphQL的支持，展示了测试GraphQL服务的多个工具，并提供了示例代码。这使得我们可以轻松地构建测试用例，确保我们的GraphQL服务的正确性和稳定性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674bc9c1d657e1f70dbe4e70