小编Mik*_*ins的帖子

使用Jest使用props模拟React组件

我有一个React组件,其中包含一些依赖于访问Redux存储等的其他组件,这会在执行完整的Enzyme安装时导致问题.让我们说这样的结构:

import ComponentToMock from './ComponentToMock';

<ComponentToTest>
  ...some stuff
  <ComponentToMock testProp="This throws a warning" />
</ComponentToTest>
Run Code Online (Sandbox Code Playgroud)

我想使用Jest的.mock()方法来模拟子组件,因此它不是测试的关注点.

我知道我可以用以下方法嘲笑一个直的组件:

jest.mock('./ComponentToMock', () => 'ComponentToMock');

但是,由于此组件通常会收到道具,因此React会感到不安,并会发出有关未知道具(在这种情况下testProp)被传递给的警告<ComponentToMock />.

我试图返回一个函数,但是由于它被挂起,你无法在Jest模拟中返回JSX(我可以告诉).在这种情况下它会引发错误.

所以我的问题是我怎么能

a)ComponentToMock忽略传递给它的道具,或者

b)返回一个React组件,该组件可用于模拟我不担心测试的子组件.

或者,还有更好的方法?

unit-testing mocking reactjs jestjs enzyme

19
推荐指数
2
解决办法
3万
查看次数

标签 统计

enzyme ×1

jestjs ×1

mocking ×1

reactjs ×1

unit-testing ×1