Turn on Babel helpers (facebook#5093)

* Turn on helpers and test importing something with async/await works

* Compiling babel runtime breaks itself

* Add helpers option to babel plugin with defaults

* Make helpers off by default and on in our configuration

* Hit eject and e2e

* meh

* copy'n'paste

* change again

* Turn off helpers by default in /prod, /dev, /test

* oops

* Spread undefined

* Use object assign not object spread

* Put preset in template since it's needed

* Fix e2e tests

Author: Timer

packages/babel-preset-react-app/create.js

@@ -27,6 +27,7 @@ module.exports = function(api, opts, env) {
   var isEnvProduction = env === 'production';
   var isEnvTest = env === 'test';
   var isFlowEnabled = validateBoolOption('flow', opts.flow, true);
+  var areHelpersEnabled = validateBoolOption('helpers', opts.helpers, true);
 
   if (!isEnvDevelopment && !isEnvProduction && !isEnvTest) {
     throw new Error(
@@ -113,7 +114,7 @@ module.exports = function(api, opts, env) {
         require('@babel/plugin-transform-runtime').default,
         {
           corejs: false,
-          helpers: false,
+          helpers: areHelpersEnabled,
           regenerator: true,
           // https://babeljs.io/docs/en/babel-plugin-transform-runtime#useesmodules
           // We should turn this on once the lowest version of Node LTS

packages/babel-preset-react-app/dependencies.js

@@ -6,6 +6,18 @@
  */
 'use strict';
 
+const validateBoolOption = (name, value, defaultValue) => {
+  if (typeof value === 'undefined') {
+    value = defaultValue;
+  }
+
+  if (typeof value !== 'boolean') {
+    throw new Error(`Preset react-app: '${name}' option must be a boolean.`);
+  }
+
+  return value;
+};
+
 module.exports = function(api, opts) {
   if (!opts) {
     opts = {};
@@ -21,6 +33,7 @@ module.exports = function(api, opts) {
   var isEnvDevelopment = env === 'development';
   var isEnvProduction = env === 'production';
   var isEnvTest = env === 'test';
+  var areHelpersEnabled = validateBoolOption('helpers', opts.helpers, false);
   if (!isEnvDevelopment && !isEnvProduction && !isEnvTest) {
     throw new Error(
       'Using `babel-preset-react-app` requires that you specify `NODE_ENV` or ' +
@@ -76,7 +89,7 @@ module.exports = function(api, opts) {
         require('@babel/plugin-transform-runtime').default,
         {
           corejs: false,
-          helpers: false,
+          helpers: areHelpersEnabled,
           regenerator: true,
           // https://babeljs.io/docs/en/babel-plugin-transform-runtime#useesmodules
           // We should turn this on once the lowest version of Node LTS

packages/babel-preset-react-app/dev.js

@@ -9,5 +9,5 @@
 const create = require('./create');
 
 module.exports = function(api, opts) {
-  return create(api, opts, 'development');
+  return create(api, Object.assign({ helpers: false }, opts), 'development');
 };

packages/babel-preset-react-app/prod.js

@@ -9,5 +9,5 @@
 const create = require('./create');
 
 module.exports = function(api, opts) {
-  return create(api, opts, 'production');
+  return create(api, Object.assign({ helpers: false }, opts), 'production');
 };

packages/babel-preset-react-app/test.js

@@ -9,5 +9,5 @@
 const create = require('./create');
 
 module.exports = function(api, opts) {
-  return create(api, opts, 'test');
+  return create(api, Object.assign({ helpers: false }, opts), 'test');
 };

packages/react-error-overlay/webpack.config.iframe.js

@@ -32,12 +32,15 @@ module.exports = {
           // Dependencies
           {
             test: /\.js$/,
+            exclude: /@babel\/runtime/,
             use: {
               loader: 'babel-loader',
               options: {
                 babelrc: false,
                 compact: false,
-                presets: ['babel-preset-react-app/dependencies'],
+                presets: [
+                  ['babel-preset-react-app/dependencies', { helpers: true }],
+                ],
               },
             },
           },

packages/react-scripts/config/webpack.config.dev.js

@@ -275,6 +275,7 @@ module.exports = {
           // Unlike the application JS, we only compile the standard ES features.
           {
             test: /\.js$/,
+            exclude: /@babel\/runtime/,
             use: [
               // This loader parallelizes code compilation, it is optional but
               // improves compile time on larger projects
@@ -290,7 +291,10 @@ module.exports = {
                   babelrc: false,
                   compact: false,
                   presets: [
-                    require.resolve('babel-preset-react-app/dependencies'),
+                    [
+                      require.resolve('babel-preset-react-app/dependencies'),
+                      { helpers: true },
+                    ],
                   ],
                   cacheDirectory: true,
                   // Don't waste time on Gzipping the cache

packages/react-scripts/config/webpack.config.prod.js

@@ -314,6 +314,7 @@ module.exports = {
           // Unlike the application JS, we only compile the standard ES features.
           {
             test: /\.js$/,
+            exclude: /@babel\/runtime/,
             use: [
               // This loader parallelizes code compilation, it is optional but
               // improves compile time on larger projects
@@ -324,7 +325,10 @@ module.exports = {
                   babelrc: false,
                   compact: false,
                   presets: [
-                    require.resolve('babel-preset-react-app/dependencies'),
+                    [
+                      require.resolve('babel-preset-react-app/dependencies'),
+                      { helpers: true },
+                    ],
                   ],
                   cacheDirectory: true,
                   // Save disk space when time isn't as important

tasks/e2e-kitchensink.sh

@@ -146,8 +146,8 @@ PORT=3001 \
   nohup yarn start &>$tmp_server_log &
 grep -q 'You can now view' <(tail -f $tmp_server_log)
 
-# Before running Mocha, specify that it should use our preset
-# TODO: this is very hacky and we should find some other solution
+# We haven't ejected yet which means there's no `babel` key
+# in package.json yet
 echo '{"presets":["react-app"]}' > .babelrc
 
 # Test "development" environment