什么是 Jest？
Jest 是 Facebook 开源的一个 JavaScript 测试框架。它最初被设计用于测试 React 应用，但是它也可以用于测试任何 JavaScript 应用。
Jest 有许多与众不同的特性，如快照测试、自动模拟、实时重新加载等。其中，快照测试是 Jest 特有的一种测试方式，本文将重点介绍 Jest 中关于快照（snapshot）的注意点。
什么是快照测试？
快照测试是一种测试方式，它可以捕获组件或页面的实际输出，并将它们保存为 JSON 文件。当代码发生变化时，Jest 可以自动检测到这些变化，并输出一个可读性较好的 diff。
为了理解快照测试的原理及使用方法，下面提供一个示例：
-- ------- ------ ----- ---- -------- ------ -------- ---- ---------------------- ------ ------ ---- ----------- ------------ ---------- -- -- - ----- --------- - ----------------------- ---- ----- ---- - ------------------- ------------------------------- ---
在这个示例中，我们使用了 Jest 和 React-Test-Renderer，创建了一个简单的按钮组件并执行了一个测试。expect(tree).toMatchSnapshot(); 语句表示我们将组件树保存为快照，并将其与当前组件树进行比较。
第一次运行测试时，Jest 将生成一个新快照文件。如果组件树发生变化，则会输出一个 diff，以便我们确定是否要接受更改并更新快照。
关于快照的注意点
快照不是很智能
Jest 快照测试虽然非常强大，但是它并不是很智能。例如，对于数字的快照测试，它会将其转换为字符串并保存。而对于对象的测试，则会将其转换成 JSON，并使用一个长字符串表示。这样，当我们对数字或对象进行更改并重新运行测试时，Jest 将对它们进行字符串比对，而并不了解变化的实际意义。
因此，在进行快照测试时，我们需要特别注意组件是否产生了意外的变化。如果出现了意外变化，很可能是由于我们所进行的更改实际上与我们想象的不同，而 Jest 则会将其视为一种不同之处。
快照的更新需要谨慎
当我们对组件进行更改并重新运行测试时，Jest 可以识别出哪些更改是我们所期望的，并且自动更新快照文件。这看起来非常方便，但也需要谨慎地使用。
更新快照时，需要确保所做的更改确实是我们所预期的。否则，快照测试会变得毫无意义。而对于已经提交到版本控制系统中的快照文件，我们则需要慎重修改并确保向团队说明。
避免使用较大的快照
在 Jest 中，快照文件实际上通常是以文本字符串的形式存储的。因此，对于较大的快照文件，测试的效率会显著降低。而当我们需要多次快照测试以及频繁更新快照时，这种效率问题则会更加突出。
因此，在进行快照测试时，我们应该尽量避免使用过于庞大的快照文件。如果必须使用，则可以考虑删除不需要的键或值，并尽可能使用一些自定义比较逻辑，以便更加高效地进行比较。
结论
快照测试是 Jest 中非常重要的测试方式之一。在使用 Jest 进行测试时，需要注意一些关于快照的问题，例如不要过于信任快照、谨慎更新快照文件以及避免使用过于复杂的快照等等。掌握这些技巧，能够让我们更加高效地使用 Jest 进行测试，并在实际开发中提高代码质量和可维护性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/66f7d8c8c5c563ced5ae4a7a