更新

Question

我对于单元测试非常陌生，所以像模拟模块这样的东西令人困惑。

在本机中，有一个使用firebase数据库的组件，它返回给定ref的数据：

＆＃13;

// when the data of the current user is available
userRef.child(user.uid).on('value', snap => {
  // check of val() consists data
  if (snap.val()) {
    let
      authUser = snap.val(),
      isPatient = authUser.type === "Patient",
      // We update the state object so that the component is re-rendered
      this.setState({
        // the ID of the current user
        authUserUID: user.uid,
        // the type of the current user (i.e. Doctor or Patient)
        authUserType: snap.val().type,
        // title of the dashboard based on the current user type
        activeTitle: snap.val().type === "Doctor" ? "My Patients" : "My Doctors",
      });
  }
});

＆＃13;

我现在正在尝试使用此组件进行单元测试：

＆＃13;

import 'react-native'
import React from 'react'
import renderer from 'react-test-renderer'
import LaunchScreen from "../../App/Containers/LaunchScreen";

test('LaunchScreen', () => {
  const tree = renderer.create( <LaunchScreen / > ).toJSON()
  expect(tree).toMatchSnapshot()
})

＆＃13;

但它给出了一个奇怪的错误

在iOS上未找到RNFirebase核心模块，确保您已在项目Podfile中正确包含RNFirebase pod并已运行pod install

我不知道，因为如果运行它，firebase会返回数据。那么为什么说无法找到RNFirebase？

由于

更新

其中一个答案给出了一个很好的一步一步的指示，虽然它部分地解决了提出的问题;错误仍然存在。例如;我现在收到这个新错误：

console.error node_modules \ react-test-renderer \ cjs \ react-test-renderer.development.js：5530       组件中出现上述错误：           在LaunchScreen中

考虑向树中添加错误边界以自定义错误处理行为。

TypeError：_reactNativeFirebase2.default.app不是函数

Answer 1

https://gist.github.com/himanshusinghs/bd86262ce3c9e6f4d691b5242de707ef

以上是包含React Native Firebase模拟的要点的链接。实施说明也在那里。我也在这里总结一下 -

1。您将嘲笑node_module并且根据您的使用情况有多种方法。但是，由于您需要为几乎所有使用它的组件模拟Firebase，我们将实现React Native Firebase模块的全局模拟。

2. ：在项目的__mocks__文件夹旁边的根目录中创建一个node_modules文件夹。

3. 现在在react-native-firebase.js目录中创建一个名为__mocks__的文件。

4. 。将上述要点中的RNFirebaseMock.js内容复制粘贴到您的react-native-firebase.js文件中。

这是如何运作的？

Jest有一个自动模拟功能。现在，每次使用Jest运行测试用例时，只要您的任何测试用例需要react-native-firebase模块，Jest将首先查看__mocks__文件夹，看看是否有react-native-firebase.js包含所需模块的一些模拟实现。

如果有，那么jest将需要模拟实现而不是原始模块，否则它将继续需要原始的react-native-firebase模块。

需要注意的事项

您需要注意我们在react-native-firebase.js文件夹中创建的模拟文件的名称__mocks__类似于实际react-native-firebase模块的安装文件夹的名称。只需转到node_modules并向下滚动，直至找到react-native-firebase文件夹。

是的，模块的模拟实现的名称必须与模块本身的名称完全相同。

要做的事情要点

恭喜您开始进行单元测试并为此选择了一个非常棒的框架。相信我，测试react-native或react是PITA (Pain in the Ass)，您应该考虑认真阅读Jest文档并主要关注模拟部分。

稍后您可能会在设置Jest for react-native或做出反应时遇到问题，并且文档将派上用场。

以下是帮助我开始使用Jest和单元测试react和react-native -

的一系列教程和参考资料。

Jest Documentation
Testing React and React Native using Jest/Enzyme setup
Reference article for Mocks, Stubs and Fakes
Testing Redux - P1
Testing Redux - P2
Testing Redux - P3

应用RNFirebaseMock后出现错误的解决方法

您现在获得的错误是因为在您的模拟的app导出下不存在名为default的函数。所以，让我们创造它。

转到模拟目录并打开react-native-firebase-mock.js。寻找export default class RNFirebase，在该类中有几个静态方法没有实现。使用名称app。创建一个在类中不执行任何操作的函数。

您的默认导出类现在看起来应该是这样的 -

export default class RNFirebase {
  static initializeApp() {
    RNFirebase.firebase = new MockFirebase()
    RNFirebase.promises = []
    return RNFirebase.firebase
  }

  static reset() {
    RNFirebase.promises = []
    RNFirebase.firebase.databaseInstance = null
  }

  static waitForPromises() {
    return Promise.all(RNFirebase.promises)
  }

  static analytics () {}

  static app () {}
}

这应该可以解决问题，但我相信你正在广泛使用Firebase。在我的例子中，模拟实现就像我给你的那样简单，为我做了诀窍。

如果您正在广泛使用Firebase的大多数API，那么您必然会遇到更多错误，因为我们尚未在Firebase模拟中为RNFirebase的所有API添加模拟实现。

如果出现这种情况，我建议您查看Firebase的this模拟实现，我想完全覆盖Firebase 。

Answer 2

Jest在节点中运行，无法访问本机api，因此您需要模拟react-native-firebase / RNFirebase模块才能使其正常工作。

请参阅https://github.com/invertase/react-native-firebase/issues/162

如何使用firebase进行单元测试？

更新

2 个答案: