相关疑难解决方法(0)

Jest:当同一模块也命名为export时,如何模拟默认导出组件?

我有一个ES6模块,默认情况下导出一个React Component类,但也导出一个普通的JS函数作为命名导出.在测试使用此模块的其他软件包时,我想模拟默认导出组件和命名导出函数,以保持单元测试的纯净.

该模块看起来像这样:

import React, { Component } from 'react';

export default class MyComponent extends Component {
  render() {
    return <div>Hello</div>
  }
}

export function myUtilityFunction() { return 'foo' };
Run Code Online (Sandbox Code Playgroud)

我想使用以下语法来模拟导出:

import React from 'react';
import MyComponent, { myUtilityFunction } from './module';

jest.mock('./module');
MyComponent.mockImplementation(() => 'MockComponent');
myUtilityFunction.mockImplementation(() => 'foo');
Run Code Online (Sandbox Code Playgroud)

但是,当我尝试使用此语法时,在其他组件中使用时,MyComponent似乎不会被模拟.当我尝试像这样模拟MyComponent并自己渲染它时,它会呈现为null.

这种行为很奇怪,因为如果我使用完全相同的语法,但两个导入都是JavaScript函数,则模拟按预期工作.请参阅我在此处打开的StackOverflow问题,该问题确认当导入都是函数时语法有效.

这是一个演示问题的GitHub仓库,以及我尝试过的几个解决方案:https://github.com/zpalexander/jest-enzyme-problem

您可以构建repo并使用yarn install && yarn test运行测试

谢谢!

javascript unit-testing reactjs jestjs es6-modules

16
推荐指数
2
解决办法
3380
查看次数

标签 统计

es6-modules ×1

javascript ×1

jestjs ×1

reactjs ×1

unit-testing ×1