javascript - 测试 React 组件
问题描述
我一直在摸索,试图找到一种方法来测试将哪些道具传递到我编写的 React 组件中。参见示例:
名字.js
export default FirstName = (props) => {
return (
<Select value={props.value} />
);
}
选择.js
export default Select = (props) => {
return (
<div>props.value</div>
);
}
我要编写的测试是针对 FirstName 组件的,我想确保将 value prop 传递到 Select Components value 属性中。
然而,目前我可以验证这一点的唯一方法是在 Select.js 的输出上断言,这不是我正在测试的单元的一部分,所以我真的不想让 FirstName.test.js 文件依赖于发生在 Select.js 内部。
我听说过的一种解决方案是使用jest.mock('path/to/Select.js')
OR
jest.mock('../moduleName', () => {
return {
__esModule: true,
default: jest.fn(),
};
});
但是由于某种原因,我的测试中的 Select 是模拟函数,但 FirstName.js 中的 Select 不是,所以由于某种原因,它为测试而不是运行代码存根。
有任何想法吗?
解决方案
你能用下一个方法试试吗
import FirstName from '../src/FirstName';
describe('<FirstName />', () => {
const mockProps = { name: 'name', };
it('Check Select props', () => {
const wrapper = shallow(<FirstName {...mockProps} />);
expect(wrapper.find('Select').props()).toBe(mockProps);
});
});
推荐阅读
- swift - 使用 Alamofire 5 上传文件到 RocketChat 服务器
- python - 与bash md5sum相比,Python hashlib md5输出不同且速度慢?
- c# - 清理帖子条目!ASP.NET API
- javascript - 如何从 HTML 获取信息到 Javascript 但已连接到 API
- azure-cosmosdb - 如何通过 SDK 或 Select QUERY 在 CosmosBD 中使用分区键
- c# - 有没有办法可以在 Migradoc 中动态创建表
- jboss - jboss Standalone-full.xml ,min-pool-size 和 max-pool-size 问题
- amazon-web-services - 如何通过特定用户的 Bearer 令牌访问与 S3 Bucket 连接的 AWS CloudFront(JWT 自定义身份验证)
- linux-kernel - 即使编译成功也无法安装内核
- python - PyInstaller 生成的 PyQT5 应用程序的可执行文件显示“QCoreApplication::exec: 事件循环已在运行”