Error running Jest tests #13773
Description
Is there an existing issue for this?
- I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
- I have reviewed the documentation https://docs.sentry.io/
- I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases
How do you use Sentry?
Sentry Saas (sentry.io)
Which SDK are you using?
@sentry/nextjs
SDK Version
8.31.0
Framework Version
Next 14.2.9
Link to Sentry event
No response
Reproduction Example/SDK Setup
No response
Steps to Reproduce
I laucnh my tests with jest: yarn test
This is my package.json file:
{
"name": "cliq-analytics",
"private": true,
"version": "1.30.0",
"scripts": {
"dev": "next dev",
"build": "next build",
"build-static": "next build && next export",
"build-test": "env-cmd -f .env.test next build && next export -o build/",
"build-prod": "env-cmd -f .env.production next build && next -o build/",
"duplicate": "npx jscpd --min-lines 40 --pattern \"**/*.tsx\"",
"start": "PORT=80 next start",
"lint": "eslint \"src/**/*.{ts,tsx,js,jsx}\"",
"lint-resolve": "eslint \"src/**/*.{ts,tsx,js,jsx}\" . --fix",
"packages:upgrade": "yarn upgrade-interactive --latest",
"prepare": "husky install",
"test": "jest",
"test:unit:watch": "jest --watch",
"test:coverage": "yarn test --coverage",
"test:badges": "yarn test:coverage && jest-coverage-badges",
"report": "ts-prune -p tsconfig.json -s .test.ts? > reports/ts-prune.txt && jest --coverage --coverageDirectory=reports/jest/"
},
"lint-staged": {
"src/**/*.{ts,tsx,js,jsx}": [
"npm run lint -- --fix"
]
},
"dependencies": {
"@ant-design/colors": "7.1.0",
"@ant-design/icons": "^5.4.0",
"@aws-sdk/client-s3": "^3.637.0",
"@emotion/react": "11.11.1",
"@emotion/styled": "^11.13.0",
"@faker-js/faker": "^8.4.1",
"@formkit/drag-and-drop": "^0.1.6",
"@hookform/devtools": "^4.3.1",
"@hookform/resolvers": "^3.9.0",
"@mui/icons-material": "^5.16.1",
"@mui/lab": "^5.0.0-alpha.141",
"@mui/material": "^5.16.7",
"@mui/styles": "^6.1.1",
"@mui/system": "^5.15.4",
"@mui/utils": "^5.16.0",
"@reduxjs/toolkit": "^2.2.1",
"@sentry/nextjs": "^8.31.0",
"@sentry/tracing": "^7.114.0",
"@tanstack/query-sync-storage-persister": "^5.51.9",
"@tanstack/react-query": "^5.51.11",
"@tanstack/react-query-devtools": "^5.51.11",
"@tanstack/react-query-persist-client": "^5.51.11",
"@testing-library/jest-dom": "^6.5.0",
"@testing-library/react": "^15.0.7",
"@types/file-saver": "^2.0.5",
"@types/lodash": "^4.17.0",
"@types/papaparse": "^5.3.14",
"@types/react-copy-to-clipboard": "^5.0.4",
"@types/react-date-range": "^1.4.4",
"@types/ua-parser-js": "^0.7.39",
"@types/webpack-env": "^1.18.1",
"apexcharts": "^3.49.0",
"axios": "^1.7.4",
"clsx": "^2.0.0",
"dayjs": "^1.11.9",
"dotenv": "^16.4.2",
"file-saver": "^2.0.5",
"file-system": "^2.2.2",
"framer-motion": "^11.5.6",
"gray-matter": "^4.0.3",
"html-to-image": "^1.9.0",
"jest-coverage-badges": "^1.1.2",
"jest-environment-jsdom": "^29.6.3",
"jest-html-reporter": "^3.10.2",
"jscpd": "^4.0.5",
"jspdf": "^2.5.1",
"jszip": "^3.7.1",
"jwt-decode": "^4.0.0",
"lodash": "^4.17.21",
"msw": "^2.3.0",
"next": "^14.2.9",
"next-build-id": "^3.0.0",
"papaparse": "^5.4.1",
"react": "^18.3.1",
"react-apexcharts": "^1.4.0",
"react-copy-to-clipboard": "^5.1.0",
"react-date-range": "^1.4.0",
"react-device-detect": "^2.2.2",
"react-dom": "^18.3.1",
"react-dropzone": "^14.2.3",
"react-hook-form": "^7.51.0",
"react-hot-toast": "^2.4.1",
"react-redux": "^9.1.0",
"redux-persist": "^6.0.0",
"remark": "^15.0.1",
"remark-html": "^16.0.1",
"simplebar": "^6.2.5",
"simplebar-react": "^3.2.4",
"ts-prune": "^0.10.3",
"tss-react": "^4.9.3",
"ua-parser-js": "^1.0.37",
"xlsx": "^0.18.5",
"yarn": "^1.22.17",
"yup": "^1.4.0",
"zod": "^3.23.8"
},
"devDependencies": {
"@commitlint/cli": "^19.4.0",
"@commitlint/config-conventional": "^19.5.0",
"@next/eslint-plugin-next": "^14.0.3",
"@semantic-release/changelog": "^6.0.3",
"@semantic-release/exec": "^6.0.3",
"@semantic-release/git": "^10.0.1",
"@svgr/webpack": "^8.1.0",
"@types/jest": "^29.5.3",
"@types/node": "^22.1.0",
"@types/react": "^18.3.2",
"@types/react-dom": "^18.3.0",
"@typescript-eslint/eslint-plugin": "^6.21.0",
"@typescript-eslint/parser": "^7.13.1",
"babel-jest": "^29.6.3",
"eslint": "^8.57.0",
"eslint-config-airbnb": "19.0.4",
"eslint-config-airbnb-typescript": "^17.0.0",
"eslint-config-next": "^14.2.3",
"eslint-config-prettier": "^9.1.0",
"eslint-config-standard-with-typescript": "43.0.0",
"eslint-config-ts": "^4.0.1",
"eslint-plugin-import": "^2.29.1",
"eslint-plugin-jest": "^28.8.0",
"eslint-plugin-jsx-a11y": "^6.10.0",
"eslint-plugin-prettier": "^5.2.1",
"eslint-plugin-react": "^7.36.1",
"husky": "^9.0.11",
"jest": "^29.6.3",
"lint-staged": "^15.2.0",
"prettier": "^3.0.3",
"sass": "^1.77.6",
"semantic-release": "^24.1.1",
"stylelint": "^15.11.0",
"stylelint-config-prettier": "^9.0.5",
"stylelint-config-standard": "^34.0.0",
"stylelint-config-standard-scss": "^11.1.0",
"ts-jest": "^29.2.4",
"typescript": "^5.6.2"
},
"msw": {
"workerDirectory": "public"
},
"jscpd": {
"reporters": [
"console"
],
"ignore": [
"**/node_modules/**"
]
}
}babel.config.json file:
{
"presets": ["next/babel"]
}jest.config.js file:
module.exports = {
verbose: true,
clearMocks: true,
collectCoverage: true,
coverageReporters: ['html', 'text', 'lcov', 'json-summary'],
coverageDirectory: './coverage',
moduleFileExtensions: ['ts', 'js', 'tsx'],
preset: 'ts-jest',
roots: ['<rootDir>'],
setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
testEnvironment: 'jest-environment-jsdom',
testPathIgnorePatterns: [
'.*/(constants.test.tsx)$',
'<rootDir>/node_modules/',
'<rootDir>/.next/',
],
transform: {
'^.+\\.(ts|tsx)$': ['babel-jest', { configFile: './__tests__/config/babel.config.json' }],
},
moduleNameMapper: {
'^components/(.*)$': '<rootDir>/src/components/$1',
'^pages/(.*)$': '<rootDir>/src/pages/$1',
'^shared/(.*)$': '<rootDir>/src/shared/$1',
'^store/(.*)$': '<rootDir>/src/store/$1',
'\\.(css|less|scss|sass)$': '<rootDir>/src/mocks/styleMock.ts',
},
};Expected Result
I expect my tests to be run.
Actual Result
Error [ERR_REQUIRE_ESM]: require() of ES Module /home/benoit/projets/react-hype-analytics/node_modules/string-width/index.js from /home/benoit/projets/react-hype-analytics/node_modules/cliui/build/index.cjs not supported. Instead change the require of index.js in /home/benoit/projets/react-hype-analytics/node_modules/cliui/build/index.cjs to a dynamic import() which is available in all CommonJS modules. at Object.<anonymous> (/home/benoit/projets/react-hype-analytics/node_modules/cliui/build/index.cjs:291:21)