在前端开发的过程中，测试是非常重要的环节。而 Jest 是一个流行的测试库，已经被广泛应用于前端项目中。在 Jest 中，快照测试（Snapshot Testing）是一种常用的测试方式。它可以通过比较测试前后组件或数据的快照来判断是否出现了错误或变化。但是在某些情况下，Jest 的默认快照序列化器并不能满足我们的需要。这时候，我们可以使用 npm 包 jest-snapshot-serializer-raw，手动序列化快照并进行定制化设置。
安装
首先，为了使用 jest-snapshot-serializer-raw，我们需要把它安装在项目中。可以通过 npm 包管理器来完成安装。在命令行中输入以下命令：
npm install jest-snapshot-serializer-raw --save-dev
这会将 jest-snapshot-serializer-raw 安装到你的项目中，并把它作为开发依赖保存在 package.json 文件中。
使用
安装完 jest-snapshot-serializer-raw 后，在 Jest 的配置文件中添加一行代码即可使用它。在 package.json 中找到 Jest 的配置项，通常位于 "jest" 属性中，添加如下代码：
"snapshotSerializers": ["jest-snapshot-serializer-raw"]
然后，我们就可以在测试代码中使用 raw 序列化器来手动序列化你想要测试的对象，并将其和快照进行比较了。具体的使用方法可以参考以下示例代码：
-- -------------------- ---- -------
------ ---------- ---- ------------------------------
---------------- -- -- -
----- --- - -
- --- ------ ----- ----- --
- --- ------ ----- ------- -
-
-- ------------
-----------------------------------------
--
---------- ---- ---- -- -- -
----- --- - -
----- -------
---- --
-
-- ------------
-----------------------------------------
--在这个例子中，我们通过手动序列化一个数组和一个 JSON 对象，并将它们和测试前保存的快照进行比较。对于数组和 JSON 对象，我们使用 JSON.stringify 进行原始的序列化。错过了某些信息，需要如此所以需要您手动检查是否与预期快照相同。
通过这个例子，我们可以清楚地了解到，使用 jest-snapshot-serializer-raw 可以实现更加灵活的快照测试。在真实的开发中，我们可能需要自定义序列化的方法，以满足具体的测试需求。这时候，手动序列化快照就成为了必要的操作。
结语
本文向大家介绍了 npm 包 jest-snapshot-serializer-raw 的使用方法，希望对大家进行前端测试有所帮助。当然，jest-snapshot-serializer-raw 的功能还远远不止于此，还有更多的特性需要在实践中探索。快照测试作为一种简洁有效的前端测试方式，在实际开发中能够极大地增强代码的可靠性和健壮性，也值得我们更深入地研究和使用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedac69b5cbfe1ea0610a1b