unit-testing - React Native 中的非组件单元测试

Question

我想为 React Native/TypeScript 应用编写一些单元测试。问题是有些库不能在开发环境下运行，比如“AsyncStorage”或“react-native-sqlite-2”。

我在 Jest 网站上唯一找到的是关于模拟的，但这只是一种解耦 UI 测试的方法。

我正在考虑使用一些 node.js 库来模拟这些库，根据环境加载正确的库。

类似于:

if(isDevelopment) {
    SQLiteDatabase = require("./sqlite_database_node").SQLiteDatabaseNode;
}
else {
    SQLiteDatabase = require("./sqlite_database_rn").SQLiteDatabaseRN;
}

这是解决这个问题的正确方法吗？如果是，我如何导入/要求它才能工作？如果不是，最好的方法是什么？

Answer 1

当您运行 Jest 或任何单元测试时。测试在节点环境中运行。因此，当您尝试访问具有 native 组件/库(例如:Async Storage 或 SQLite)的模块时，代码将在测试环境中中断。

为了解决这个问题，Jest 提出了模块模拟。所以我在我的项目中所做的是，对于我使用的任何在内部使用 native 模块的 node_module .. 我为它创建一个全局模拟。

要做到这一点，您只需像这样在根目录上创建一个文件夹 __mocks__

.
├── README.md
├── __mocks__
│   ├── base-64.js
│   ├── react-native-animatable.js
│   ├── react-native-config.js
│   ├── react-native-device-info.js
│   ├── react-native-fetch-blob.js
│   ├── react-native-firebase.js
│   ├── react-native-google-analytics-bridge.js
│   ├── react-native-map-markerclustering.js
│   ├── react-native-maps.js
│   ├── react-native-simple-download-manager.js
│   ├── react-native-simple-toast.js
│   ├── react-native-splash-screen.js
│   ├── react-native-testfairy.js
│   ├── react-native-version-number.js
│   └── react-native.js
├── __tests__
│   └── index.test.js
├── app
│   ├── App.container.js
│   ├── __tests__
│   ├── assets
│   ├── components
│   ├── config
│   ├── index.js
│   ├── language
│   ├── pages
│   ├── redux
│   ├── routes
│   ├── themes
│   └── utils
├── app.json
├── circle.yml
├── index.js
├── package.json
└── yarn.lock

举个例子让我们看看

__mocks__/react-native-firebase.js

module.exports = {
  crash: () => ({
    setCrashCollectionEnabled: jest.fn()
  }),
  auth: () => ({
    signInAnonymously: jest.fn()
  }),
  database: () => ({
    ref: () => ({
      on: jest.fn()
    })
  }),
  config: () => ({
    fetch: jest.fn(),
    setDefaults: jest.fn(),
    getValue: jest.fn()
  }),
  messaging: jest.fn(() => ({
    requestPermissions: jest.fn(),
    subscribeToTopic: jest.fn(),
    getToken: jest.fn(Promise.resolve),
    onMessage: jest.fn(),
    getInitialNotification: jest.fn(Promise.resolve),
    onTokenRefresh: jest.fn()
  }))
};

或者你可能 __mocks__/react-native-device-info


const mockmod = jest.genMockFromModule('react-native-device-info');
module.exports = mockmod;


重点是..在测试期间，当你执行 require('react-native-device-info')

时，env jest 会自动使用这些文件

因此，在测试环境中，您将运行一个模拟模块，而在应用环境中，您将拥有实际的节点模块。