我正在开发一个React应用程序,我想测试一个模块,我们称之为B,这取决于另一个模块,我们称之为A.
该场景可能是这样的:
export function helperFn() {
return { prop1: 10, prop2: 20 };
}
import React from 'react';
import { helperFn } from '../moduleA';
export class CustomComp extends React.Component {
render() {
const helperObj = helperFn();
return (
<div>{helperObj.prop1}</div>
);
}
}
测试我的组件的核心库是Jest和Enzyme。我的目标是测试模块B,但我想单独对其进行测试,因此我想模拟对moduleA.js的依赖关系。
我知道一种方法是将helperFn注入为道具,而不是导入它,因此在测试期间,我可以注入模拟函数,但是此应用程序上有很多模块,每个模块都有一些依赖性。
经过研究,我发现使用Jest来模拟依赖关系是可行的,但是我尝试了很多事情都没有成功。我尝试了这个问题的方法,也尝试了这篇文章,我没有运气。我还阅读了Jest文档中的Manual Mocks and Mock Functions指南,但我认为它们非常令人困惑。
我可以使它工作中使用的方法(即我可以嘲笑moduleA.js依赖)这个职位,但我有另外一个问题呢。测试moduleB.js效果很好,但是当我继续测试moduleA.js时,我不得不在moduleA.test.js中导入moduleA.js,并且在需要真实模块的同时得到了模拟。
因此,我需要帮助以了解如何在moduleB测试文件中模拟依赖项A。
我希望我很清楚是否不让我知道,我会补充您可能需要的说明。
提前致谢 !
确实,您可以jest
用来模拟依赖关系。您需要设置一些配置才能使其与配合使用import
。例如配置babel-jest
。
如果您已经具有该配置,则可以像这样模拟它。
import React from 'react';
import { shallow } from 'enzyme';
import { helperFn } from '../moduleA';
jest.mock('../moduleA');
describe("CustomComp", () => {
it("should render component", () => {
helperFn.mockReturnValueOnce({
prop1: "dummy"
});
const component = shallow(<CustomComp />);
});
您可以在此处看到一个有效的示例。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句