Merge branch 'next' into remove-highlightcode-option

Author: Timer

appveyor.cleanup-cache.txt

@@ -2,6 +2,3 @@ Edit this file to trigger a cache rebuild.
 http://help.appveyor.com/discussions/questions/1310-delete-cache
 
 ----
-
-bump
-cya

appveyor.yml

@@ -1,31 +1,34 @@
 image: Visual Studio 2017
 
 environment:
+  APPVEYOR_SAVE_CACHE_ON_ERROR: true
   matrix:
     - nodejs_version: 10
-      test_suite: "simple"
+      test_suite: 'simple'
     - nodejs_version: 10
-      test_suite: "installs"
+      test_suite: 'installs'
     - nodejs_version: 10
-      test_suite: "kitchensink"
+      test_suite: 'kitchensink'
     - nodejs_version: 10
-      test_suite: "kitchensink-eject"
+      test_suite: 'kitchensink-eject'
     - nodejs_version: 8
-      test_suite: "simple"
+      test_suite: 'simple'
     - nodejs_version: 8
-      test_suite: "installs"
+      test_suite: 'installs'
     - nodejs_version: 8
-      test_suite: "kitchensink"
+      test_suite: 'kitchensink'
     - nodejs_version: 8
-      test_suite: "kitchensink-eject"
+      test_suite: 'kitchensink-eject'
 cache:
-  - node_modules -> appveyor.cleanup-cache.txt
-  - packages\react-scripts\node_modules -> appveyor.cleanup-cache.txt
+  - '%APPDATA%\npm-cache -> appveyor.cleanup-cache.txt'
+  - '%LOCALAPPDATA%\Yarn\Cache -> appveyor.cleanup-cache.txt'
 
 clone_depth: 50
 
 matrix:
   fast_finish: true
+  allow_failures:
+    - test_suite: 'installs'
 
 platform:
   - x64
@@ -46,4 +49,5 @@ test_script:
   - node --version
   - npm --version
   - yarn --version
+  - yarn cache dir
   - bash tasks/e2e-%test_suite%.sh

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-app-polyfill/README.md

