WIP: refactor loadable

src/loadable/assignImportedComponents.ts

@@ -3,7 +3,7 @@ import { Promised } from '../types';
 import { assignMetaData } from './metadata';
 import { done } from './pending';
 import { LOADABLE_SIGNATURE } from './registry';
-import { toLoadable } from './toLoadable';
+import {getLoadable} from "./loadable";
 
 type ImportedDefinition = [Promised<any>, string, string, boolean];
 
@@ -15,7 +15,7 @@ export const assignImportedComponents = (set: ImportedDefinition[]) => {
 
   set.forEach((imported) => {
     const allowAutoLoad = !(imported[3] || !settings.fileFilter(imported[2]));
-    const loadable = toLoadable(imported[0], allowAutoLoad);
+    const loadable = getLoadable(imported[0], allowAutoLoad);
     assignMetaData(loadable.mark, loadable, imported[1], imported[2]);
   });
 

src/loadable/loadable.ts

@@ -28,7 +28,7 @@ export function executeLoadable(importFunction: DefaultImport<any> | Loadable<an
  * @internal
  * @param importFunction
  */
-export function getLoadable<T>(importFunction: DefaultImport<T> | Loadable<T>): Loadable<T> {
+export function getLoadable<T>(importFunction: DefaultImport<T> | Loadable<T>, autoImport: boolean = true): Loadable<T> {
   if ('resolution' in importFunction) {
     return importFunction;
   }
@@ -77,7 +77,7 @@ export function getLoadable<T>(importFunction: DefaultImport<T> | Loadable<T>):
     });
   }
 
-  const loadable = toLoadable(importFunction as any);
+  const loadable = toLoadable(importFunction as any, autoImport);
   LOADABLE_WEAK_SIGNATURE.set(importFunction, loadable);
 
   return loadable as any;

src/loadable/marks.ts

@@ -52,6 +52,8 @@ export const rehydrateMarks = (marks?: string[]): Promise<unknown> => {
 
   const usedMarks = new Set<string>();
 
+  console.log({rehydratedMarks,LOADABLE_MARKS })
+
   LOADABLE_MARKS.forEach(({ mark, loadable }) => {
     if (markerOverlap(mark, rehydratedMarks)) {
       mark.forEach((m) => usedMarks.add(m));

src/loadable/pending.ts

@@ -22,6 +22,7 @@ export const isItReady = (): boolean => readyFlag;
  * waits for all necessary imports to be fulfilled
  */
 export const done = (): Promise<void> => {
+  console.log('pending:', pending.length);
   if (pending.length) {
     readyFlag = false;
 

src/loadable/toLoadable.ts

@@ -14,6 +14,10 @@ export interface InnerLoadable<T> extends Loadable<T> {
   _probeChanges(): Promise<boolean>;
 }
 
+/**
+ * @deprecated to be used only inside {@link getLoadable}
+ * @internal
+ */
 export function toLoadable<T>(firstImportFunction: Promised<T>, autoImport = true): Loadable<T> {
   let importFunction = firstImportFunction;
   const loadImportedComponent = (): Promise<T> =>
@@ -116,6 +120,7 @@ export function toLoadable<T>(firstImportFunction: Promised<T>, autoImport = tru
 
     load() {
       if (!this.promise) {
+        console.log('loading', importFunction);
         const promise = (this.promise = loadImportedComponent().then(
           (payload) => {
             this.done = true;