fix: correct babel plugin default signature to allow any source of 'l…

…oadable' (#972) * fix: correct babel plugin default signature to allow any source of 'loadable', fixes #971 * Update packages/babel-plugin/src/index.js
gregberge · Jul 19, 2023 · 19849b6 · 19849b6
1 parent 0e4b57f
commit 19849b6
Show file tree

Hide file tree

Showing 4 changed files with 70 additions and 6 deletions.
diff --git a/packages/babel-plugin/src/__snapshots__/index.test.js.snap b/packages/babel-plugin/src/__snapshots__/index.test.js.snap
@@ -586,6 +586,63 @@ loadable({
 });"
 `;
 
+exports[`plugin custom signatures (default) should support old named import 1`] = `
+"import loadable from './loadable-utils';
+loadable({
+  resolved: {},
+
+  chunkName() {
+    return \`ModA\`.replace(/[^a-zA-Z0-9_!§$()=\\\\-^°]+/g, \\"-\\");
+  },
+
+  isReady(props) {
+    const key = this.resolve(props);
+
+    if (this.resolved[key] !== true) {
+      return false;
+    }
+
+    if (typeof __webpack_modules__ !== 'undefined') {
+      return !!__webpack_modules__[key];
+    }
+
+    return false;
+  },
+
+  importAsync: () => import(
+  /* webpackChunkName: \\"ModA\\" */
+  \`./ModA\`),
+
+  requireAsync(props) {
+    const key = this.resolve(props);
+    this.resolved[key] = false;
+    return this.importAsync(props).then(resolved => {
+      this.resolved[key] = true;
+      return resolved;
+    });
+  },
+
+  requireSync(props) {
+    const id = this.resolve(props);
+
+    if (typeof __webpack_require__ !== 'undefined') {
+      return __webpack_require__(id);
+    }
+
+    return eval('module.require')(id);
+  },
+
+  resolve() {
+    if (require.resolveWeak) {
+      return require.resolveWeak(\`./ModA\`);
+    }
+
+    return eval('require.resolve')(\`./ModA\`);
+  }
+
+});"
+`;
+
 exports[`plugin custom signatures named signature should not match default import 1`] = `
 "import myLoadable from 'myLoadablePackage';
 myLoadable(() => import(\`./ModA\`));"

diff --git a/packages/babel-plugin/src/index.js b/packages/babel-plugin/src/index.js
@@ -20,12 +20,11 @@ const properties = [
 
 const LOADABLE_COMMENT = '#__LOADABLE__'
 
+const DEFAULT_SIGNATURE = [{name: 'default', from: '@loadable/component'}];
+
 const loadablePlugin = declare((api, { 
-  signatures = []
+  signatures = DEFAULT_SIGNATURE
  }) => {
-  if (!signatures.find(sig => sig.from == '@loadable/component')) {
-    signatures.push({name: 'default', from: '@loadable/component'})
-  }
   const { types: t } = api
 
   function collectImportCallPaths(startPath) {
@@ -124,7 +123,8 @@ const loadablePlugin = declare((api, {
       Program: {
         enter(programPath) {
           let lazyImportSpecifier = false
-          const loadableSpecifiers = []
+          // default to "loadable" detection. Remove defaults if signatures are configured
+          const loadableSpecifiers = signatures === DEFAULT_SIGNATURE ? ['loadable']: [];
 
           programPath.traverse({
             ImportDefaultSpecifier(path) {

diff --git a/packages/babel-plugin/src/index.test.js b/packages/babel-plugin/src/index.test.js
@@ -203,6 +203,13 @@ describe('plugin', () => {
   })
 
   describe('custom signatures', () => {
+    it('(default) should support old named import', () => {
+      const result = testPlugin(`
+        import loadable from './loadable-utils'
+        loadable(() => import(\`./ModA\`))
+      `)
+      expect(result).toMatchSnapshot()
+    });
     it('should match simple default import', () => {
       const result = testPlugin(`
         import loadable from '@loadable/component'

diff --git a/packages/server/src/ChunkExtractor.test.js b/packages/server/src/ChunkExtractor.test.js
@@ -45,7 +45,7 @@ describe('ChunkExtrator', () => {
         statsFile: path.resolve(__dirname, '../__fixtures__/stats.json'),
       })
 
-      expect(extractor.stats).toBe(stats)
+      expect(extractor.stats).toEqual(stats)
     })
   })