docs: setting up babel, fixes regeneratorRuntime not defined

[DylanVann]

Summary

If a user follows the current instructions for setting up Babel they will not be able to use async/await, and in fact a cryptic error will be thrown.

The error is: ReferenceError: regeneratorRuntime is not defined

See: #7579

This PR updates the instructions to include using @babel/polyfill so that this error does not occur.
This PR updates the instructions to include configuring @babel/preset-env's targets option.

Test plan

I have followed the new instructions to install Jest and setup Babel, async/await works correctly.

[SimenB]

Thanks!

Left a couple of inline comments, but I don't agree with the direction here.

Could we instead have something at the bottom (below our example config file) saying something like

Remember to correctly configure @babel/preset-env for your transpilation targets. See Babel's docs.

Not sure if something like this makes sense as well?

Jest will set process.env.NODE_ENV to 'test' if it's not set to something else, so you can use that in your configuration to conditionally setup only the transpilation you need, e.g. adding {targets: {node: 'current'}}

[DylanVann]

I had to remove "You are now set up to use all ES2018 features and React-specific syntax.". If you're running an older Node version certain things might not be available without using the polyfill, like String.prototype.trimStart().

[SimenB]

you don't need either of the presets - the other 2 are actually needed, though. Not sure how to best say that, and still have useful examples

[DylanVann]

Well you'd probably want to include something, at the very least you probably want to compile ES6 modules.

I think our bases are pretty well covered by "The ideal configuration for Babel will depend on your project.".

[thymikee]

We assume user already have Babel set up in the project and they only want to add Jest support, hence only babel-jest and @babel/core are needed. They need to be at top level of node_modules to satisfy peerDependencies and transform resolver

[SimenB]

for babel 7, people are required to use @babel/core. So if we go with the assumption babel is correctly set up, we just need to add babel-jest

[thymikee]

I think it's sane to assume that Babel is there and we should make it obvious in the guide. We can't choose Babel plugins and presets for users, that's bad.

So, only adding babel-jest should suffice. We just need to make sure users have Babel 7 already set up.

[DylanVann]

Well I do think no instructions would be better than not working instructions 😆.

If it was up to me I'd remove the React preset from these instructions, but otherwise leave them as is.

[SimenB]

@DylanVann now that we've released Jest 24, you need to also update the versioned docs: https://github.com/facebook/jest/blob/master/website/versioned_docs/version-24.0/GettingStarted.md

EDIT: oops, wrong tag 😬

[DylanVann]

@SimenB Do we agree on the content? I've put in bold:

The ideal configuration for Babel will depend on your project.

[SimenB]

lgtm, thanks! Just merge in master an add it to versioned docs and we can merge this

[SimenB]

After merging in master, please move up to correct section

[SimenB]

Do we agree on the content?

Yeah, although the basis (using babel.config.js, installing babel-jest) are always needed. Beyond that, it really depends, though 🙂

[DylanVann]

@SimenB Done, thanks for the help 🙂

[SimenB]

This is great, thank you!

[github-actions]

This pull request has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.