Unexpected token 'export' error when running Jest tests with React Native Testing Library

[Vitaly Kuprin]

Description

I am encountering an "Unexpected token 'export'" error when running Jest tests for a React Native project using React

Native Testing Library. This issue appears to be related to the transformation of ES6 module syntax in certain dependencies.

@testing-library/react version:

• Version: 12.5.1

Testing Framework and version:

• Jest version: 29.6.3
• React Native version: 0.74.1

DOM Environment:

• jsdom (default with Jest)

babel.config.js

module.exports = {
  presets: [
    'module:@react-native/babel-preset',
    '@babel/preset-react',
  ],
  plugins: [
    ["@babel/plugin-transform-private-methods", { loose: true }],
    ["@babel/plugin-transform-private-property-in-object", { loose: true }],
    ["@babel/plugin-transform-class-properties", { loose: true }],
    'react-native-reanimated/plugin',
    [
      'module-resolver',
      {
        root: ['./src'],
        alias: {},
      },
    ],
  ],
};

jest.config.js

module.exports = {
  preset: 'react-native',
  setupFiles: ['./jestSetup.ts'],
  transform: {
    '^.+\\.[tj]sx?$': 'babel-jest',
  },
  testEnvironment: 'jest-environment-jsdom',
  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
  transformIgnorePatterns: [
    'node_modules/(?!(react-native|@react-native|react-native-webrtc|react-native-reanimated|@react-native-community|@testing-library|@babel|metro-react-native-babel-preset)/)',
  ],
};

jestSetup.ts

jest.mock('react-native-webrtc');
jest.mock('node-fetch', () => require('jest-fetch-mock'));

What you did:

Running Jest tests for a React Native project with the configuration and code provided above.

Unexpected token 'export'

There seems to be an issue with your configuration that prevents React Native Testing Library from working correctly.
Please check if you are using compatible versions of React Native and React Native Testing Library.

Reproduction:

A minimal reproduction can be created by setting up a new React Native project with the provided Babel and Jest configurations, and attempting to run the example test file.

Problem description:

The current behavior is problematic because Jest is unable to process the ES6 module syntax (e.g., export) in certain dependencies, causing the tests to fail.

[Sebastian Silbermann]

You want to use @testing-library/react-native not @testing-library/react. If the issue persists, please file this against https://github.com/callstack/react-native-testing-library instead.