0

I am using Firebase in my Expo app, and when running a Jest test I encounter the error:

enter image description here

The error seems to only apply to my Firebase imports. I have attempted the solution here to add "type": "module" to my package.json file, which only gives me a new error:

You appear to be using a native ECMAScript module configuration file, which is only supported when running Babel asynchronously.

I then tried the solution for that error (giving my babel.config.js file a .cjs extension instead) which then gave me the same error I originally had again.

Additionally, I tried the solution here to require my imports instead, which also did not work. It seems to be difficult to find a solution for this issue that works for an Expo project. Any help would be appreciated.

My babel.config.js:

module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
  };
};

My package.json:

{
  "name": "FAKE_NAME",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "test": "jest"
  },
  "jest": {
    "preset": "jest-expo",
    "transformIgnorePatterns": [
      "node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native-svg)"
    ]
  },
  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.17.11",
    "@react-native-community/masked-view": "^0.1.11",
    "@react-navigation/bottom-tabs": "^6.5.5",
    "@react-navigation/native": "^6.1.5",
    "@react-navigation/native-stack": "^6.9.9",
    "expo": "~47.0.12",
    "expo-app-loading": "^2.1.1",
    "expo-linear-gradient": "~12.0.1",
    "expo-splash-screen": "~0.17.5",
    "expo-status-bar": "~1.4.2",
    "firebase": "^9.17.1",
    "jest": "^26.6.3",
    "jest-expo": "^48.0.1",
    "react": "^18.1.0",
    "react-native": "0.70.5",
    "react-native-bouncy-checkbox": "^3.0.6",
    "react-native-gesture-handler": "~2.8.0",
    "react-native-ionicons": "^4.6.5",
    "react-native-reanimated": "~2.12.0",
    "react-native-safe-area-context": "4.4.1",
    "react-native-screens": "~3.18.0",
    "react-navigation": "^4.4.4",
    "react-navigation-stack": "^2.10.4"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9"
  },
  "private": true
}

My Test File:

import React from 'react';
import renderer from 'react-test-renderer';

import App from '../App';

describe('<App />', () => {
  it('has 1 child', () => {
    const tree = renderer.create(<App />).toJSON();
    expect(tree.children.length).toBe(1);
  });
});

0 Answers0