Testing react-jss + react + jest

Question

I am getting this error whenever I use jss in a component.

jest.config.json

{
  "moduleDirectories": [
    "node_modules",
    "src"
  ],
  "moduleFileExtensions": [
    "ts",
    "tsx",
    "js",
    "jsx",
    "json",
    "node"
  ],
  "moduleNameMapper": {
    "\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|pdf)$": "identity-obj-proxy"
  },
  "preset": "ts-jest",
  "roots": [
    "/src"
  ],
  "setupFilesAfterEnv": [
    "/src/setupTests.js"
  ],
  "testEnvironment": "jsdom",
  "testPathIgnorePatterns": [
    "/node_modules/"
  ],
  "testRegex": "(/__tests__/.*|(\.|/)(test|spec))\.(j|t)s(x)?$",
  "transform": {
    "^.+\.tsx?$": "ts-jest",
    "^.+\.jsx?$": "babel-jest"
  },
  "verbose": true
}

babel.config.json

{
  "presets": [
    "@babel/preset-react",
    [
      "@babel/preset-env",
      {
        "targets": {
          "ie": "11",
          "browsers": [
            "last 2 versions"
          ]
        },
        "modules": false,
        "useBuiltIns": "entry",
        "corejs": "3.0.0"
      }
    ],
    "@babel/preset-typescript"
  ],
  "plugins": [
    "@babel/plugin-transform-modules-commonjs",
    ["@babel/plugin-transform-runtime",
      {
        "regenerator": true,
        "runtimeHelpers": true
      }
    ],
    "@babel/plugin-syntax-dynamic-import",
    "@babel/plugin-proposal-object-rest-spread",
    "@babel/plugin-proposal-class-properties",
    "@babel/plugin-proposal-export-default-from",
    "@babel/plugin-proposal-export-namespace-from"
  ]
}

tsconfig.json

{
  "compilerOptions": {
    "types": ["node", "jest", "enzyme"],
    "declaration": true,
    "jsx": "react",
    // Target latest version of ECMAScript.
    "target": "esnext",
    // Search under node_modules for non-relative imports.
    "moduleResolution": "node",
    "noImplicitAny": false,
    // Process & infer types from .js files.
    "allowJs": true,
    // Don't emit; allow Babel to transform files.
    "noEmit": false,
    "module": "esnext",
    // Enable strictest settings like strictNullChecks & noImplicitAny.
    "strict": true,
    // Disallow features that require cross-file information for emit.
    "isolatedModules": true,
    // Import non-ES modules as default imports.
    "esModuleInterop": true,
    "baseUrl": "./src",
    "paths": {
      "components/*": ["./components/*"],
      "router/*": ["./router/*"],
      "utils/*": ["./utils/*"],
      "state/*": ["./state/*"],
      "types/*": ["./types/*"],
      "assets/*": ["./assets/*"]
    }
  },
  "declarationDir": "./src/build",
  "include": ["./src"],
  "exclude": ["node_modules", "./src/setupTests.js"]

}

setupTests.js

const enzyme = require('enzyme');
const Adapter = require('enzyme-adapter-react-16');

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

I cannot understand why I get this error, everything is fine without using jss. I can do mock for react-jss, but this is not an option. I've also searched the internet for various answers, but nothing helps. Maybe someone faced such a problem?

Testing react-jss + react + jest

0 Answers