reactjs - 在脚本加载时使用的模拟实用程序函数

Question

为简单起见，我在stackblitz创建了一个示例应用程序。

Hello组件使用了一个实用函数，我需要对其进行模拟以对其进行测试。

const hmmm = mockMe();

const Hello = () => (
  <div>
    <h1>Hello StackBlitz!</h1>
    <p>{hmmm}</p>
  </div>
);

我尝试了几种方法来模拟该函数，例如：

import * as utils from '../utils';

describe('Hello component', () => {
    it('should mock the utility function', () => {
        jest.spyOn(utils , 'mockMe').mockReturnValue("Mocked!");
        // render the component and test it
    }
}

我的问题是Hello.js在测试文件之前运行。因此，它在应用模拟之前执行实用程序功能。

我能想到的唯一解决方案是更改组件代码并将调用移动到渲染函数内的实用程序。我想避免这种变化。

有没有办法模拟效用函数并保持代码不变？

标签： reactjsunit-testingjestjsmocking

Answer 1

在使用方法之前，utils您需要模拟utils文件夹。例如，jest.mock('../utils');