I'm working in a react + typescript app and I have my tests written using jest. I'm using IntelliJ RIDER to run/debug my tests. We are using docker to locally deploy the app and yarn.
We just recently changed our repo arquitecture to use turborepo:
Old arquitecture
root
frontend
- tests
backend
New arquitecture
root
apps
b2b-frontend
- tests
backend
The problem I'm running into is that now with the new arquitecture, I get this error when I run my tests:
Module
This is my run configuration (automatically created by RIDER):
enter image description here
Things I've already tried
Debugging rootDir, I'm positive that rootDir is correct and that the file exists.
Clean install of both yarn and jest
We can run the tests using
npx jestandyarn testinside our CI/CD
I'm not very familiar with turborepo since it's my first time using it and the change was made by other people. So, in case it helps, here is my jest-related config files:
// jest.config.cjs
module.exports = {
setupFilesAfterEnv: ['/jest.setup.ts'],
transform: {
'^.+\\.(ts|tsx)$': 'babel-jest',
'^.+\\.[t|j]sx?$': 'babel-jest',
'^.+\\.mjs$': 'babel-jest',
'^.+\\.tsx?$': 'ts-jest',
},
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
testEnvironment: 'jest-environment-jsdom',
moduleNameMapper: {
'\\.(css|less|scss|sass)$': 'identity-obj-proxy',
'\\.svg$': '/src/mocks/svg-mocker.js',
'\\.(jpg|jpeg|png|gif|webp|svg)$': '/src/mocks/image-mocker.js',
},
};
// jest.setup.ts
import '@testing-library/jest-dom';
import { act, cleanup } from '@testing-library/react';
import { TextDecoder, TextEncoder } from 'util';
import seedrandom from 'seedrandom';
Math.random = seedrandom('fixed-seed');
global.TextEncoder = TextEncoder;
global.TextDecoder = TextDecoder as unknown as typeof global.TextDecoder;
jest.mock('./src/services/network/api', () => {
return {
__esModule: true,
default: {
get: jest.fn(),
post: jest.fn(),
put: jest.fn(),
delete: jest.fn(),
patch: jest.fn(),
},
};
});
jest.mock('./src/services/feature_flags/withFeatureFlag', () => ({
__esModule: true,
default: (Component: React.ComponentType) => Component,
}));
jest.mock('react-i18next', () => ({
useTranslation: () => ({
t: (key: string) => key, // return the key as the translation
i18n: {
changeLanguage: () => new Promise(() => {}),
},
}),
Trans: ({ children }: { children: React.ReactNode }) => children,
}));
// eslint-disable-next-line @typescript-eslint/no-require-imports
jest.mock('@react-oauth/google', () => require('./src/mocks/googleMock'));
beforeEach(() => {
jest.clearAllMocks();
jest.resetAllMocks();
});
afterEach(() => {
act(() => {
cleanup();
localStorage.clear();
});
});
beforeAll(() => {
class IntersectionObserverMock {
observe = jest.fn();
unobserve = jest.fn();
disconnect = jest.fn();
takeRecords = jest.fn();
constructor() {}
}
Object.defineProperty(window, 'IntersectionObserver', {
writable: true,
configurable: true,
value: IntersectionObserverMock,
});
Object.defineProperty(global, 'IntersectionObserver', {
writable: true,
configurable: true,
value: IntersectionObserverMock,
});
});
// tsconfig.json
{
"compilerOptions": {
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",
"incremental": true,
"plugins": [
{
"name": "next"
}
]
},
"types": [
"vite/client",
"node"
],
"include": [
"src/**/*",
"jest.setup.ts"
],
"exclude": [
"node_modules"
]
}
// b2b-frontend/turbo.json
{
"extends": [
"//"
],
"tasks": {
"build": {
"outputs": [
"dist/**"
]
}
}
}
Thanks for reading, I really appreciate it.
Dani