如何使用插件旋钮对Storybook进行视觉回归测试？

Question

我正在研究一种在React项目中对近1,000个组件进行可视化回归测试的方法。 我正在考虑使用Storybook和BackstopJS来实现它，因为很多组件已经在Storybook上实现了，我认为我可以最快地解决它。

然后，自动提取Storybook场景，生成iframe.html查询的TOC，并将其提供给iframe.html以实现此目的。 这个方法看起来很有效，但是有一个问题。

该项目中的大多数组件都是无状态的，操作和状态更改明确分开。 因此，我使用@storybook/addon-knobs手动检查状态更改。 但是，正如提到的问题 ，似乎旋钮不期望从URL和查询直接操作。

我放弃了iframe.html中的快照，并考虑从index.html操纵旋钮。 但是左窗格上的菜单差异频繁且无法测试的情况。

你有好主意吗？

Answer 1

我自己解决了。

更换了旋钮，最后按下F键，旋钮没有聚焦 。