Skip to content

Commit

Permalink
Upgrade with-jest-typescript example to next 6.0.0 (#4543)
Browse files Browse the repository at this point in the history
Hello! I ran into an issue using typescript and jest with next 6.0.0. I was able to work through fixing it and I wanted to share my solution back to next.js, by upgrading the with-jest-typescript example to next 6.0.0.

The steps I followed were:

1. `npx babel-upgrade --write` which added babel-core@^7.0.0-bridge.0 to allow jest's babel 6 to play nice with next's babel 7
2. Remove `ts-jest` and replace with `babel-jest` to use babel to transform the typescript code, as is done when the dev and production builds run
3. Update the babelrc to use commonjs modules in test mode to be compatible with jest

Also, I removed the `NODE_ENV=test` on the jest task, because jest sets the env to test anyways, and I'm on windows where this code is incorrect. The other option is to use `cross-env` but I felt it was simpler to just remove the environment override.

To my knowledge, this PR would help on the following issues:

#3663 #4227 #4531 #4528 #4239
  • Loading branch information
ngauthier authored and timneutkens committed Jun 6, 2018
1 parent 5bc3b23 commit bbbf7ab
Show file tree
Hide file tree
Showing 3 changed files with 35 additions and 16 deletions.
33 changes: 28 additions & 5 deletions examples/with-jest-typescript/.babelrc
Original file line number Diff line number Diff line change
@@ -1,6 +1,29 @@
{
"presets": [
"next/babel",
"@zeit/next-typescript/babel"
]
}
"env": {
"development": {
"presets": [
"next/babel",
"@zeit/next-typescript/babel"
]
},
"production": {
"presets": [
"next/babel",
"@zeit/next-typescript/babel"
]
},
"test": {
"presets": [
[
"next/babel",
{
"preset-env": {
"modules": "commonjs"
}
}
],
"@zeit/next-typescript/babel"
]
}
}
}
7 changes: 1 addition & 6 deletions examples/with-jest-typescript/jest.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,9 @@ const TEST_REGEX = '(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|js?|tsx?|ts?)$'

module.exports = {
setupFiles: ['<rootDir>/jest.setup.js'],
globals: {
'ts-jest': {
'useBabelrc': true
}
},
testRegex: TEST_REGEX,
transform: {
'^.+\\.tsx?$': 'ts-jest'
'^.+\\.tsx?$': 'babel-jest'
},
testPathIgnorePatterns: [
'<rootDir>/.next/', '<rootDir>/node_modules/'
Expand Down
11 changes: 6 additions & 5 deletions examples/with-jest-typescript/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,28 +2,29 @@
"name": "with-jest-typescript",
"version": "1.0.0",
"scripts": {
"test": "NODE_ENV=test jest",
"test": "jest",
"dev": "next",
"build": "next build",
"start": "next start"
},
"dependencies": {
"next": "^5.0.0",
"next": "^6.0.0",
"react": "^16.2.0",
"react-dom": "^16.2.0"
},
"devDependencies": {
"@types/jest": "^22.2.2",
"@types/jest": "^23.0.0",
"@types/next": "^2.4.8",
"@types/react": "^16.0.41",
"@types/react-dom": "^16.0.4",
"@zeit/next-typescript": "1.0.1",
"babel-core": "^7.0.0-bridge.0",
"babel-jest": "23.0.1",
"enzyme": "^3.3.0",
"enzyme-adapter-react-16": "^1.1.1",
"jest": "^22.4.3",
"jest": "^23.1.0",
"react-addons-test-utils": "^15.6.2",
"react-test-renderer": "^16.2.0",
"ts-jest": "^22.4.2",
"typescript": "^2.7.2"
}
}

0 comments on commit bbbf7ab

Please sign in to comment.