Fix default interop

Author: CompuIves

packages/app/src/sandbox/eval/transpilers/babel/convert-esmodule/__snapshots__/index.test.ts.snap

@@ -20,7 +20,12 @@ exports.default = $csb__default;
 
 exports[`convert-esmodule can convert default imports 1`] = `
 "var $csb__b = require(\\"./b\\");
-var a = $csb__b.default;
+var a = $_csb__interopRequireDefault($csb__b).default;
+function $_csb__interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : {
+    default: obj
+  };
+}
 "
 `;
 
@@ -84,16 +89,21 @@ var b = $csb__b.a;
 
 exports[`convert-esmodule can handle async code 1`] = `
 "var $csb__test = require(\\"./test\\");
-var T = $csb__test.default;
+var T = $_csb__interopRequireDefault($csb__test).default;
 (async () => {
   const test = await test2();
 });
+function $_csb__interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : {
+    default: obj
+  };
+}
 "
 `;
 
 exports[`convert-esmodule can handle class properties 1`] = `
 "var $csb__test = require(\\"./test\\");
-var T = $csb__test.default;
+var T = $_csb__interopRequireDefault($csb__test).default;
 class T2 {
   a = () => {
     return \\"test\\";
@@ -102,6 +112,11 @@ class T2 {
   c = {}
   static d = \\"\\"
 }
+function $_csb__interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : {
+    default: obj
+  };
+}
 "
 `;
 

packages/app/src/sandbox/eval/transpilers/babel/convert-esmodule/index.test.ts

@@ -105,7 +105,7 @@ describe('convert-esmodule', () => {
     expect(convertEsModule(code)).toMatchSnapshot();
   });
 
-  it.skip('has good perf', () => {
+  it.only('has good perf', () => {
     /* eslint-disable */
     const code = require('./big-file');
 

packages/app/src/sandbox/eval/transpilers/babel/convert-esmodule/index.ts

@@ -10,6 +10,7 @@ import {
   generateExportMemberStatement,
   generateExportStatement,
   generateEsModuleSpecifier,
+  generateInteropRequire,
 } from './utils';
 import { customGenerator } from './generator';
 
@@ -43,6 +44,16 @@ export function convertEsModule(code: string) {
     i++;
   }
 
+  let addedDefaultInterop = false;
+  function addDefaultInterop() {
+    if (addedDefaultInterop) {
+      return;
+    }
+    addedDefaultInterop = true;
+
+    program.body.push(generateInteropRequire());
+  }
+
   for (; i < program.body.length; i++) {
     const statement = program.body[i];
 
@@ -182,10 +193,48 @@ export function convertEsModule(code: string) {
         if (specifier.type === n.ImportDefaultSpecifier) {
           // import Test from 'test';
           // const _test = require('test');
-          // var Test = _test.default;
+          // var Test = interopRequireDefault(_test);
           localName = specifier.local.name;
           importName = 'default';
-        } else if (specifier.type === n.ImportSpecifier) {
+          addDefaultInterop();
+
+          program.body.splice(i, 0, {
+            type: 'VariableDeclaration',
+            kind: 'var',
+            declarations: [
+              {
+                type: 'VariableDeclarator',
+                init: {
+                  type: 'MemberExpression',
+                  object: {
+                    type: 'CallExpression',
+                    callee: {
+                      type: 'Identifier',
+                      name: '$_csb__interopRequireDefault',
+                    },
+                    arguments: [
+                      {
+                        type: 'Identifier',
+                        name: varName,
+                      },
+                    ],
+                  },
+                  computed: false,
+                  property: {
+                    type: 'Identifier',
+                    name: 'default',
+                  },
+                },
+                id: {
+                  type: 'Identifier',
+                  name: localName,
+                },
+              },
+            ],
+          });
+          return;
+        }
+        if (specifier.type === n.ImportSpecifier) {
           // import {Test} from 'test';
           // const _test = require('test');
           // var Test = _test.Test;

packages/app/src/sandbox/eval/transpilers/babel/convert-esmodule/utils.ts

@@ -290,3 +290,76 @@ export function generateEsModuleSpecifier() {
     },
   };
 }
+
+export function generateInteropRequire() {
+  return {
+    type: n.FunctionDeclaration,
+    params: [
+      {
+        type: n.Identifier,
+        name: 'obj' as 'obj',
+      },
+    ],
+    body: {
+      type: n.BlockStatement,
+      body: [
+        {
+          type: n.ReturnStatement,
+          argument: {
+            type: n.ConditionalExpression,
+            test: {
+              type: n.LogicalExpression,
+              left: {
+                type: n.Identifier,
+                name: 'obj',
+              },
+              right: {
+                type: n.MemberExpression,
+                object: {
+                  type: n.Identifier,
+                  name: 'obj',
+                },
+                computed: false,
+                property: {
+                  type: n.Identifier,
+                  name: '__esModule',
+                },
+              },
+              operator: '&&',
+            },
+            consequent: {
+              type: n.Identifier,
+              name: 'obj',
+            },
+            alternate: {
+              type: n.ObjectExpression,
+              properties: [
+                {
+                  type: n.Property,
+                  key: {
+                    type: n.Identifier,
+                    name: 'default',
+                  },
+                  value: {
+                    type: n.Identifier,
+                    name: 'obj',
+                  },
+                  kind: 'init' as 'init',
+                  computed: false,
+                  method: false,
+                  shorthand: false,
+                },
+              ],
+            },
+          },
+        },
+      ],
+    },
+    async: false,
+    generator: false,
+    id: {
+      type: n.Identifier,
+      name: '$_csb__interopRequireDefault',
+    },
+  };
+}