Vue.js应用测试
上QQ阅读APP看书,第一时间看更新

1.2.3 快照测试

玩过“找不同”吗?“找不同”是一款游戏,规则是在两张存在很小差异的相似图片之间,识别出它们的不同之处。

快照测试类似于“找不同”游戏。快照测试会给运行中的应用程序拍一张图片,并将其与以前保存的图片进行比较。如果图像不同,则测试失败。这种测试方法对确保应用程序代码变更后是否仍然可以正确渲染很有帮助。

传统快照测试是在浏览器中启动应用程序并获取渲染页面的屏幕截图。它们将新拍摄的屏幕截图与已保存的屏幕截图进行比较,如果存在差异则显示错误。这种快照测试在操作系统或浏览器存在版本间差异时,即使快照并没有改变,也会遇到测试失败问题。

在本书中,我将教你如何使用Jest测试框架编写快照测试。取代传统对比屏幕截图的方式,Jest快照测试可以对JavaScript中任何可序列化值进行对比。你可以使用它们来比较Vue组件的DOM输出。关于快照测试的详细内容会在第12章中描述。

定义 可序列化表示任何可以转换为字符串然后返回值的代码。实际上,它指的是V8方法,但没有必要深究这些细节!

现在你已经了解了你要编写的每种测试类型,是时候讨论如何将这些不同的测试类型结合起来编写有效的测试套件了。