'_enzymeAdapterReact.default is not a constructor when test jest

I'm having this issue when test react-native component with jest and enzyme TypeError: _enzymeAdapterReact.default is not a constructor

Here is my dev dependencies:

    "@babel/core": "^7.12.10",
    "@babel/runtime": "^7.12.5",
    "@react-native-community/eslint-config": "^2.0.0",
    "babel-jest": "^26.6.3",
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.6",
    "eslint": "^7.16.0",
    "jest": "^26.6.3",
    "jest-environment-enzyme": "^7.1.2",
    "@types/enzyme": "^3.10.12",
    "jest-enzyme": "^7.1.2",
    "metro-react-native-babel-preset": "^0.64.0",
    "react-test-renderer": "^17.0.0",
    "redux-mock-store": "^1.5.4"
  }

Here is jest config:

    verbose: true,
    preset:'react-native',
    transformIgnorePatterns: [
        'node_modules/(?!victory-native|(jest-)?viewpager|enzyme|react-native|@react-native-community|react-native-device-info|react-native-mov-to-mp4|@react-navigation)/',
    ],
    setupFiles: ['./jest.setup.js'],
    setupFilesAfterEnv: ['./node_modules/jest-enzyme/lib/index.js'],
    testEnvironment: 'enzyme',
    testEnvironmentOptions: {
        'enzymeAdapter': 'react16',
    },

}

module.exports = config

Here is jest setup:

import { NativeModules } from 'react-native'
import mockAsyncStorage from '@react-native-async-storage/async-storage/jest/async-storage-mock'

jest.mock('@react-native-async-storage/async-storage', () => mockAsyncStorage)
NativeModules.RNCNetInfo = {
    getCurrentState: jest.fn(() => Promise.resolve()),
    addListener: jest.fn(),
    removeListeners: jest.fn(),
}

I tried all method in this thread but not working also: https://github.com/enzymejs/enzyme/issues/1284

It throw this enter image description here

Here is my test file:

import React from 'react'
import {AddActionItem} from '../add-action-item'
import Enzyme,{ shallow } from 'enzyme'
import  renderer  from 'react-test-renderer'
import  Adapter from 'enzyme-adapter-react-16'



Enzyme.configure({ adapter: new Adapter() })
describe('Test Add Action Item', ()=>{
    test('test componet',()=>{
        expect(shallow(<AddActionItem/>)).toMatchSnapshot()
    })
})

Please help, thank you a lots



Solution 1:[1]

Have you try to make a new file setupTests.js , in the root of App , and put there , for not write every time this configuration part

import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

if you using type script then

import { configure } from 'enzyme';
import * as Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

my package json versions are

    "enzyme-adapter-react-16": "^1.15.3",
    "eslint": "^7.32.0",
    "jest": "^26.6.3",
    "jest-enzyme": "^7.1.2",

in the package.json I have a configuration of jest like this

"jest": {
        "testEnvironment": "jsdom",
        "setupFilesAfterEnv": [
            "<rootDir>/setupTests.js",
            "./node_modules/jest-enzyme/lib/index.js",
            "jest-extended"
        ],
        "testResultsProcessor": "jest-junit"
    },

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1