react jest+enzyme测试 复合组件 有connect的如何测试?

这是我的测试文件

/* eslint-disable */
import React from 'react';
import PropTypes from 'prop-types';
import configureStore from 'redux-mock-store';
import DataPane from 'client/components/DataPane';
import requester from 'common/reduxMiddlewares/requester';
import { mountWithIntl, shallowWithIntl } from 'tests/intl-enzyme-test-helper.js';
import OrderDetailsPane from '../shipping/outbound/tabpane/orderDetailsPane';

describe('orderDetailsPane', () => { // eslint-disable-line no-undef
  const initialState = {
    account: {
      loginId: '',
      loginName: '',
    },
    cwmOutbound: {
      outboundProducts: [],
      outboundFormHead: {},
      outboundReload: false,
      submitting: false,
      allocatingModal: {
        visible: false,
      },
      inventoryData: [],
      allocatedData: [],
      inventoryDataLoading: false,
      allocatedDataLoading: false,
    },
    cwmSku: {
      params: {
        units: [],
      },
    },
    cwmContext: {
      defaultWhse: {
        code: '',
        name: '',
      },
    },
    cwmWarehouse: {
      locations: [],
    },
  };
  const mockStore = configureStore([requester]);
  let store;
  let wrapper;
  beforeEach(() => {
    store = mockStore(initialState);
    wrapper = mountWithIntl( // 这个时封装了 mount和react-intl的方法
      <OrderDetailsPane />,
      {
        context: { store },
        childContextTypes: {
          store: PropTypes.any,
        },
      }
    );
  });
  it('render', () => { // eslint-disable-line no-undef
    expect(wrapper.find('DataPane').length).toBe(1);
  });
});

这个组件有多级子孙组件 其中一个组件会在DidMount之后进行请求

componentDidMount() {
    this.props.loadLimitLocations(this.props.defaultWhse.code, '').then((result) => {
      if (!result.error) {
        this.setState({
          options: result.data,
        });
      }
    });
    this.props.loadZones(this.props.defaultWhse.code).then((result) => {
      if (!result.error && result.data.length !== 0) {
        this.setState({
          zones: result.data,
        });
      }
    });
  }

在进行测试时的报错如下

TypeError: this.props.loadLimitLocations(...).then is not a function

这种情况如何处理

阅读 3.1k
1 个回答

给props里传一个loadLimitLocations方法

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题