大家好。最近，我们在项目中引入了使用 Playwright 的屏幕截图测试。这些测试效果很好 - 每次发布时它们都会发现 UI 错误。我们开始增加它们的数量，但很快就遇到了问题。
我们的工作流程如下：我们在 Playwright 配置中创建了一个单独的项目 - 纯粹的 UI 测试，与功能测试分开运行。运行后 - 我们在标准 Playwright html-reporter 中查看结果。总的来说，它非常方便。它突出显示了差异，您可以同时查看原始屏幕截图和新屏幕截图 - 一切都很酷。
但相对常见的情况是，测试失败是出于正当理由。不是因为某些错误，而只是因为某些 UI 被更改，可以说，这是预期的失败。但在查看失败的测试时，重要的是不要错过那些真正因错误而失败的测试。
问题是，现在，在运行测试之后，需要更新 20 个“有效”失败的测试并接受新的原始测试，但对于 5 个测试，这是没有必要的，因为它们由于错误而失败，没有工具可以这样做。您必须使用 再次运行测试--update-snapshots，在这种情况下不会生成差异。然后，您需要坐在 IDE 中观察并检查哪些图片可以提交，哪些不需要。此外，稳定性并不总是 100%，有时会有不稳定性测试，也需要查看它们，以免它们被意外提交，等等。简而言之，处理这个问题的开销很大。
为每个失败的测试单独设置“接受新的”按钮 - 将完全解决这个问题。因此，我真的想要一个像“接受新的黄金快照”这样的按钮，这样对于每个失败的测试，都可以接受一个新的屏幕截图作为新的原始截图，之后，它会在磁盘上的屏幕截图目录中被替换，它会出现在 git 的 diff 中，你只需要提交它。
此外，最好按下此按钮将测试变为“绿色”，也就是说，它将使测试从失败变为通过。
我不知道有多少人使用 Playwright 进行截图测试，但我认为每个使用的人都有同样的问题。Playwright 基本上提供了截图测试所需的一切，唯一缺少的是一种方便的截图管理方式。
