在 React 功能组件中，使用 jest 和酶测试内部功能答案

【问题标题】：In React functional Component , test internal functional using jest and enzyme在 React 功能组件中，使用 jest 和酶测试内部功能
【发布时间】：2020-09-21 00:27:18
【问题描述】：

我在 React 中使用功能组件，我需要为功能组件中的方法编写单元测试用例。

import React from 'react';
function print(){
  console.log('hello');
}
    
function Welcome(props){
  return <h1>{props.name}</h1>;
}
    
export default Welcome;

开玩笑和酶：

test (method print , ()=> {
  const container =  shallow(<Welcome />).instance().print()
}

instance : TypeError Cannot read property of null

我读过功能组件在 React 16+ 中没有实例。有人可以帮助建议一种为功能组件中的方法编写单元测试用例的方法吗？

【问题讨论】：

标签： reactjs unit-testing jestjs enzyme react-functional-component

【解决方案1】：

我只想提醒您，您不能/不能“自己”测试功能组件的功能，您只能测试它们的实现。

因此，正如@EstusFlask 指出的那样，您不能创建 FC 的实例然后在测试用例中调用它的函数；但是你可以在你的 FC 中使用这个函数（你应该这样做，这就是创建一个函数的重点），然后在你的测试用例中 - 测试这个函数执行的输出/结果。

【讨论】：

【解决方案2】：

print 函数在模块范围内定义。与任何其他作用域值一样，它不能在作用域之外访问。

为了便于访问，它应该被导出：

export function print(){  console.log('hello');  }

在它使用的同一个模块中声明时不能被模拟。 print 不是方法，功能组件没有可以具有方法的实例。它不能以instance().print 访问，除非它以useImperativeHandle 公开。

【讨论】：