当前位置: 首页 > 面试题库 >

如何使用玩笑和酶来监视componentWillMount

郜玉石
2023-03-14
问题内容

我正在尝试测试是否调用componentWillMount,为此我的测试是

test('calls `componentWillMount` before rendering', () => {
  let fn = jest.fn(SomeComponent.prototype.componentWillMount)
  mount(<SomeComponent />)
  expect(fn).toHaveBeenCalled()
})

但是,即使调用componentWillMount方法,测试也不会通过。我在这里想念什么?


问题答案:

我不知道其他答案是否对您的问题有所帮助,但是您不需要测试componentWillMount。React应该已经为您完成了该测试。

与您的测试更相关的是测试您要在组件中使用该方法的功能或动作。

如果要进行一些API调用,基于props或其他功能运行函数,则应进行测试。模拟componentWillMount触发的功能/动作/代码,并对此进行断言和期望。

例:

零件:

class YourComponent extends Component {

  componentWillMount() {
    /*this fetch function is actually what you want to test*/
    this.props.fetch('data')
  }

  render() {
    /* whatever your component renders*/ 
  }    
}

测试:

test('should call fetch when mounted', () => {
  let mockFetch = jest.fn()

  const wrapper = mount(<SomeComponent fetch={mockFetch}/>);

  expect(wrapper).toBeDefined();
  expect(mockFetch).toHaveBeenCalled();
  expect(mockFetch.mock.calls[0]).toEqual(['data'])
});


 类似资料:
  • 问题内容: 我有一个React组件(为了演示该问题,对此进行了简化): 现在,我要测试提供的值的调用。 为此,我想创建一个代替组件方法的笑话模拟函数。 到目前为止,这是我的测试用例: 但是我在控制台中得到的只是: 语法错误 所以我的问题是,如何正确地用酶模拟组分方法? 问题答案: 可以通过以下方式模拟该方法: 您还需要在被测组件的包装器上调用.update,以便正确注册模拟功能。 语法错误来自错误

  • 问题内容: 我在带有打字稿的React Router v5.1.2中使用UseHistory挂钩吗?运行单元测试时,我遇到了问题。 TypeError:无法读取未定义的属性“ history”。 我也尝试使用,但仍然无法正常工作。 问题答案: 浅化使用的反应功能组件时,我需要相同的内容。 在我的测试文件中解决了以下模拟问题:

  • 我创建了这个类: 在服务中: 我想知道,在开玩笑的情况下,是否可以这样做:

  • 问题内容: 我的笑话+酶测试遇到问题。我正在测试一个功能,该功能可以切换显示组件。 组件之间的开关:当一个部件被安装时,当-其它组分的步骤中: 当我触发此函数时,一切看起来都很好,该测试运行良好,并且测试成功通过了所需的组件: 我得到这个断言: 显而易见的是: 返回null,但我无法理解为什么。正如我提到的那样,元素通过了测试。 但无法使用捕获。 请帮助我解决此问题并运行测试。 问题答案: 通过h

  • 我有下面的打字稿类,我想测试在笑话。 这是我的测试: 如何模拟MyClass中使用的foo函数,以使测试通过?