feat(compiler): support ESM for isolatedModules: false (#2269)

Related to #1709

Author: ahnpnl

src/__helpers__/path.ts

@@ -11,3 +11,5 @@ export function tempDir(ns: string): string {
 
   return dir
 }
+
+export const mockFolder = join(process.cwd(), 'src', '__mocks__')

src/__helpers__/processed-source.ts

@@ -2,6 +2,8 @@ import { isAbsolute, relative } from 'path'
 
 import type { RawSourceMap } from 'source-map'
 
+import { SOURCE_MAPPING_PREFIX } from '../compiler/compiler-utils'
+
 import { ROOT } from './path'
 import { ParsedSourceWithMaps, parseSource, relativisePaths, rewriteSourceMaps } from './source-maps'
 
@@ -19,7 +21,7 @@ export default class ProcessedSource {
     return parseSource(this.output)
   }
   get outputCodeWithoutMaps(): string {
-    return this.parsedSource.source
+    return this.output.substring(0, this.output.indexOf(SOURCE_MAPPING_PREFIX))
   }
   get outputSourceMaps(): RawSourceMap | undefined {
     return this.parsedSource.sourceMaps

src/compiler/__snapshots__/ts-compiler.spec.ts.snap

@@ -1,39 +1,17 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`TsCompiler isolatedModule false allowJs option should compile js file for allowJs true with outDir 1`] = `
-  ===[ FILE: test-allow-js.js ]===================================================
-  "use strict";
-  Object.defineProperty(exports, "__esModule", { value: true });
-  exports.default = 42;
-  //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJmaWxlIjoidGVzdC1hbGxvdy1qcy5qcyIsIm1hcHBpbmdzIjoiOztBQUFBLGtCQUFlLEVBQUUsQ0FBQSIsIm5hbWVzIjpbXSwic291cmNlcyI6WyJ0ZXN0LWFsbG93LWpzLmpzIl0sInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBkZWZhdWx0IDQyIl0sInZlcnNpb24iOjN9
-  ===[ INLINE SOURCE MAPS ]=======================================================
-  file: test-allow-js.js
-  mappings: ';;AAAA,kBAAe,EAAE,CAAA'
-  names: []
-  sources:
-    - test-allow-js.js
-  sourcesContent:
-    - export default 42
-  version: 3
-  ================================================================================
+"\\"use strict\\";
+Object.defineProperty(exports, \\"__esModule\\", { value: true });
+exports.default = 42;
+//# "
 `;
 
 exports[`TsCompiler isolatedModule false allowJs option should compile js file for allowJs true without outDir 1`] = `
-  ===[ FILE: test-allow-js.js ]===================================================
-  "use strict";
-  Object.defineProperty(exports, "__esModule", { value: true });
-  exports.default = 42;
-  //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJmaWxlIjoidGVzdC1hbGxvdy1qcy5qcyIsIm1hcHBpbmdzIjoiOztBQUFBLGtCQUFlLEVBQUUsQ0FBQSIsIm5hbWVzIjpbXSwic291cmNlcyI6WyJ0ZXN0LWFsbG93LWpzLmpzIl0sInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBkZWZhdWx0IDQyIl0sInZlcnNpb24iOjN9
-  ===[ INLINE SOURCE MAPS ]=======================================================
-  file: test-allow-js.js
-  mappings: ';;AAAA,kBAAe,EAAE,CAAA'
-  names: []
-  sources:
-    - test-allow-js.js
-  sourcesContent:
-    - export default 42
-  version: 3
-  ================================================================================
+"\\"use strict\\";
+Object.defineProperty(exports, \\"__esModule\\", { value: true });
+exports.default = 42;
+//# "
 `;
 
 exports[`TsCompiler isolatedModule false diagnostics should throw error when cannot compile 1`] = `
@@ -55,131 +33,54 @@ Array [
 `;
 
 exports[`TsCompiler isolatedModule false jsx option should compile tsx file for jsx preserve 1`] = `
-  ===[ FILE: test-jsx.tsx ]=======================================================
-  "use strict";
-  const App = () => {
-      return <>Test</>;
-  };
-  //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJmaWxlIjoidGVzdC1qc3gudHN4IiwibWFwcGluZ3MiOiI7QUFDUSxNQUFNLEdBQUcsR0FBRyxHQUFHLEVBQUU7SUFDZixPQUFPLEVBQUUsSUFBSSxHQUFHLENBQUE7QUFDbEIsQ0FBQyxDQUFBIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbInRlc3QtanN4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJcbiAgICAgICAgY29uc3QgQXBwID0gKCkgPT4ge1xuICAgICAgICAgIHJldHVybiA8PlRlc3Q8Lz5cbiAgICAgICAgfVxuICAgICAgIl0sInZlcnNpb24iOjN9
-  ===[ INLINE SOURCE MAPS ]=======================================================
-  file: test-jsx.tsx
-  mappings: ';AACQ,MAAM,GAAG,GAAG,GAAG,EAAE;IACf,OAAO,EAAE,IAAI,GAAG,CAAA;AAClB,CAAC,CAAA'
-  names: []
-  sources:
-    - test-jsx.tsx
-  sourcesContent:
-    - |2-
-  
-              const App = () => {
-                return <>Test</>
-              }
-            
-  version: 3
-  ================================================================================
+"\\"use strict\\";
+const App = () => {
+    return <>Test</>;
+};
+//# "
 `;
 
 exports[`TsCompiler isolatedModule false jsx option should compile tsx file for other jsx options 1`] = `
-  ===[ FILE: test-jsx.tsx ]=======================================================
-  "use strict";
-  const App = () => {
-      return React.createElement(React.Fragment, null, "Test");
-  };
-  //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJmaWxlIjoidGVzdC1qc3gudHN4IiwibWFwcGluZ3MiOiI7QUFDUSxNQUFNLEdBQUcsR0FBRyxHQUFHLEVBQUU7SUFDZixPQUFPLGlEQUFTLENBQUE7QUFDbEIsQ0FBQyxDQUFBIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbInRlc3QtanN4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJcbiAgICAgICAgY29uc3QgQXBwID0gKCkgPT4ge1xuICAgICAgICAgIHJldHVybiA8PlRlc3Q8Lz5cbiAgICAgICAgfVxuICAgICAgIl0sInZlcnNpb24iOjN9
-  ===[ INLINE SOURCE MAPS ]=======================================================
-  file: test-jsx.tsx
-  mappings: ';AACQ,MAAM,GAAG,GAAG,GAAG,EAAE;IACf,OAAO,iDAAS,CAAA;AAClB,CAAC,CAAA'
-  names: []
-  sources:
-    - test-jsx.tsx
-  sourcesContent:
-    - |2-
-  
-              const App = () => {
-                return <>Test</>
-              }
-            
-  version: 3
-  ================================================================================
+"\\"use strict\\";
+const App = () => {
+    return React.createElement(React.Fragment, null, \\"Test\\");
+};
+//# "
+`;
+
+exports[`TsCompiler isolatedModule false should compile codes with useESM true 1`] = `
+"export const thing = { a: 1, b: 2 };
+//# "
 `;
 
 exports[`TsCompiler isolatedModule true diagnostics should report diagnostics related to codes with pathRegex config is undefined 1`] = `"foo.ts(2,23): error TS1005: '=>' expected."`;
 
 exports[`TsCompiler isolatedModule true diagnostics should report diagnostics related to codes with pathRegex config matches file name 1`] = `"foo.ts(2,23): error TS1005: '=>' expected."`;
 
 exports[`TsCompiler isolatedModule true jsx option should compile tsx file for jsx preserve 1`] = `
-  ===[ FILE: foo.tsx ]============================================================
-  "use strict";
-  const App = () => {
-      return <>Test</>;
-  };
-  //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJmaWxlIjoiZm9vLnRzeCIsIm1hcHBpbmdzIjoiO0FBQ1EsTUFBTSxHQUFHLEdBQUcsR0FBRyxFQUFFO0lBQ2YsT0FBTyxFQUFFLElBQUksR0FBRyxDQUFBO0FBQ2xCLENBQUMsQ0FBQSIsIm5hbWVzIjpbXSwic291cmNlcyI6WyJmb28udHN4Il0sInNvdXJjZXNDb250ZW50IjpbIlxuICAgICAgICBjb25zdCBBcHAgPSAoKSA9PiB7XG4gICAgICAgICAgcmV0dXJuIDw+VGVzdDwvPlxuICAgICAgICB9XG4gICAgICAiXSwidmVyc2lvbiI6M30=
-  ===[ INLINE SOURCE MAPS ]=======================================================
-  file: foo.tsx
-  mappings: ';AACQ,MAAM,GAAG,GAAG,GAAG,EAAE;IACf,OAAO,EAAE,IAAI,GAAG,CAAA;AAClB,CAAC,CAAA'
-  names: []
-  sources:
-    - foo.tsx
-  sourcesContent:
-    - |2-
-  
-              const App = () => {
-                return <>Test</>
-              }
-            
-  version: 3
-  ================================================================================
+"\\"use strict\\";
+const App = () => {
+    return <>Test</>;
+};
+//# "
 `;
 
 exports[`TsCompiler isolatedModule true jsx option should compile tsx file for other jsx options 1`] = `
-  ===[ FILE: foo.tsx ]============================================================
-  "use strict";
-  const App = () => {
-      return React.createElement(React.Fragment, null, "Test");
-  };
-  //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJmaWxlIjoiZm9vLnRzeCIsIm1hcHBpbmdzIjoiO0FBQ1EsTUFBTSxHQUFHLEdBQUcsR0FBRyxFQUFFO0lBQ2YsT0FBTyxpREFBUyxDQUFBO0FBQ2xCLENBQUMsQ0FBQSIsIm5hbWVzIjpbXSwic291cmNlcyI6WyJmb28udHN4Il0sInNvdXJjZXNDb250ZW50IjpbIlxuICAgICAgICBjb25zdCBBcHAgPSAoKSA9PiB7XG4gICAgICAgICAgcmV0dXJuIDw+VGVzdDwvPlxuICAgICAgICB9XG4gICAgICAiXSwidmVyc2lvbiI6M30=
-  ===[ INLINE SOURCE MAPS ]=======================================================
-  file: foo.tsx
-  mappings: ';AACQ,MAAM,GAAG,GAAG,GAAG,EAAE;IACf,OAAO,iDAAS,CAAA;AAClB,CAAC,CAAA'
-  names: []
-  sources:
-    - foo.tsx
-  sourcesContent:
-    - |2-
-  
-              const App = () => {
-                return <>Test</>
-              }
-            
-  version: 3
-  ================================================================================
+"\\"use strict\\";
+const App = () => {
+    return React.createElement(React.Fragment, null, \\"Test\\");
+};
+//# "
 `;
 
 exports[`TsCompiler isolatedModule true should compile js file for allowJs true 1`] = `
-  ===[ FILE: foo.js ]=============================================================
-  "use strict";
-  Object.defineProperty(exports, "__esModule", { value: true });
-  exports.default = 42;
-  //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJmaWxlIjoiZm9vLmpzIiwibWFwcGluZ3MiOiI7O0FBQUEsa0JBQWUsRUFBRSxDQUFBIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbImZvby5qcyJdLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgZGVmYXVsdCA0MiJdLCJ2ZXJzaW9uIjozfQ==
-  ===[ INLINE SOURCE MAPS ]=======================================================
-  file: foo.js
-  mappings: ';;AAAA,kBAAe,EAAE,CAAA'
-  names: []
-  sources:
-    - foo.js
-  sourcesContent:
-    - export default 42
-  version: 3
-  ================================================================================
+"\\"use strict\\";
+Object.defineProperty(exports, \\"__esModule\\", { value: true });
+exports.default = 42;
+//# "
 `;
 
-exports[`TsCompiler isolatedModule true support ESM should transpile codes to correct syntax with supportsStaticESM and useESM options 1`] = `99`;
-
-exports[`TsCompiler isolatedModule true support ESM should transpile codes to correct syntax with supportsStaticESM and useESM options 2`] = `99`;
-
-exports[`TsCompiler isolatedModule true support ESM should transpile codes to correct syntax with supportsStaticESM and useESM options 3`] = `99`;
-
-exports[`TsCompiler isolatedModule true support ESM should transpile codes to correct syntax with supportsStaticESM and useESM options 4`] = `1`;
-
-exports[`TsCompiler isolatedModule true support ESM should transpile codes to correct syntax with supportsStaticESM and useESM options 5`] = `1`;
-
-exports[`TsCompiler isolatedModule true support ESM should transpile codes to correct syntax with supportsStaticESM and useESM options 6`] = `1`;
+exports[`TsCompiler isolatedModule true should transpile code with useESM true 1`] = `
+"export const thing = { a: 1, b: 2 };
+//# "
+`;