Question

我正在使用

"react": "^16.4.0",
"jest": "^22.4.4",

然后在我正在使用的组件中使用本机下拉警报

 import DropdownAlert from 'react-native-dropdownalert';

在渲染功能中，我将其放置在最底端

  <DropdownAlert
      ref={this.dropdownRef}
    />

然后在我的构造函数中添加以下引用

this.dropdownRef = React.createRef();

然后我在渲染之前触发此行的下拉菜单。这是导致我的单元测试出现问题的行。

this.dropdownRef.current.alertWithType('error', 'Error', this.props.firebaseInfo.errorMessage);

然后这是我的单元测试

import 'react-native';
import React from 'react';
import renderer from 'react-test-renderer';
import { SignUp } from '../SignUp';
import Enzyme, { mount, shallow } from 'enzyme'


function createNodeMock() {

  return {
    DropdownAlert: {
      alertWithType() {

      }
    },
    current: {
      DropdownAlert: {
        alertWithType() {}
      }
    },
    alertWithType() {}
  }
}


describe('Sign up page component', () => {
  it('sign up renders correctly', () => {

    const props = {
      actions: {},
      userInfo: {},
      firebaseInfo: {},
    };

    const tree = renderer.create(<SignUp {...props}/>, {createNodeMock}).toJSON();

    expect(tree).toMatchSnapshot();
  });
});

即使我认为函数createNodeMock（）可以像在此答案中一样解决该问题，它仍会失败，并不会引发以下错误Refs are null in Jest snapshot tests with react-test-renderer关于我在做什么的任何指针都很好

TypeError: Cannot read property 'alertWithType' of null

在单元测试中的React Native renderer.create（）调用中ref为空，这使我的测试失败

0 个答案: