使用酶和主题测试样式化组件

Posted

技术标签:

【中文标题】使用酶和主题测试样式化组件【英文标题】:Testing styled-components with enzyme and theme 【发布时间】:2019-02-16 02:16:26 【问题描述】:

我正在尝试找出用开玩笑的快照测试样式组件的最佳方法。

目前,我正在使用 Enzyme 的 mount 并且我的组件按预期工作,但是,因为我传递了整个主题,所以我的快照得到了整个主题的副本(如预期的那样)。但是,如果我更改了组件未使用的主题中的某些内容,则快照测试将失败(如预期的那样)。大家一般是怎么处理的呢?如果主题上的更改不影响组件,我希望能够让我的快照测试通过。

【问题讨论】:

【参考方案1】:

我建议使用https://github.com/styled-components/jest-styled-components。它消除了快照测试中的很多噪音。

【讨论】:

以上是关于使用酶和主题测试样式化组件的主要内容,如果未能解决你的问题,请参考以下文章

无法让 Jest 使用包含主题的样式化组件

样式化组件中的动态主题

无法使用 @emotion/styled 访问样式化组件中的主题

在样式化组件中使用 Material-ui 主题

包括对带有 typescript 的样式化组件主题的媒体查询

在 gatsby 构建期间无法读取样式化组件的主题属性