Use Object.assign instead of Babel _extends (facebook#745)

Summary: **Summary** All React Native JavaScript runtimes, as well as Node, implement `Object.assign()`. This PR removes the transform and configures plugins to use `Object.assign` instead of injecting the Babel helper `_extends()`. This simplifies the generated code, and it aligns JavaScriptCore users more closely with Hermes, which doesn't use several of the plugins. The following plugins generate code using `Object.assign` directly: - `transform-destructuring` - `proposal-object-rest-spread` - `transform-react-jsx` **Test plan** I added a unit test to verify the new behavior. The Babel `_extends` helper already uses Object.assign if it exists, so the runtime behavior will be identical. ``` _extends = Object.assign || function (target) { ... } ``` Pull Request resolved: facebook#745 Reviewed By: motiz88 Differential Revision: D34074342 Pulled By: rh389 fbshipit-source-id: dc416d9b40877da49f6966c5c6708b99fa0ce492
nevilm-lt · Mar 14, 2022 · a1ca24c · a1ca24c
1 parent 9f77c78
commit a1ca24c
Show file tree

Hide file tree

Showing 5 changed files with 95 additions and 52 deletions.
diff --git a/packages/metro-react-native-babel-preset/package.json b/packages/metro-react-native-babel-preset/package.json
@@ -42,7 +42,6 @@
     "@babel/plugin-transform-function-name": "^7.0.0",
     "@babel/plugin-transform-literals": "^7.0.0",
     "@babel/plugin-transform-modules-commonjs": "^7.0.0",
-    "@babel/plugin-transform-object-assign": "^7.0.0",
     "@babel/plugin-transform-parameters": "^7.0.0",
     "@babel/plugin-transform-react-display-name": "^7.0.0",
     "@babel/plugin-transform-react-jsx": "^7.0.0",

diff --git a/packages/metro-react-native-babel-preset/src/configs/main.js b/packages/metro-react-native-babel-preset/src/configs/main.js
@@ -53,7 +53,9 @@ const getPreset = (src, options) => {
 
   const extraPlugins = [];
   if (!options.useTransformReactJSXExperimental) {
-    extraPlugins.push([require('@babel/plugin-transform-react-jsx')]);
+    extraPlugins.push([
+      require('@babel/plugin-transform-react-jsx', {useBuiltIns: true}),
+    ]);
   }
 
   if (!options || !options.disableImportExportTransform) {
@@ -96,15 +98,18 @@ const getPreset = (src, options) => {
     extraPlugins.push([require('@babel/plugin-transform-sticky-regex')]);
   }
   if (!isHermesCanary) {
-    extraPlugins.push([require('@babel/plugin-transform-destructuring')]);
+    extraPlugins.push([
+      require('@babel/plugin-transform-destructuring'),
+      {useBuiltIns: true},
+    ]);
   }
   if (!isHermes && (isNull || hasClass || src.indexOf('...') !== -1)) {
     extraPlugins.push(
       [require('@babel/plugin-transform-spread')],
       [
         require('@babel/plugin-proposal-object-rest-spread'),
         // Assume no dependence on getters or evaluation order. See https://github.com/babel/babel/pull/11520
-        {loose: true},
+        {loose: true, useBuiltIns: true},
       ],
     );
   }
@@ -129,9 +134,6 @@ const getPreset = (src, options) => {
       require('@babel/plugin-transform-exponentiation-operator'),
     ]);
   }
-  if (!isHermes && (isNull || src.indexOf('Object.assign')) !== -1) {
-    extraPlugins.push([require('@babel/plugin-transform-object-assign')]);
-  }
   if (!isHermes && hasForOf) {
     extraPlugins.push([
       require('@babel/plugin-transform-for-of'),

diff --git a/packages/metro/src/integration_tests/__tests__/__snapshots__/buildGraph-test.js.snap b/packages/metro/src/integration_tests/__tests__/__snapshots__/buildGraph-test.js.snap
@@ -13,6 +13,7 @@ Array [
 
   var TypeScript = _$$_REQUIRE(_dependencyMap[2]);
 
+  Object.keys(Object.assign({}, Bar));
   module.exports = {
     Foo: Foo,
     Bar: Bar,
@@ -25,7 +26,7 @@ Array [
           "<global>",
         ],
       },
-      "lineCount": 15,
+      "lineCount": 16,
       "map": Array [
         Array [
           2,
@@ -152,14 +153,14 @@ Array [
           0,
           18,
           0,
-          "module",
+          "Object",
         ],
         Array [
           10,
           2,
           18,
           0,
-          "module",
+          "Object",
         ],
         Array [
           10,
@@ -172,123 +173,169 @@ Array [
           9,
           18,
           7,
-          "exports",
+          "keys",
         ],
         Array [
           10,
-          16,
+          13,
           18,
           0,
         ],
         Array [
           10,
-          19,
+          32,
           18,
-          17,
+          16,
+          "Bar",
+        ],
+        Array [
+          10,
+          35,
+          18,
+          0,
         ],
         Array [
           11,
           0,
-          18,
+          20,
+          0,
+          "module",
+        ],
+        Array [
+          11,
+          2,
+          20,
+          0,
+          "module",
+        ],
+        Array [
+          11,
+          8,
+          20,
+          6,
+        ],
+        Array [
+          11,
+          9,
+          20,
+          7,
+          "exports",
+        ],
+        Array [
+          11,
+          16,
+          20,
+          0,
+        ],
+        Array [
+          11,
+          19,
+          20,
+          17,
+        ],
+        Array [
+          12,
+          0,
+          20,
           18,
           "Foo",
         ],
         Array [
-          11,
+          12,
           4,
-          18,
+          20,
           18,
           "Foo",
         ],
         Array [
-          11,
+          12,
           7,
-          18,
+          20,
           21,
         ],
         Array [
-          11,
+          12,
           9,
-          18,
+          20,
           18,
           "Foo",
         ],
         Array [
-          11,
           12,
-          18,
+          12,
+          20,
           17,
         ],
         Array [
-          12,
+          13,
           0,
-          18,
+          20,
           23,
           "Bar",
         ],
         Array [
-          12,
+          13,
           4,
-          18,
+          20,
           23,
           "Bar",
         ],
         Array [
-          12,
+          13,
           7,
-          18,
+          20,
           26,
         ],
         Array [
-          12,
+          13,
           9,
-          18,
+          20,
           23,
           "Bar",
         ],
         Array [
+          13,
           12,
-          12,
-          18,
+          20,
           17,
         ],
         Array [
-          13,
+          14,
           0,
-          18,
+          20,
           28,
           "TypeScript",
         ],
         Array [
-          13,
+          14,
           4,
-          18,
+          20,
           28,
           "TypeScript",
         ],
         Array [
-          13,
           14,
-          18,
+          14,
+          20,
           38,
         ],
         Array [
-          13,
+          14,
           16,
-          18,
+          20,
           28,
           "TypeScript",
         ],
         Array [
-          14,
+          15,
           0,
-          18,
+          20,
           17,
         ],
         Array [
-          14,
+          15,
           3,
-          18,
+          20,
           0,
         ],
       ],

diff --git a/packages/metro/src/integration_tests/basic_bundle/TestBundle.js b/packages/metro/src/integration_tests/basic_bundle/TestBundle.js
@@ -15,4 +15,6 @@ const Foo = require('./Foo');
 // $FlowFixMe: Flow doesn't understand TypeScript
 const TypeScript = require('./TypeScript');
 
+Object.keys({...Bar});
+
 module.exports = {Foo, Bar, TypeScript};
diff --git a/yarn.lock b/yarn.lock
@@ -682,13 +682,6 @@
     "@babel/helper-simple-access" "^7.13.12"
     babel-plugin-dynamic-import-node "^2.3.3"
 
-"@babel/plugin-transform-object-assign@^7.0.0":
-  version "7.12.13"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-assign/-/plugin-transform-object-assign-7.12.13.tgz#d9b9200a69e03403a813e44a933ad9f4bddfd050"
-  integrity sha512-4QxDMc0lAOkIBSfCrnSGbAJ+4epDBF2XXwcLXuBcG1xl9u7LrktNVD4+LwhL47XuKVPQ7R25e/WdcV+h97HyZA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.12.13"
-
 "@babel/plugin-transform-object-super@^7.0.0":
   version "7.12.13"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.12.13.tgz#b4416a2d63b8f7be314f3d349bd55a9c1b5171f7"