Jest is not defined

[alibey-10]

Error msg:

ReferenceError: jest is not defined
    at Object.<anonymous> (C:\Users\alilo\Documents\NextjsWithTS\nextjs-boilerplate\node_modules\jest-next-dynamic\index.js:53:3)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.H76Q (C:\Users\alilo\Documents\NextjsWithTS\nextjs-boilerplate\.next\server\pages\__tests__\index.test.js:121:18)
    at __webpack_require__ (C:\Users\alilo\Documents\NextjsWithTS\nextjs-boilerplate\.next\server\pages\__tests__\index.test.js:23:31)    
    at Module.hF5B (C:\Users\alilo\Documents\NextjsWithTS\nextjs-boilerplate\.next\server\pages\__tests__\index.test.js:190:75) {
  type: 'ReferenceError'
}

index.test.js

import HomePage from '@/pages/index';
import preloadAll from 'jest-next-dynamic';
import { render } from 'src/testUtils/testUtils';

beforeAll(async () => {
  await preloadAll();
});
describe('Home page', () => {
  it('Should... WHEN...', () => {
    render(<HomePage />);
  });
});

jest config

module.exports = {
  roots: ['<rootDir>/src'],
  moduleFileExtensions: ['ts', 'tsx', 'js', 'json', 'jsx'],
  testPathIgnorePatterns: ['<rootDir>[/\\\\](node_modules|.next)[/\\\\]'],
  transformIgnorePatterns: ['[/\\\\]node_modules[/\\\\].+\\.(ts|tsx)$'],
  transform: {
    '^.+\\.(ts|tsx|js|jsx)$': 'babel-jest',
  },
  watchPlugins: [
    'jest-watch-typeahead/filename',
    'jest-watch-typeahead/testname',
  ],
  moduleNameMapper: {
    '\\.(css|less|sass|scss)$': 'identity-obj-proxy',
    '\\.(gif|ttf|eot|svg|png)$': '<rootDir>/test/__mocks__/fileMock.js',
    'src/(.*)': '<rootDir>/src/$1',
    '@/pages/(.*)': '<rootDir>/src/pages/$1',
    '@/components/(.*)': '<rootDir>/src/components/$1',
  },
  setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
};

.babelrc

{
  "presets": ["next/babel"],
  "plugins": ["babel-plugin-dynamic-import-node"]
}

"devDependencies": {
    "@testing-library/react": "^11.2.5",
    "@testing-library/user-event": "^12.8.3",
    "@types/jest": "^26.0.20",
    "@types/node": "^14.14.35",
    "@types/react": "^17.0.3",
    "@typescript-eslint/eslint-plugin": "^4.18.0",
    "@typescript-eslint/parser": "^4.18.0",
    "babel-jest": "^26.6.3",
    "babel-plugin-dynamic-import-node": "^2.3.3",
    "eslint": "^7.22.0",
    "eslint-config-prettier": "^8.1.0",
    "eslint-plugin-react": "^7.22.0",
    "jest": "^26.6.3",
    "jest-next-dynamic": "^1.0.1",
    "jest-watch-typeahead": "^0.6.1",
    "typescript": "^4.2.3"
  }

What could be the reason for it? how might my code affect an external module?

[denisugo]

I have encountered the same error. You should avoid placing your __test__ folder with jest tests within your pages folder. Simply move it somewhere out of the pages, this will resolve your issue.

[CarlosRangel17]

@denisugo simple yet effective answer! Fixed exactly my problem. Thank you!

[eduardocesl]

@denisugo Thank you!

[JeralSandeeptha]

@denisugo simple yet effective answer! Fixed exactly my problem. Thank you!

I don't use test folders but this issue still exist.

[carbonrobot]

@JeralSandeeptha The issue is placing test files in the pages/ directory. Some people use a __test__ folder, but the problem is the same either way. Move your test files outside of that special Next.js directory.

[JeralSandeeptha]

@JeralSandeeptha The issue is placing test files in the pages/ directory. Some people use a __test__ folder, but the problem is the same either way. Move your test files outside of that special Next.js directory.

Thanks for the reply. unfortunately I don't use Next.js. I'm using React vite project.

[viktor0556]

@JeralSandeeptha try vi.fn instead of jest.fn