wmonk/create-react-app-typescript

Question: Is there any way to use local jest configuration ?

somarlyonks opened this issue · 3 comments

somarlyonks commented

Is this a bug report?

No

I mean, a jest.config.js in rootDir, it looks like the createJestConfig just ignore the local configuration, and if I run it with

react-scripts-ts test --coverage --config=jest.config.js --env=jsdom

It complains that argv.config.match is not a function.

Env

  • node 8.10

  • dependecies

  "dependencies": {
    "bootstrap": "^4.1.1",
    "react": "^16.4.0",
    "react-dom": "^16.4.0"
  },
  "devDependencies": {
    "@types/jest": "^23.0.0",
    "@types/node": "^10.3.0",
    "@types/react": "^16.3.16",
    "@types/react-dom": "^16.0.5",
    "node-sass-chokidar": "^1.3.0",
    "react-scripts-ts": "2.17.0",
    "npm-run-all": "^4.1.3",
    "coveralls": "^3.0.2",
    "node-fetch": "^2.2.0",
    "typescript": "^3.0.3"
  }
cjduncana commented

I just encountered this problem as well, but I'm using Microsoft's repo.

r3nya commented

Hey @somarlyonks!

Just change your npm task for running jest w/o react-scripts-ts, e.g.

"test": "jest --no-cache -w 2",

And don't forget to add some extra rules into your jest config (or package.json).

E.g. my jest config:

"jest": {
    "collectCoverageFrom": [
      "src/**/*.{js,jsx,ts,tsx}",
      "!**/*.d.ts",
      "!**/*.test.api.ts"
    ],
    "setupFiles": [
      "<rootDir>/config/jest/setup.js",
      "<rootDir>/config/polyfills.js",
      "jest-localstorage-mock"
    ],
    "testMatch": [
      "<rootDir>/src/**/__tests__/**/*.ts?(x)",
      "<rootDir>/src/**/?(*.)(spec|test).ts?(x)"
    ],
    "testEnvironment": "jsdom",
    "testURL": "http://localhost",
    "transform": {
      "^.+\\.tsx?$": "ts-jest",
      "^.+\\.(js|jsx|mjs)$": "<rootDir>/node_modules/babel-jest",
      "^.+\\.css$": "<rootDir>/config/jest/cssTransform.js",
      "^(?!.*\\.(js|jsx|mjs|css|json)$)": "<rootDir>/config/jest/fileTransform.js"
    },
    "transformIgnorePatterns": [
      "[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs|ts|tsx)$"
    ],
    "moduleNameMapper": {
      "^.+\\.css$": "identity-obj-proxy",
      "^react-native$": "react-native-web",
      "^src/([^\\.]*)$": "<rootDir>/src/$1"
    },
    "moduleFileExtensions": [
      "web.ts",
      "ts",
      "web.tsx",
      "tsx",
      "web.js",
      "js",
      "web.jsx",
      "jsx",
      "json",
      "node",
      "mjs"
    ],
    "globals": {
      "ts-jest": {
        "tsConfig": "./tsconfig.test.json"
      }
    },
    "snapshotSerializers": [
      "enzyme-to-json/serializer"
    ]
},

Please let me know if you will have any problems. 😉

  • 🎉1
somarlyonks commented

@r3nya Thanks a lot. It works.

  • 👍1