Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Must use import to load ES Module - Jest #67

Closed
wadehammes opened this issue Apr 20, 2023 · 2 comments
Closed

Must use import to load ES Module - Jest #67

wadehammes opened this issue Apr 20, 2023 · 2 comments

Comments

@wadehammes
Copy link

wadehammes commented Apr 20, 2023

I'm getting this error in my Jest tests when trying to us va.track:

image

Here is my jest.config.ts:

// jest.config.ts
import type { Config } from "@jest/types";
import nextJest from "next/jest";

// Sync object
const customJestConfig: Config.InitialOptions = {
  verbose: true,
  testPathIgnorePatterns: ["<rootDir>/.next/", "<rootDir>/node_modules/"],
  setupFiles: ["<rootDir>/.jest/setEnvVars.ts"],
  setupFilesAfterEnv: ["<rootDir>/.jest/setupTests.ts"],
  moduleDirectories: ["node_modules", "<rootDir>"],
  testEnvironment: "jest-environment-jsdom",
  transformIgnorePatterns: ["<rootDir>/node_modules/(?!isbot|swiper)"],
};

// Providing the path to your Next.js app which will enable loading next.config.js and .env files
const createJestConfig = nextJest({ dir: "./" })(customJestConfig);

module.exports = async () => {
  // Create Next.js jest configuration presets
  const jestConfig = await createJestConfig();

  // Custom `moduleNameMapper` configuration
  const moduleNameMapper = {
    ...jestConfig.moduleNameMapper,
    "swiper/react": "<rootDir>/node_modules/swiper",
    "\\.(css|less|scss|sass)$": "identity-obj-proxy",
  };

  return { ...jestConfig, moduleNameMapper, testTimeout: 20000 };
};

Any idea if this is something on my end?

@wadehammes
Copy link
Author

For others that stumble on this, was as simple as adding "@vercel/analytics": "identity-obj-proxy", to the moduleNameMapper.

const moduleNameMapper = {
    ...jestConfig.moduleNameMapper,
    "swiper/react": "<rootDir>/node_modules/swiper",
    "@vercel/analytics": "identity-obj-proxy",
    "\\.(css|less|scss|sass)$": "identity-obj-proxy",
  };

@mrchief
Copy link

mrchief commented Oct 18, 2023

Sneaky stuff that should be documented but is not. Thanks for the solution!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants