Unexpected identifier when setup jest mock

[mpatafio]

Current behavior

Hi!!

I'm trying to setup AsyncStorage mock this way:

jestSetup.js

import mockAsyncStorage from '@react-native-community/async-storage/jest/async-storage-mock';
jest.mock('@react-native-community/async-storage', () => mockAsyncStorage);
global.fetch = require('jest-fetch-mock');

when I run my tests I get the following error:

 ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import mockAsyncStorage from '@react-native-community/async-storage/jest/async-storage-mock';
                                                                                                    ^^^^^^^^^^^^^^^^
    
    SyntaxError: Unexpected identifier
      
      at new Script (vm.js:85:7)
          at Generator.next (<anonymous>)

Environment

• Async Storage version: 1.6.1
• React-Native version: 0.59.5

Any hint?? Thanks!

[krizzu]

@mpatafio

Have you looked into troubleshooting jest guide here?

[schwamic]

I don't use Flow in my RN 0.61+ project and this is working fine for me:

jest.config.js

const jestPreset = require('@testing-library/react-native/jest-preset')

module.exports = {
  preset: '@testing-library/react-native',
  setupFiles: [...jestPreset.setupFiles, './node_modules/react-native-gesture-handler/jestSetup.js', './jest.setup.js'],
  setupFilesAfterEnv: ['@testing-library/react-native/cleanup-after-each'],
  transformIgnorePatterns: [
    'node_modules/(?!(react-native|react-navigation|@react-navigation|@react-native-community))',
  ],
  globals: {
    window: {},
  },
  moduleNameMapper: {
    '\\.svg': '<rootDir>/src/__mocks__/svgMock.js',
  },
}

jest.setup.js

/* eslint-disable no-undef */
import { NativeModules } from 'react-native'
import mockAsyncStorage from '@react-native-community/async-storage/jest/async-storage-mock'

NativeModules.RNCNetInfo = {
  getCurrentState: jest.fn(() => Promise.resolve()),
  addListener: jest.fn(),
  removeListeners: jest.fn(),
}

jest.mock('@react-native-community/async-storage', () => mockAsyncStorage)

---

Note: If you already have transformIgnorePatterns defined, you should add @react-native-community via |. If you add a second line to your existing transformIgnorePatterns, it will throw errors:

transformIgnorePatterns: [
    'node_modules/(?!(react-native|react-navigation|@react-navigation))',
    'node_modules/(?!(@react-native-community|react-native)/)'  <--- NOT WORKING
],