GraphQL 作为一种新兴的 Web API 技术，其方便性、强大性得到了越来越多的前端开发者的认可。然而在前端应用开发中，需要保证与后端交互的接口可靠性，这显然需要非常高质量的测试来支持。本文将介绍在使用 Jest 测试 GraphQL Server 的过程中需要注意的地方，并给出一些示例代码来帮助读者更好地进行实践。
前置知识
在阅读本文前，读者需要对以下技术有一些基础的了解：
- GraphQL 的基本概念与使用方式
- GraphQL 的测试基础知识
- Jest 的使用方式
如果读者对上述技术中的任一部分还不熟悉，建议先学习相关的官方文档或教程，并完成相关的练习。
使用 Jest 进行 GraphQL Server 测试的基本思路
在使用 Jest 进行 GraphQL Server 测试时，我们需要关注以下几个方面：
- 创建 GraphQL Server 实例
- 编写测试用例
- 运行测试用例
本文将分别介绍这三个方面涉及的具体步骤。
创建 GraphQL Server 实例
在进行 GraphQL Server 测试前，我们需要先创建一个 GraphQL Server 实例。目前市面上有很多种实现 GraphQL Server 的方式，例如使用 Node.js + Express.js，使用 Apollo Server 等等。在这里，我们以使用 Node.js + Express.js 为例，给出创建 GraphQL Server 实例的示例代码：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- - ----------- - - --------------------------- ----- - ----------- - - ------------------- -- -- ------- ------ ----- ------ - ------------- ---- ----- - ------ ------ - --- -- -- ----- -- ----- ---- - - ------ -- -- ------- -- -- -- ------- ------ -- ----- --- - ---------- -------- ----------- ------------- ------- ------- ---------- ----- --------- ---- -- -- ---------------- -- -- -------------------- ------ ------- -- ---------------------------------展开代码
编写测试用例
接下来，我们需要根据实际需求编写测试用例。在 GraphQL Server 测试中，我们主要需要关注以下几个方面：
- Query 测试：测试查询接口（Query）
- Mutation 测试：测试变更接口（Mutation）
- Subscription 测试：测试订阅接口（Subscription）
具体来说，我们需要确保以下方面的测试用例都被充分覆盖：
- 查询 Query 接口返回数据的正确性
- 查询 Query 接口返回数据的顺序是否正确
- 变更 Mutation 接口返回数据的正确性
- 订阅 Subscription 接口返回数据的正确性
我们在这里以一个简单的示例来说明测试用例的编写方式。该示例中的 GraphQL Schema 定义了两个 Query 接口：getBooks 和 getBookById。其中，getBooks 查询接口返回所有书籍信息，而 getBookById 查询接口根据给定的书籍 ID 返回对应书籍的详细信息。对于这个示例，我们需要编写以下几种测试用例：
- 测试 getBooks 接口返回数据的正确性
- 测试 getBooks 接口返回数据的顺序是否正确
- 测试 getBookById 接口返回数据的正确性
我们以第一种测试用例为例，给出其具体代码实现：
-- -------------------- ---- ------- ----- ------- - --------------------- ----- --- - ------------------ -- ---- ------- ------ ------- ----------------- ----- ------ -- -- - ---------- ------ --- ------- ----- -- -- - ----- ----- - - ----- - -------- - ----- ------ - - -- ----- -------- - ----- ------------------------------------ ----- --- ----- - ---- - - --------- -------------------------------- ----------------------------------------- ----------------------------------------------------- --------------------------------------------- --------------------------------------- ------ ---- ----- -------- ------- --- ----- ----------- --- --- ---展开代码
在上述测试用例中，我们使用了第三方库 supertest，它可以帮助我们模拟发送 HTTP 请求，并获取响应结果。在测试用例中，我们首先定义了一个查询字符串，用于调用 getBooks 接口。我们然后通过发送 POST 请求到 /graphql 接口，来调用 GraphQL Server 并获得返回结果。最后，我们使用 Jest 的断言方法 expect 对返回的结果进行校验。
运行测试用例
在编写了测试用例后，我们需要启动 Jest 并运行测试用例。我们可以在项目的根目录下，编写 jest.config.js 配置文件，定义 Jest 的配置，例如：
module.exports = { testEnvironment: 'node', testMatch: [ '**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[jt]s?(x)' ] };
接着，我们可以在终端窗口中输入以下命令来启动 Jest 并运行测试用例：
yarn jest如果一切正常，我们应该可以看到类似于以下的输出内容：
-- -------------------- ---- ------- ---- ----------------------- ------- ----- ---- - ------ ------ --- ----- --- --- ---- ------- - ------- - ----- ------ - ------- - ----- ---------- - ----- ----- ----- -- --------- - - --- --- ---- ------ -------- -----------------------------------展开代码
结语
本文中，我们介绍了使用 Jest 来测试 GraphQL Server 的入门实践，包括创建 GraphQL Server 实例、编写测试用例、以及运行测试用例。希望读者可以根据本文中的示例代码和思路，更好地进行 GraphQL Server 测试的实践。最后，建议读者在实践过程中，选择适合自己项目需求的 GraphQL 实现，例如 Apollo Server 等。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67b9ba41306f20b3a682d87b
