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

Question

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

然后，自动提取Storybook场景，生成iframe.html个查询的TOC，并将其提供给BackstopJS来实现。这种方法看起来可行，但是存在问题。

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

我放弃了iframe.html中的快照，并想到了通过index.html操作旋钮。但是，左窗格上的菜单差异经常出现且无法测试的情况。

你有好主意吗？

Answer 1

我自己解决了。

更改了旋钮，最后在旋钮没有聚焦的情况下按下了F键。