react-native - 可以对修改其导航 Prop 的组件方法进行单元测试吗？

Question

我需要弄清楚如何测试不返回值且不更改其组件的任何状态的组件方法，它所做的只是推送另一个屏幕。

我正在使用 jest 和 enzyme 来访问类方法和状态。

这是我要测试的方法(如果可能的话):

  signUp() {
    this.props.navigation.push('Signup');
  }

Answer 1

是的，只需为 navigation 属性传递一个 mock:

import * as React from 'react';
import { shallow } from 'enzyme';

class SimpleComponent extends React.Component {
  signUp() {
    this.props.navigation.push('Signup');
  }
  render() { return null; }
}

test('signUp', () => {
  const navigationMock = { push: jest.fn() };
  const wrapper = shallow(<SimpleComponent navigation={navigationMock}/>);
  wrapper.instance().signUp();
  expect(navigationMock.push).toHaveBeenCalledWith('Signup');  // Success!
});