Тест с Jest, Firebase & React-Native - PullRequest
Новая
       66

Тест с Jest, Firebase & React-Native

1 голос
/ 05 апреля 2020

Я пытаюсь успешно запустить App-test котельной. js тест, который идет с реактивной установкой. Я видел, как этот тест работал "из коробки" с другими проектами, однако мой не дает результатов из-за нашей интеграции с Firebase SDK. Долгосрочная цель состоит в том, чтобы создать набор тестов, который макетирует вызовы нашего пакета Firebase SDK (хотите исследовать следующие решения: https://medium.com/stories-from-upstatement/jest-mocks-roasting-on-an-open-firestore-36fa55b76953, Как вы насмехаетесь над методами Firebase Firestore, используя Jest ? ), но я застрял у открывающихся ворот.

Вот начальная ошибка, которую я получал при попытке выполнить следующую команду:

npm test __tests__/App-test.js

Ошибка: 

import { getFirebaseRoot } from './internal/registry/namespace';
export default () => ({
    ^^^^^^

    SyntaxError: Cannot use import statement outside a module

      1 | import React from 'react';
    > 2 | import firebase from '@react-native-firebase/app';
        | ^
      3 | import analytics from '@react-native-firebase/analytics';
      4 | import '@react-native-firebase/auth';
      5 | import '@react-native-firebase/database';

Похоже, что наше приложение. js файл является виновником. 

import React from 'react';
import firebase from '@react-native-firebase/app';
import analytics from '@react-native-firebase/analytics';
import '@react-native-firebase/auth';
import '@react-native-firebase/database';
import '@react-native-firebase/crashlytics';
import '@react-native-firebase/functions';
import '@react-native-firebase/storage';

import { Provider } from 'react-redux';
import store from './app/store';
import Navigator from './app/routes';
import { loginUser } from './app/domain/Common/auth/actions';

export default class App extends React.Component {
  constructor(props) {
    super(props);
    this.props = props;
  }

  // gets the current screen from navigation state
  getActiveRouteName = (navigationState) => {
    let routeName = null;

    if (!navigationState) {
      return null;
    }
    const route = navigationState.routes[navigationState.index];
    // dive into nested navigators
    if (route.routes) {
      return getActiveRouteName(route);
    }

    routeName = route.routeName;

    // for venues, append specific venue name
    if (route.params && route.params.venueName) {
      routeName += ` - ${route.params.venueName}`;
    }

    return routeName;
  }

  render() {
    return (
      <Provider store={store}>
        <Navigator
          onNavigationStateChange={(prevState, currentState) => {
            // track user screen changes in  Analytics
            const currentScreen = this.getActiveRouteName(currentState);
            const prevScreen = this.getActiveRouteName(prevState);

            if (prevScreen !== currentScreen) {
              analytics().setCurrentScreen(currentScreen);
            }
          }} />
      </Provider>
    );
  }
}

После изучения этой проблемы наиболее многообещающим способом решения проблемы является следующее: https://github.com/invertase/react-native-firebase/issues/3035.

Но я застрял с новая ошибка: 

 FAIL  __tests__/App-test.js
  ● Test suite failed to run

    /Users/kyjelly/micturnTwo/node_modules/react-native/Libraries/Utilities/warnOnce.js:15
    const warnedKeys: {[string]: boolean} = {};
          ^^^^^^^^^^

    SyntaxError: Missing initializer in const declaration

      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
      at Object.<anonymous> (node_modules/react-native/Libraries/react-native/react-native-implementation.js:14:18)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        3.101s

Вот часть шутки моего pacakge. json 

 "jest": {
    "preset": "react-native",
    "transformIgnorePatterns": [
      "node_modules/(?!(jest-)?react-native|react-clone-referenced-element|@react-native-community|expo(nent)?|@expo(nent)?/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|@react-native-firebase/app)"
    ]
  }

А вот мой jest.config. js

module.exports = {
  verbose: true,
  moduleNameMapper: {
    '@react-native-firebase/crashlytics': '<rootDir>/__tests__/__mocks__/firebase/crashlytics.js',
  }
};

Может кто-нибудь направить меня в правильном направлении? Насколько я понимаю, Jest имеет проблемы с компиляцией определенных файлов, которые не являются родными Javascript. Но каждое решение, которое я пробую, приводит к новой кроличьей норе попыток конфигурации.

...