Add coalescing plugin to CRA v3 (codesandbox#3264)

Author: CompuIves

packages/app/package.json

@@ -226,6 +226,7 @@
     "@babel/core": "^7.5.5",
     "@babel/helper-module-imports": "^7.0.0",
     "@babel/plugin-proposal-class-properties": "^7.5.5",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.7.4",
     "@babel/plugin-proposal-object-rest-spread": "^7.5.5",
     "@babel/plugin-proposal-optional-chaining": "^7.7.4",
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",

packages/app/src/sandbox/eval/presets/create-react-app/v3.ts

@@ -52,6 +52,7 @@ const BABEL7_CONFIG = {
       ['proposal-decorators', { legacy: true }],
       '@babel/plugin-transform-react-jsx-source',
       '@babel/plugin-proposal-optional-chaining',
+      '@babel/plugin-proposal-nullish-coalescing-operator',
       'transform-flow-strip-types',
       'transform-destructuring',
       'babel-plugin-macros',

packages/app/src/sandbox/eval/transpilers/babel/worker/babel-worker.js

@@ -3,6 +3,7 @@ import { flatten } from 'lodash-es';
 import codeFrame from 'babel-code-frame';
 import macrosPlugin from 'babel-plugin-macros';
 import chainingPlugin from '@babel/plugin-proposal-optional-chaining';
+import coalescingPlugin from '@babel/plugin-proposal-nullish-coalescing-operator';
 
 import delay from '@codesandbox/common/lib/utils/delay';
 
@@ -634,6 +635,23 @@ self.addEventListener('message', async event => {
       Babel.registerPlugin('proposal-optional-chaining', chainingPlugin);
     }
 
+    const coalescingInPlugins =
+      flattenedPlugins.indexOf('proposal-nullish-coalescing-operator') > -1 ||
+      flattenedPlugins.indexOf(
+        '@babel/plugin-proposal-nullish-coalescing-operator'
+      ) > -1;
+    if (
+      coalescingInPlugins &&
+      Object.keys(Babel.availablePlugins).indexOf(
+        'proposal-nullish-coalescing-operator'
+      ) === -1
+    ) {
+      Babel.registerPlugin(
+        'proposal-nullish-coalescing-operator',
+        coalescingPlugin
+      );
+    }
+
     if (
       flattenedPlugins.indexOf('transform-cx-jsx') > -1 &&
       Object.keys(Babel.availablePlugins).indexOf('transform-cx-jsx') === -1

yarn.lock

@@ -404,6 +404,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-json-strings" "^7.2.0"
 
+"@babel/plugin-proposal-nullish-coalescing-operator@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-nullish-coalescing-operator/-/plugin-proposal-nullish-coalescing-operator-7.7.4.tgz#7db302c83bc30caa89e38fee935635ef6bd11c28"
+  integrity sha512-TbYHmr1Gl1UC7Vo2HVuj/Naci5BEGNZ0AJhzqD2Vpr6QPFWpUmBRLrIDjedzx7/CShq0bRDS2gI4FIs77VHLVQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/plugin-syntax-nullish-coalescing-operator" "^7.7.4"
+
 "@babel/[email protected]":
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.0.0.tgz#9a17b547f64d0676b6c9cecd4edf74a82ab85e7e"
@@ -505,6 +513,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-nullish-coalescing-operator@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-nullish-coalescing-operator/-/plugin-syntax-nullish-coalescing-operator-7.7.4.tgz#e53b751d0c3061b1ba3089242524b65a7a9da12b"
+  integrity sha512-XKh/yIRPiQTOeBg0QJjEus5qiSKucKAiApNtO1psqG7D17xmE+X2i5ZqBEuSvo0HRuyPaKaSN/Gy+Ha9KFQolw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.0.0"
+
 "@babel/plugin-syntax-object-rest-spread@^7.0.0", "@babel/plugin-syntax-object-rest-spread@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest-spread-7.2.0.tgz#3b7a3e733510c57e820b9142a6579ac8b0dfad2e"