Skip to content

Commit

Permalink
Migrate to Babel 7 (jestjs#7016)
Browse files Browse the repository at this point in the history
  • Loading branch information
SimenB authored and captain-yossarian committed Jul 18, 2019
1 parent 9d911c2 commit e9b8f1c
Show file tree
Hide file tree
Showing 144 changed files with 4,529 additions and 4,495 deletions.
13 changes: 0 additions & 13 deletions .babelrc

This file was deleted.

1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@
- `[jest-mock]` [**BREAKING**] Fix bugs with mock/spy result tracking of recursive functions ([#6381](https://github.com/facebook/jest/pull/6381))
- `[jest-haste-map]` [**BREAKING**] Recover files correctly after haste name collisions are fixed ([#7329](https://github.com/facebook/jest/pull/7329))
- `[pretty-format]` [**BREAKING**] Omit non-enumerable symbol properties ([#7448](https://github.com/facebook/jest/pull/7448))
- `[*]` [**BREAKING**] Upgrade to Babel 7, dropping support for Babel 6 ([#7016](https://github.com/facebook/jest/pull/7016))
- `[expect]` Standardize file naming in `expect` ([#7306](https://github.com/facebook/jest/pull/7306))
- `[jest-each]` Add empty array validation check ([#7249](https://github.com/facebook/jest/pull/7249))
- `[jest-cli]` Interrupt tests if interactive watch plugin key is pressed ([#7222](https://github.com/facebook/jest/pull/7222))
Expand Down
35 changes: 9 additions & 26 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -101,39 +101,22 @@ If you'd like to learn more about running `jest` through the command line, take

### Using Babel

[Babel](http://babeljs.io/) is automatically handled by Jest using `babel-jest`. You don't need install anything extra for using Babel.
To use [Babel](http://babeljs.io/), install the `babel-jest` and `@babel/core` packages:

> Note: If you are using Babel version 7 then you need to install `babel-jest`, `babel-core@^7.0.0-bridge.0` and `@babel/core` with the following command:
>
> ```bash
> yarn add --dev babel-jest babel-core@^7.0.0-bridge.0 @babel/core regenerator-runtime
> ```
```bash
yarn add --dev babel-jest @babel/core
```

Don't forget to add a [`.babelrc`](https://babeljs.io/docs/usage/babelrc/) file in your project's root folder. For example, if you are using ES6 and [React.js](https://reactjs.org) with the [`babel-preset-env`](https://babeljs.io/docs/plugins/preset-env/) and [`babel-preset-react`](https://babeljs.io/docs/plugins/preset-react/) presets:
Don't forget to add a [`babel.config.js`](https://babeljs.io/docs/en/config-files) file in your project's root folder. For example, if you are using ES6 and [React.js](https://reactjs.org) with the [`@babel/preset-env`](https://babeljs.io/docs/en/babel-preset-env) and [`@babel/preset-react`](https://babeljs.io/docs/en/babel-preset-react) presets:

```json
{
"presets": ["env", "react"]
}
```js
module.exports = {
presets: ['@babel/preset-env', '@babel/preset-react'],
};
```

You are now set up to use all ES6 features and React specific syntax.

> Note: If you are using a more complicated Babel configuration, using Babel's `env` option, keep in mind that Jest will automatically define `NODE_ENV` as `test`. It will not use `development` section like Babel does by default when no `NODE_ENV` is set.
> Note: If you've turned off transpilation of ES modules with the option `{ "modules": false }`, you have to make sure to turn this on in your test environment.
```json
{
"presets": [["env", {"modules": false}], "react"],
"env": {
"test": {
"presets": [["env"], "react"]
}
}
}
```
> Note: `babel-jest` is automatically installed when installing Jest and will automatically transform files if a babel configuration exists in your project. To avoid this behavior, you can explicitly reset the `transform` configuration option:
```json
Expand Down
19 changes: 19 additions & 0 deletions babel.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
// Copyright (c) 2014-present, Facebook, Inc. All rights reserved.

module.exports = {
babelrcRoots: ['examples/*'],
plugins: [
['@babel/plugin-transform-modules-commonjs', {allowTopLevelThis: true}],
'@babel/plugin-transform-strict-mode',
],
presets: [
[
'@babel/preset-env',
{
shippedProposals: true,
targets: {node: 6},
},
],
'@babel/preset-flow',
],
};
2 changes: 1 addition & 1 deletion docs/Es6ClassMocks.md
Original file line number Diff line number Diff line change
Expand Up @@ -227,7 +227,7 @@ jest.mock('./sound-player', () => {
});
```

This will throw **_TypeError: \_soundPlayer2.default is not a constructor_**, unless the code is transpiled to ES5, e.g. by babel-preset-env. (ES5 doesn't have arrow functions nor classes, so both will be transpiled to plain functions.)
This will throw **_TypeError: \_soundPlayer2.default is not a constructor_**, unless the code is transpiled to ES5, e.g. by `@babel/preset-env`. (ES5 doesn't have arrow functions nor classes, so both will be transpiled to plain functions.)

## Keeping track of usage (spying on the mock)

Expand Down
36 changes: 7 additions & 29 deletions docs/GettingStarted.md
Original file line number Diff line number Diff line change
Expand Up @@ -81,44 +81,22 @@ jest --init

### Using Babel

To use [Babel](http://babeljs.io/), install the `babel-jest` and `regenerator-runtime` packages via `yarn`:
To use [Babel](http://babeljs.io/), install the `babel-jest` and `@babel/core` packages via `yarn`:

```bash
yarn add --dev babel-jest babel-core regenerator-runtime
yarn add --dev babel-jest @babel/core
```

Or `npm`:
Don't forget to add a [`babel.config.js`](https://babeljs.io/docs/en/config-files) file in your project's root folder. For example, if you are using ES6 and [React.js](https://reactjs.org) with the [`@babel/preset-env`](https://babeljs.io/docs/en/babel-preset-env) and [`@babel/preset-react`](https://babeljs.io/docs/en/babel-preset-react) presets:

```bash
npm install --save-dev babel-jest babel-core regenerator-runtime
```

> Note: If you are using Babel version 7 then you need to install `babel-jest`, `babel-core@^7.0.0-bridge.0` and `@babel/core` with the following command or its `npm` equivalent:
>
> ```bash
> yarn add --dev babel-jest babel-core@^7.0.0-bridge.0 @babel/core regenerator-runtime
> ```
>
> You will need to use `babel.config.js` in order to transpile `node_modules`. See https://babeljs.io/docs/en/next/config-files for more information.
>
> You can also see the example in the Jest repository: https://github.com/facebook/jest/tree/master/examples/babel-7
_Note: Explicitly installing `regenerator-runtime` is not needed if you use `npm` 3 or 4 or Yarn_
Don't forget to add a [`.babelrc`](https://babeljs.io/docs/usage/babelrc/) file in your project's root folder. For example, if you are using ES6 and [React.js](https://facebook.github.io/react/) with the [`babel-preset-env`](https://babeljs.io/docs/plugins/preset-env/) and [`babel-preset-react`](https://babeljs.io/docs/plugins/preset-react/) presets:
```json
{
"presets": ["env", "react"]
}
```js
module.exports = {
presets: ['@babel/preset-env', '@babel/preset-react'],
};
```

You are now set up to use all ES6 features and React specific syntax.

> Note: If you are using a more complicated Babel configuration, using Babel's `env` option, keep in mind that Jest will automatically define `NODE_ENV` as `test` **if not already set** to something else. It will not use `development` section like Babel does by default when no `NODE_ENV` is set.
> Note: If you've turned off transpilation of ES6 modules with the option `{ "modules": false }`, you have to make sure to turn this on in your test environment.
```json
{
"presets": [["env", {"modules": false}], "react"],
Expand Down
2 changes: 1 addition & 1 deletion docs/Troubleshooting.md
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,7 @@ If you are using Facebook's [`create-react-app`](https://github.com/facebookincu

## Caching Issues

The transform script was changed or babel was updated and the changes aren't being recognized by Jest?
The transform script was changed or Babel was updated and the changes aren't being recognized by Jest?

Retry with [`--no-cache`](CLI.md#cache). Jest caches transformed module files to speed up test execution. If you are using your own custom transformer, consider adding a `getCacheKey` function to it: [getCacheKey in Relay](https://github.com/facebook/relay/blob/58cf36c73769690f0bbf90562707eadb062b029d/scripts/jest/preprocessor.js#L56-L61).

Expand Down
2 changes: 1 addition & 1 deletion docs/TutorialAsync.md
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@ it('works with async/await and resolves', async () => {
});
```

To enable async/await in your project, install [`babel-preset-env`](http://babeljs.io/docs/plugins/preset-env/) and enable the feature in your `.babelrc` file.
To enable async/await in your project, install [`@babel/preset-env`](https://babeljs.io/docs/en/babel-preset-env) and enable the feature in your `babel.config.js` file.

## Error handling

Expand Down
33 changes: 16 additions & 17 deletions docs/TutorialReact.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ If you have an existing application you'll need to install a few packages to mak
Run

```bash
yarn add --dev jest babel-jest babel-preset-env babel-preset-react react-test-renderer
yarn add --dev jest babel-jest @babel/preset-env @babel/preset-react react-test-renderer
```

Your `package.json` should look something like this (where `<current-version>` is the actual latest version number for the package). Please add the scripts and jest configuration entries:
Expand All @@ -36,9 +36,9 @@ Your `package.json` should look something like this (where `<current-version>` i
"react-dom": "<current-version>"
},
"devDependencies": {
"@babel/preset-env": "<current-version>",
"@babel/preset-react": "<current-version>",
"babel-jest": "<current-version>",
"babel-preset-env": "<current-version>",
"babel-preset-react": "<current-version>",
"jest": "<current-version>",
"react-test-renderer": "<current-version>"
},
Expand All @@ -47,11 +47,11 @@ Your `package.json` should look something like this (where `<current-version>` i
}
```

```json
// .babelrc
{
"presets": ["env", "react"]
}
```js
// babel.config.js
module.exports = {
presets: ['@babel/preset-env', '@babel/preset-react'],
};
```

**And you're good to go!**
Expand Down Expand Up @@ -309,23 +309,22 @@ If you need more advanced functionality, you can also build your own transformer
// custom-transformer.js
'use strict';

const babel = require('babel-core');
const {transform} = require('@babel/core');
const jestPreset = require('babel-preset-jest');

module.exports = {
process(src, filename) {
if (babel.util.canCompile(filename)) {
return babel.transform(src, {
filename,
presets: [jestPreset],
});
}
return src;
const result = transform(src, {
filename,
presets: [jestPreset],
});

return result ? result.code : src;
},
};
```
Don't forget to install the `babel-core` and `babel-preset-jest` packages for this example to work.
Don't forget to install the `@babel/core` and `babel-preset-jest` packages for this example to work.
To make this work with Jest you need to update your Jest configuration with this: `"transform": {"\\.js$": "path/to/custom-transformer.js"}`.
Expand Down
2 changes: 1 addition & 1 deletion docs/TutorialReactNative.md
Original file line number Diff line number Diff line change
Expand Up @@ -134,7 +134,7 @@ The preset sets up the environment and is very opinionated and based on what we

### transformIgnorePatterns customization

The [`transformIgnorePatterns`](configuration.html#transformignorepatterns-array-string) option can be used to whitelist or blacklist files from being transformed with babel. Many react-native npm modules unfortunately don't pre-compile their source code before publishing.
The [`transformIgnorePatterns`](configuration.html#transformignorepatterns-array-string) option can be used to whitelist or blacklist files from being transformed with Babel. Many react-native npm modules unfortunately don't pre-compile their source code before publishing.

By default the jest-react-native preset only processes the project's own source files and react-native. If you have npm dependencies that have to be transformed you can customize this configuration option by whitelisting modules other than react-native:

Expand Down
46 changes: 23 additions & 23 deletions e2e/__tests__/__snapshots__/coverage_report.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -46,16 +46,16 @@ exports[`generates coverage when using the testRegex config param 1`] = `
"-------------------------------------|----------|----------|----------|----------|-------------------|
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s |
-------------------------------------|----------|----------|----------|----------|-------------------|
All files </> | 56.52</> | 0</> | 50</> | 55.56</> | </> |
coverage-report </> | 41.18</> | 0</> | 25</> | 42.86</> | </> |
OtherFile.js </> | 100</> | 100</> | 100</> | 100</> | </> |
Sum.js </> | 85.71</> | 100</> | 50</> | 100</> | </> |
SumDependency.js </> | 0</> | 0</> | 0</> | 0</> | 8,10,12</> |
notRequiredInTestSuite.js </> | 0</> | 0</> | 0</> | 0</> | 8,15,16,17,19</> |
coverage-report/cached-duplicates/a</> | 100</> | 100</> | 100</> | 100</> | </> |
Identical.js </> | 100</> | 100</> | 100</> | 100</> | </> |
coverage-report/cached-duplicates/b</> | 100</> | 100</> | 100</> | 100</> | </> |
Identical.js </> | 100</> | 100</> | 100</> | 100</> | </> |
All files | 59.09 | 0 | 50 | 58.82 | |
coverage-report | 43.75 | 0 | 25 | 46.15 | |
OtherFile.js | 100 | 100 | 100 | 100 | |
Sum.js | 85.71 | 100 | 50 | 100 | |
SumDependency.js | 0 | 0 | 0 | 0 | 8,10,12 |
notRequiredInTestSuite.js | 0 | 0 | 0 | 0 | 15,16,17,19 |
coverage-report/cached-duplicates/a | 100 | 100 | 100 | 100 | |
Identical.js | 100 | 100 | 100 | 100 | |
coverage-report/cached-duplicates/b | 100 | 100 | 100 | 100 | |
Identical.js | 100 | 100 | 100 | 100 | |
-------------------------------------|----------|----------|----------|----------|-------------------|"
`;

Expand All @@ -72,12 +72,12 @@ exports[`outputs coverage report 1`] = `
"-------------------------------------|----------|----------|----------|----------|-------------------|
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s |
-------------------------------------|----------|----------|----------|----------|-------------------|
All files | 56.52 | 0 | 50 | 55.56 | |
coverage-report | 41.18 | 0 | 25 | 42.86 | |
All files | 59.09 | 0 | 50 | 58.82 | |
coverage-report | 43.75 | 0 | 25 | 46.15 | |
OtherFile.js | 100 | 100 | 100 | 100 | |
Sum.js | 85.71 | 100 | 50 | 100 | |
SumDependency.js | 0 | 0 | 0 | 0 | 8,10,12 |
notRequiredInTestSuite.js | 0 | 0 | 0 | 0 | 8,15,16,17,19 |
notRequiredInTestSuite.js | 0 | 0 | 0 | 0 | 15,16,17,19 |
coverage-report/cached-duplicates/a | 100 | 100 | 100 | 100 | |
Identical.js | 100 | 100 | 100 | 100 | |
coverage-report/cached-duplicates/b | 100 | 100 | 100 | 100 | |
Expand All @@ -88,20 +88,20 @@ All files | 56.52 | 0 | 50 | 55.56
exports[`outputs coverage report when text and text-summary is requested 1`] = `
"
=============================== Coverage summary ===============================
Statements : 56.52% ( 13/23 )
Statements : 59.09% ( 13/22 )
Branches : 0% ( 0/4 )
Functions : 50% ( 3/6 )
Lines : 55.56% ( 10/18 )
Lines : 58.82% ( 10/17 )
================================================================================
-------------------------------------|----------|----------|----------|----------|-------------------|
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s |
-------------------------------------|----------|----------|----------|----------|-------------------|
All files | 56.52 | 0 | 50 | 55.56 | |
coverage-report | 41.18 | 0 | 25 | 42.86 | |
All files | 59.09 | 0 | 50 | 58.82 | |
coverage-report | 43.75 | 0 | 25 | 46.15 | |
OtherFile.js | 100 | 100 | 100 | 100 | |
Sum.js | 85.71 | 100 | 50 | 100 | |
SumDependency.js | 0 | 0 | 0 | 0 | 8,10,12 |
notRequiredInTestSuite.js | 0 | 0 | 0 | 0 | 8,15,16,17,19 |
notRequiredInTestSuite.js | 0 | 0 | 0 | 0 | 15,16,17,19 |
coverage-report/cached-duplicates/a | 100 | 100 | 100 | 100 | |
Identical.js | 100 | 100 | 100 | 100 | |
coverage-report/cached-duplicates/b | 100 | 100 | 100 | 100 | |
Expand All @@ -113,12 +113,12 @@ exports[`outputs coverage report when text is requested 1`] = `
"-------------------------------------|----------|----------|----------|----------|-------------------|
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s |
-------------------------------------|----------|----------|----------|----------|-------------------|
All files | 56.52 | 0 | 50 | 55.56 | |
coverage-report | 41.18 | 0 | 25 | 42.86 | |
All files | 59.09 | 0 | 50 | 58.82 | |
coverage-report | 43.75 | 0 | 25 | 46.15 | |
OtherFile.js | 100 | 100 | 100 | 100 | |
Sum.js | 85.71 | 100 | 50 | 100 | |
SumDependency.js | 0 | 0 | 0 | 0 | 8,10,12 |
notRequiredInTestSuite.js | 0 | 0 | 0 | 0 | 8,15,16,17,19 |
notRequiredInTestSuite.js | 0 | 0 | 0 | 0 | 15,16,17,19 |
coverage-report/cached-duplicates/a | 100 | 100 | 100 | 100 | |
Identical.js | 100 | 100 | 100 | 100 | |
coverage-report/cached-duplicates/b | 100 | 100 | 100 | 100 | |
Expand All @@ -129,9 +129,9 @@ All files | 56.52 | 0 | 50 | 55.56
exports[`outputs coverage report when text-summary is requested 1`] = `
"
=============================== Coverage summary ===============================
Statements : 56.52% ( 13/23 )
Statements : 59.09% ( 13/22 )
Branches : 0% ( 0/4 )
Functions : 50% ( 3/6 )
Lines : 55.56% ( 10/18 )
Lines : 58.82% ( 10/17 )
================================================================================"
`;
Loading

0 comments on commit e9b8f1c

Please sign in to comment.