介绍
@smpx/snap-shot-it 是一个前端测试工具，用于比较预期输出和实际输出是否匹配。它可以用来测试函数或组件的输出。场景包括但不局限于：React 组件、Redux 和 MobX 状态管理器、i18n 翻译等等。
安装
使用 npm 安装 @smpx/snap-shot-it：
--- ------- ---------- ------------------
使用方法
基本使用
首先，在测试文件中导入 @smpx/snap-shot-it：
------ - -------- - ---- ---------------------
然后，在你的测试中，通过 snapshot 方法将预期的输出与实际输出进行比较：
--------- ------ ------ --- -- -- - ----- ------ - ------ --- ------------------------------------------- ---
运行测试时，将会生成一个 .snap 文件，它包含了你的测试输出。如果你再次运行测试，并且测试结果与上一次不同，那么 snap 文件就会更新。你可以使用你最喜欢的版本控制工具来跟踪这些变化。
高级使用
如果你想要为每个测试添加其他信息，比如测试名或者忽略一些字段，你可以使用 second argument (snapshotOptions)。
--------- ------ ------ --- -- -- -
----- ------ - ------ ---
----------------------- -
------- ---- ------ ------ ---
----------- ------------- ------------
----------------------
---自定义快照生成器
你可以使用自定义生成器，来扩展 @smpx/snap-shot-it 的行为。比如，如果你想要添加一个自定义的序列化器：
------ - ----------------- - ---- ---------------------
----- ----------- ------- ----------------- -
-------------- ---- -
-- ---- ---------- -------- -
------ ---------------
- ---- -
------ ---------------------
-
-
-
------------------------------------------这里，我们使用 MyGenerator 来序列化 MyClass 类型的对象。
示例
下面，让我们来测试一个简单的函数：
-------- ----------- - ------ ------- ---------- -
我们可以使用 @smpx/snap-shot-it 来测试 greet 函数是否会正确地打招呼：
------ - -------- - ---- -------------------- ----------- ------ ------ ------- ---------- -- -- - -------------------------------------------------- ---
这里，我们将 greet 函数的输出与快照进行比较。如果函数的输出与之前的快照相同，测试将通过。否则，测试将失败，你需要检查你的代码是否正确。
总结
现在，你已经了解了如何使用 @smpx/snap-shot-it 进行测试。它是一个方便易用的测试工具，可以帮助你更好地管理和维护你的项目。希望这篇文章对你有所帮助！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/5eedbfeab5cbfe1ea0611c51