javascript - 测试套件无法运行 TypeError : Cannot read property 'default' of undefined

Question

我正在尝试在我的 react-native 项目上设置 Jest，但它与 bugsnag-react-native 配合得不好.

在我当前的测试配置中，我看到了与 bugsnag 的 leaveBreadcrumb 函数相关的错误，如下所示:

 FAIL  app/__tests__/NetworkReducer.test.js
  ● Test suite failed to run

    TypeError: Cannot read property 'default' of undefined

      at Object.<anonymous> (app/__tests__/NetworkReducer.test.js:10:20)
          at Generator.next (<anonymous>)
          at Promise (<anonymous>)

我有一个实例化 bugsnag 的帮助文件:

helpers/bugSnag.js


//-------------------------------------------------------------------------------------------------
// Create a single instance of the bugsnag client so we don't have to duplicate our configuration
// anywhere.
//-------------------------------------------------------------------------------------------------
// https://docs.bugsnag.com/platforms/react-native/#basic-configuration

import { Client, Configuration } from 'bugsnag-react-native';
const config = new Configuration();
config.consoleBreadcrumbsEnabled = true;
config.notifyReleaseStages = ['testflight', 'production'];

const bugSnag = new Client(config);


export default bugSnag;

所以在我所有的文件中，我都从这个帮助文件中导入 bugSnag，而不是在每个文件中声明一个新的客户端，特别是在我的 NetworkReducer.js 中，其中 bugSnag.leaveBreadcrumb('someData ') 给我带来了问题。

在我的 NetworkReducer.test.js 中，我调用了一个 mock:

 jest.mock(bugSnag, () => {
    return {
        leaveBreadcrumb: jest.fn()
    };
 });

我也在其中导入 bugSnag from path/to/helpers/bugSnag

如果我注释掉模拟，我会在每个具有 bugSnag.leaveBreadcrumb('someData') 的 reducer 类型上收到不同的错误消息，如下所示:

TypeError: _bugSnag2.default.leaveBreadcrumb is not a function

  at Object.network_prop_update (app/reducers/NetworkReducer.js:29:19)
  at app/reducers/createReducer.js:4:29
  at Object.<anonymous> (app/__tests__/NetworkReducer.test.js:80:29)
  at tryCallTwo (node_modules/promise/lib/core.js:45:5)
  at doResolve (node_modules/promise/lib/core.js:200:13)
  at new Promise (node_modules/promise/lib/core.js:66:3)

我以为我对这件 Jest 和 mock 了如指掌，但事实证明我错了。我附上了我的 Jest 的 setup.js 以供额外引用:

    jest.mock('Linking', () => {
    return {
        addEventListener: jest.fn(),
        removeEventListener: jest.fn(),
        openURL: jest.fn(),
        canOpenURL: jest.fn(),
        getInitialURL: jest.fn(),
    };
});


jest.mock('PushNotificationIOS', () => {
    return {
        addEventListener: jest.fn(),
        requestPermissions: jest.fn(() => Promise.resolve()),
        getInitialNotification: jest.fn(() => Promise.resolve()),
    };
});


jest.mock('react-native-intercom', () => {
    return {
        registerIdentifiedUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
        registerUnidentifiedUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
        updateUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
        reset: jest.genMockFn().mockReturnValue(Promise.resolve()),
        logEvent: jest.genMockFn().mockReturnValue(Promise.resolve()),
        handlePushMessage: jest.genMockFn().mockReturnValue(Promise.resolve()),
        displayMessenger: jest.genMockFn().mockReturnValue(Promise.resolve()),
        hideMessenger: jest.genMockFn().mockReturnValue(Promise.resolve()),
        displayMessageComposer: jest.genMockFn().mockReturnValue(Promise.resolve()),
        displayMessageComposerWithInitialMessage: jest.genMockFn().mockReturnValue(Promise.resolve()),
        displayConversationsList: jest.genMockFn().mockReturnValue(Promise.resolve()),
        getUnreadConversationCount: jest.genMockFn().mockReturnValue(Promise.resolve()),
        setLauncherVisibility: jest.genMockFn().mockReturnValue(Promise.resolve()),
        setInAppMessageVisibility: jest.genMockFn().mockReturnValue(Promise.resolve()),
        setupAPN: jest.genMockFn().mockReturnValue(Promise.resolve()),
        registerForPush: jest.genMockFn().mockReturnValue(Promise.resolve()),
        setUserHash: jest.genMockFn().mockReturnValue(Promise.resolve()),
        setBottomPadding: jest.genMockFn().mockReturnValue(Promise.resolve()),
        addEventListener: jest.fn(),
        removeEventListener: jest.fn()
    };
});


jest.mock('bugsnag-react-native', () => {
    return {
        leaveBreadcrumb: jest.fn(),
        Configuration: jest.fn(),
        Client: jest.fn()
    };
});

Answer 1

这已经得到解答，但就我而言，我遇到了不同的问题。 显然 react-test-renderer 无法实例化缺少构造函数的组件。

所以我需要将它们添加到我的 PureComponent 中:

constructor(props) {
    super(props)
}