@@ -0,0 +1,40 @@
+# react-app-polyfill
+
+This package includes polyfills for various browsers.
+It includes minimum requirements and commonly used language features used by [Create React App](https://github.com/facebook/create-react-app) projects.<br>
+Please refer to its documentation:
+
+- [Getting Started](https://github.com/facebook/create-react-app/blob/master/README.md#getting-started) – How to create a new app.
+- [User Guide](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App.
+
+### Features
+
+Each polyfill ensures the following language features are present:
+
+1. `Promise` (for `async` / `await` support)
+1. `window.fetch` (a Promise-based way to make web requests in the browser)
+1. `Object.assign` (a helper required for Object Spread, i.e. `{ ...a, ...b }`)
+1. `Symbol` (a built-in object used by `for...of` syntax and friends)
+1. `Array.from` (a built-in static method used by array spread, i.e. `[...arr]`)
+
+### Entry Points
+
+You can import the entry point for the minimal version you intend to support. For example, if you import the IE9 entry point, this will include IE10 and IE11 support.
+
+#### Internet Explorer 9
+
+```js
+// This must be the first line in src/index.js
+import 'react-app-polyfill/ie9';
+
+// ...
+```
+
+#### Internet Explorer 11
+
+```js
+// This must be the first line in src/index.js
+import 'react-app-polyfill/ie11';
+
+// ...
+```

packages/react-scripts/config/polyfills.js renamed to packages/react-app-polyfill/ie11.js

@@ -1,11 +1,9 @@
-// @remove-on-eject-begin
 /**
  * Copyright (c) 2015-present, Facebook, Inc.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-// @remove-on-eject-end
 'use strict';
 
 if (typeof Promise === 'undefined') {
@@ -23,8 +21,7 @@ require('whatwg-fetch');
 // It will use the native implementation if it's present and isn't buggy.
 Object.assign = require('object-assign');
 
-// In tests, polyfill requestAnimationFrame since jsdom doesn't provide it yet.
-// We don't polyfill it in the browser--this is user's responsibility.
-if (process.env.NODE_ENV === 'test') {
-  require('raf').polyfill(global);
-}
+// Support for...of (a commonly used syntax feature that requires Symbols)
+require('core-js/es6/symbol');
+// Support iterable spread (...Set, ...Map)
+require('core-js/fn/array/from');

packages/react-app-polyfill/ie9.js

@@ -0,0 +1,32 @@
+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+if (typeof Promise === 'undefined') {
+  // Rejection tracking prevents a common issue where React gets into an
+  // inconsistent state due to an error, but it gets swallowed by a Promise,
+  // and the user has no idea what causes React's erratic future behavior.
+  require('promise/lib/rejection-tracking').enable();
+  window.Promise = require('promise/lib/es6-extensions.js');
+}
+
+// fetch() polyfill for making API calls.
+require('whatwg-fetch');
+
+// Object.assign() is commonly used with React.
+// It will use the native implementation if it's present and isn't buggy.
+Object.assign = require('object-assign');
+
+// Support for...of (a commonly used syntax feature that requires Symbols)
+require('core-js/es6/symbol');
+// Support iterable spread (...Set, ...Map)
+require('core-js/fn/array/from');
+
+// React 16+ relies on Map, Set, and requestAnimationFrame
+require('core-js/es6/map');
+require('core-js/es6/set');
+require('raf').polyfill(window);

packages/react-app-polyfill/jsdom.js

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+// fetch() polyfill for making API calls.
+require('whatwg-fetch');

packages/react-app-polyfill/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "react-app-polyfill",
+  "version": "0.0.0",
+  "description": "Polyfills for various browsers including commonly used language features",
+  "repository": "facebook/create-react-app",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/facebook/create-react-app/issues"
+  },
+  "engines": {
+    "node": ">=6"
+  },
+  "files": [
+    "ie9.js",
+    "ie11.js",
+    "jsdom.js"
+  ],
+  "dependencies": {
+    "core-js": "2.5.7",
+    "object-assign": "4.1.1",
+    "promise": "8.0.2",
+    "raf": "3.4.0",
+    "whatwg-fetch": "3.0.0"
+  }
+}

packages/react-dev-utils/browsersHelper.js

@@ -13,7 +13,12 @@ const inquirer = require('inquirer');
 const pkgUp = require('pkg-up');
 const fs = require('fs');
 
-const defaultBrowsers = ['>0.25%', 'not op_mini all', 'ie 11'];
+const defaultBrowsers = [
+  '>0.2%',
+  'not dead',
+  'not ie <= 11',
+  'not op_mini all',
+];
 
 function shouldSetBrowsers(isInteractive) {
   if (!isInteractive) {

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

@@ -8,7 +8,6 @@
 // @remove-on-eject-end
 'use strict';
 
-const autoprefixer = require('autoprefixer');
 const path = require('path');
 const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
@@ -57,8 +56,11 @@ const getStyleLoaders = (cssOptions, preProcessor) => {
         ident: 'postcss',
         plugins: () => [
           require('postcss-flexbugs-fixes'),
-          autoprefixer({
-            flexbox: 'no-2009',
+          require('postcss-preset-env')({
+            autoprefixer: {
+              flexbox: 'no-2009',
+            },
+            stage: 3,
           }),
         ],
       },
@@ -80,10 +82,7 @@ module.exports = {
   devtool: 'cheap-module-source-map',
   // These are the "entry points" to our application.
   // This means they will be the "root" imports that are included in JS bundle.
-  // The first two entry points enable "hot" CSS and auto-refreshes for JS.
   entry: [
-    // We ship a few polyfills by default:
-    require.resolve('./polyfills'),
     // Include an alternative client for WebpackDevServer. A client's job is to
     // connect to WebpackDevServer by a socket and get notified about changes.
     // When you save a file, the client will either apply hot updates (in case
@@ -275,6 +274,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 +290,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
@@ -303,6 +306,11 @@ module.exports = {
                     'react-scripts',
                   ]),
                   // @remove-on-eject-end
+                  // If an error happens in a package, it's possible to be
+                  // because it was compiled. Thus, we don't want the browser
+                  // debugger to show the original code. Instead, the code
+                  // being evaluated would be much more helpful.
+                  sourceMaps: false,
                 },
               },
             ],