firebase - 错误：reactNativeFirebase2.default.auth 不是函数

Question

我有一个 SignUp.js 组件，用于将用户注册到我的应用程序。它受本教程启发/复制，基于react-native-firebase starter kit。

// SignUp.js
import React from 'react';
import { StyleSheet, Text, TextInput, View, Image, TouchableOpacity } from 'react-native';
import firebase from 'react-native-firebase';

export default class SignUp extends React.Component {
  state = {
    fullName: '',
    email: '',
    password: '',
    errorMessage: null
  }

  handleSignUp = () => {

    const { email, password, fullName } = this.state,
    firebase
    .auth()
    .createUserWithEmailAndPassword(this.state.email, this.state.password)
    .then(
      (user) => {
        if (user) {

          user.updateProfile({
            displayName: this.state.fullName,
            photoURL: "../../assets/img/user.png"
          });
        }
    }).then(() => this.props.navigation.navigate('Main'))
    .catch(error => this.setState({ errorMessage: error.message }))
}

...

 <View style={styles.buttons}>
      <TouchableOpacity onPress={this.handleSignUp}>
        <Text style={styles.buttonText}>Sign Up</Text>
      </TouchableOpacity>
 </View>

该方法在用户提交表单时handleSignUp()通过事件调用。我正在尝试测试此方法以在用户提交带有错误电子邮件的表单时出现错误。这是我的测试：onPress

// SignUp.test.js
import { shallow } from 'enzyme';
import React from 'react';
import { TouchableOpacity } from 'react-native';
import SignUp from '../../components/SignUp';
import renderer from 'react-test-renderer';

it('should render error if user submits a bad email', () => {
  const wrapper = shallow(<SignUp />);

  wrapper.instance().handleFullNameText('John Smith');
  wrapper.instance().handleEmailText('john.smith@'); // <- notice bad email
  wrapper.instance().handlePasswordText('123456');

  wrapper.find(TouchableOpacity).first().props().onPress();

})

我的测试失败，我有错误

TypeError：_reactNativeFirebase2.default.auth 不是函数

您能否指导我找到一个解决方案，因为我对本机和单元测试有反应？

标签： firebasereact-nativejestjsenzymereact-native-firebase

Answer 1

在你的SignUp.test.js

将其包含在文件的顶部

import '@firebase/firestore'

所以看起来像这样

import { shallow } from 'enzyme';
import React from 'react';
import { TouchableOpacity } from 'react-native';
import SignUp from '../../components/SignUp';
import renderer from 'react-test-renderer';
import '@firebase/firestore'