Add babel-transform-runtime to browser builds

[skovhus]

Summary

Related to #3360.

#3421 introduced additional es5 builds of speciic Jest packages meant for use in browsers. But as async/await is used some places (and possibly other ES6 feature), the transpilation was missing transform-runtime in order to work for consumers.

Alternatives to this solution

• stop using async/await (and possibly other es6 features) in packages like jest-matchers
• make consumers provide the babel global runtime (but gives a pretty bad DX)

Should be noted that this proposed solution needs the consumer to install babel-runtime. This should be documented when browser support is made public.

Test plan

Do a beta build and test on ReactTraining/react-media#61

[codecov-io]

Codecov Report

Merging #3476 into master will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##           master    #3476   +/-   ##
=======================================
  Coverage   62.23%   62.23%           
=======================================
  Files         181      181           
  Lines        6692     6692           
  Branches        5        5           
=======================================
  Hits         4165     4165           
  Misses       2525     2525           
  Partials        2        2

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update e9e7772...4ff0fbc. Read the comment docs.

[cpojer]

Seems reasonable :)

[skovhus]

@cpojer will you do a beta release of this?

[cpojer]

Published jest@19.3.0-alpha.85402254 just for you.

[SimenB]

Seems like ansi-styles uses some syntax phantom is not happy about.

https://travis-ci.org/ReactTraining/react-media/builds/229092780#L786-L787
https://travis-ci.org/ReactTraining/react-media/builds/229092780#L805-L806

[thymikee]

If I remember correctly, the problem is that chalk and ansi-styles assume they have process global available. This is how they handle it on Prettier docs (prettier uses jest-validate with chalk included) – https://github.com/prettier/prettier/blob/master/docs/rollup.config.js.

[skovhus]

So should we actually do a rollup build instead of babel for es5/browser? That might solve these issues. And make the babel runtime dependency hidden.

[SimenB]

We should also add a test to this repo that runs in a browser

[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.