fix: wrap member chains to IIFE when it is in parameter default

babel · Sep 3, 2020 · 2e08fd0 · 2e08fd0
1 parent 70e6e73
commit 2e08fd0
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 6 deletions.
diff --git a/packages/babel-helper-member-expression-to-functions/src/index.js b/packages/babel-helper-member-expression-to-functions/src/index.js
@@ -84,7 +84,7 @@ const handle = {
   },
 
   handle(member) {
-    const { node, parent, parentPath } = member;
+    const { node, parent, parentPath, scope } = member;
 
     if (member.isOptionalMemberExpression()) {
       // Transforming optional chaining requires we replace ancestors.
@@ -118,6 +118,17 @@ const handle = {
         return true;
       });
 
+      // Replace `function (a, x = a.b?.#c) {}` to `function (a, x = (() => a.b?.#c)() ){}`
+      // so the temporary variable can be injected in correct scope
+      // This can be further optimized to avoid unecessary IIFE
+      if (scope.path.isPattern()) {
+        endPath.replaceWith(
+          // The injected member will be queued and eventually transformed when visited
+          t.callExpression(t.arrowFunctionExpression([], endPath.node), []),
+        );
+        return;
+      }
+
       const rootParentPath = endPath.parentPath;
       if (
         rootParentPath.isUpdateExpression({ argument: node }) ||
@@ -165,7 +176,6 @@ const handle = {
         );
       }
 
-      const { scope } = member;
       const startingProp = startingOptional.isOptionalMemberExpression()
         ? "object"
         : "callee";
@@ -362,6 +372,16 @@ const handle = {
 
     // MEMBER?.(ARGS) -> _optionalCall(MEMBER, ARGS)
     if (parentPath.isOptionalCallExpression({ callee: node })) {
+      // Replace `function (a, x = a.b.#c?.()) {}` to `function (a, x = (() => a.b.#c?.())() ){}`
+      // so the temporary variable can be injected in correct scope
+      // This can be further optimized to avoid unecessary IIFE
+      if (scope.path.isPattern()) {
+        parentPath.replaceWith(
+          // The injected member will be queued and eventually transformed when visited
+          t.callExpression(t.arrowFunctionExpression([], parentPath.node), []),
+        );
+        return;
+      }
       parentPath.replaceWith(this.optionalCall(member, parent.arguments));
       return;
     }

diff --git a/packages/babel-plugin-proposal-nullish-coalescing-operator/src/index.js b/packages/babel-plugin-proposal-nullish-coalescing-operator/src/index.js
@@ -1,6 +1,6 @@
 import { declare } from "@babel/helper-plugin-utils";
 import syntaxNullishCoalescingOperator from "@babel/plugin-syntax-nullish-coalescing-operator";
-import { types as t } from "@babel/core";
+import { types as t, template } from "@babel/core";
 
 export default declare((api, { loose = false }) => {
   api.assertVersion(7);
@@ -16,13 +16,21 @@ export default declare((api, { loose = false }) => {
           return;
         }
 
-        let ref = scope.maybeGenerateMemoised(node.left);
+        let ref;
         let assignment;
         // skip creating extra reference when `left` is static
-        if (ref === null) {
+        if (scope.isStatic(node.left)) {
           ref = node.left;
           assignment = t.cloneNode(node.left);
+        } else if (scope.path.isPattern()) {
+          // Replace `function (a, x = a.b ?? c) {}` to `function (a, x = (() => a.b ?? c)() ){}`
+          // so the temporary variable can be injected in correct scope
+          path.replaceWith(template.ast`(() => ${path.node})()`);
+          // The injected nullish expression will be queued and eventually transformed when visited
+          return;
         } else {
+          ref = scope.generateUidIdentifierBasedOnNode(node.left);
+          scope.push({ id: t.cloneNode(ref) });
           assignment = t.assignmentExpression("=", ref, node.left);
         }
 

diff --git a/packages/babel-plugin-proposal-optional-chaining/src/index.js b/packages/babel-plugin-proposal-optional-chaining/src/index.js
@@ -4,7 +4,7 @@ import {
   skipTransparentExprWrappers,
 } from "@babel/helper-skip-transparent-expression-wrappers";
 import syntaxOptionalChaining from "@babel/plugin-syntax-optional-chaining";
-import { types as t } from "@babel/core";
+import { types as t, template } from "@babel/core";
 
 export default declare((api, options) => {
   api.assertVersion(7);
@@ -22,6 +22,30 @@ export default declare((api, options) => {
     );
   }
 
+  /**
+   * Test if a given optional chain `path` needs to be memoized
+   * @param {NodePath} path
+   * @returns {boolean}
+   */
+  function needsMemoize(path) {
+    let optionalPath = path;
+    const { scope } = path;
+    while (
+      optionalPath.isOptionalMemberExpression() ||
+      optionalPath.isOptionalCallExpression()
+    ) {
+      const { node } = optionalPath;
+      const childPath = skipTransparentExprWrappers(
+        optionalPath.get("object") ?? optionalPath.get("callee"),
+      );
+      if (node.optional) {
+        return !scope.isStatic(childPath.node);
+      }
+
+      optionalPath = childPath;
+    }
+  }
+
   return {
     name: "proposal-optional-chaining",
     inherits: syntaxOptionalChaining,
@@ -46,6 +70,13 @@ export default declare((api, options) => {
         const optionals = [];
 
         let optionalPath = path;
+        // Replace `function (a, x = a.b?.c) {}` to `function (a, x = (() => a.b?.c)() ){}`
+        // so the temporary variable can be injected in correct scope
+        if (scope.path.isPattern() && needsMemoize(optionalPath)) {
+          path.replaceWith(template.ast`(() => ${path.node})()`);
+          // The injected optional chain will be queued and eventually transformed when visited
+          return;
+        }
         while (
           optionalPath.isOptionalMemberExpression() ||
           optionalPath.isOptionalCallExpression()