reactjs - 使用 Jest 和 React-test-renderer 测试伪类

Question

我在 css 中有一些悬停伪类，并且想要运行测试并检查它们是否正常运行。Jest 可以做到这一点吗？抱歉，我在这里缺乏知识，我只是使用 Jest 的一天。

CSS：

.my-btn--lg.my-btn--brand.hover, .my-btn--md.my-btn--brand:hover {
    background-color: #ac0000;
}

Answer 1

似乎是不可能的。

我不确定 jsdom 是否提供了适当的版本，window.getComputedStyle但无论如何，到目前为止还没有办法检查基于伪类的样式。jest作为通用测试运行器，react-test-renderer并且“只是”将 JSX 编译成 HTMLElements 对伪类/悬停状态一无所知。

另请参阅https://stackoverflow.com/a/11495671/2071697了解如何自己解析 CSS 以找到:hover规则的详细信息（但我认为这不是编写单元测试的有效方法）