fix: handle circular init shared (#2876)

Author: 2heal1

.changeset/itchy-ducks-crash.md

@@ -0,0 +1,6 @@
+---
+'@module-federation/webpack-bundler-runtime': patch
+'@module-federation/runtime': patch
+---
+
+fix: handle circular init shared

packages/runtime/src/core.ts

@@ -11,6 +11,8 @@ import {
   ShareScopeMap,
   InitScope,
   RemoteEntryInitOptions,
+  InitTokens,
+  CallFrom,
 } from './type';
 import { getBuilderId, registerPlugins } from './utils';
 import { Module } from './module';
@@ -170,9 +172,13 @@ export class FederationHost {
 
   initializeSharing(
     shareScopeName = DEFAULT_SCOPE,
-    strategy?: Shared['strategy'],
+    extraOptions?: {
+      initScope?: InitScope;
+      from?: CallFrom;
+      strategy?: Shared['strategy'];
+    },
   ): Array<Promise<void>> {
-    return this.sharedHandler.initializeSharing(shareScopeName, strategy);
+    return this.sharedHandler.initializeSharing(shareScopeName, extraOptions);
   }
 
   initRawContainer(
@@ -193,7 +199,7 @@ export class FederationHost {
   // eslint-disable-next-line @typescript-eslint/member-ordering
   async loadRemote<T>(
     id: string,
-    options?: { loadFactory?: boolean; from: 'build' | 'runtime' },
+    options?: { loadFactory?: boolean; from: CallFrom },
   ): Promise<T | null> {
     return this.remoteHandler.loadRemote(id, options);
   }

packages/runtime/src/remote/index.ts

@@ -14,6 +14,7 @@ import {
   Remote,
   RemoteInfo,
   RemoteEntryExports,
+  CallFrom,
 } from '../type';
 import { FederationHost } from '../core';
 import {
@@ -97,7 +98,7 @@ export class RemoteHandler {
           id: string;
           error: unknown;
           options?: any;
-          from: 'build' | 'runtime';
+          from: CallFrom;
           lifecycle: 'onLoad' | 'beforeRequest';
           origin: FederationHost;
         },
@@ -178,7 +179,7 @@ export class RemoteHandler {
   // eslint-disable-next-line @typescript-eslint/member-ordering
   async loadRemote<T>(
     id: string,
-    options?: { loadFactory?: boolean; from: 'build' | 'runtime' },
+    options?: { loadFactory?: boolean; from: CallFrom },
   ): Promise<T | null> {
     const { host } = this;
     try {

packages/runtime/src/shared/index.ts

@@ -7,6 +7,9 @@ import {
   RemoteEntryExports,
   UserOptions,
   ShareStrategy,
+  InitScope,
+  InitTokens,
+  CallFrom,
 } from '../type';
 import { FederationHost } from '../core';
 import {
@@ -55,10 +58,11 @@ export class SharedHandler {
       hostShareScopeMap?: ShareScopeMap;
     }>('initContainerShareScopeMap'),
   });
-
+  initTokens: InitTokens;
   constructor(host: FederationHost) {
     this.host = host;
     this.shareScopeMap = {};
+    this.initTokens = {};
     this._setGlobalShareScopeMap(host.options);
   }
 
@@ -121,7 +125,9 @@ export class SharedHandler {
       await Promise.all(
         shareInfo.scope.map(async (shareScope) => {
           await Promise.all(
-            this.initializeSharing(shareScope, shareInfo.strategy),
+            this.initializeSharing(shareScope, {
+              strategy: shareInfo.strategy,
+            }),
           );
           return;
         }),
@@ -242,9 +248,26 @@ export class SharedHandler {
   // eslint-disable-next-line @typescript-eslint/member-ordering
   initializeSharing(
     shareScopeName = DEFAULT_SCOPE,
-    strategy?: ShareStrategy,
+    extraOptions?: {
+      initScope?: InitScope;
+      from?: CallFrom;
+      strategy?: ShareStrategy;
+    },
   ): Array<Promise<void>> {
     const { host } = this;
+    const from = extraOptions?.from;
+    const strategy = extraOptions?.strategy;
+    let initScope = extraOptions?.initScope;
+    const promises: Promise<any>[] = [];
+    if (from !== 'build') {
+      const { initTokens } = this;
+      if (!initScope) initScope = [];
+      let initToken = initTokens[shareScopeName];
+      if (!initToken)
+        initToken = initTokens[shareScopeName] = { from: this.host.name };
+      if (initScope.indexOf(initToken) >= 0) return promises;
+      initScope.push(initToken);
+    }
 
     const shareScope = this.shareScopeMap;
     const hostName = host.options.name;
@@ -274,9 +297,8 @@ export class SharedHandler {
         versions[version] = shared;
       }
     };
-    const promises: Promise<any>[] = [];
     const initFn = (mod: RemoteEntryExports) =>
-      mod && mod.init && mod.init(shareScope[shareScopeName]);
+      mod && mod.init && mod.init(shareScope[shareScopeName], initScope);
 
     const initRemoteModule = async (key: string): Promise<void> => {
       const { module } = await host.remoteHandler.getRemoteModuleAndOptions({
@@ -285,7 +307,7 @@ export class SharedHandler {
       if (module.getEntry) {
         const entry = await module.getEntry();
         if (!module.inited) {
-          initFn(entry);
+          await initFn(entry);
           module.inited = true;
         }
       }
@@ -333,7 +355,7 @@ export class SharedHandler {
 
     if (shareInfo?.scope) {
       shareInfo.scope.forEach((shareScope) => {
-        this.initializeSharing(shareScope, shareInfo.strategy);
+        this.initializeSharing(shareScope, { strategy: shareInfo.strategy });
       });
     }
     const registeredShared = getRegisteredShare(

packages/runtime/src/type/config.ts

@@ -133,8 +133,9 @@ export type RemoteEntryInitOptions = {
   shareScopeMap: ShareScopeMap;
 };
 
-export type InitScope = Array<Record<string, never>>;
-
+export type InitTokens = Record<string, Record<string, any>>;
+export type InitScope = InitTokens[];
+export type CallFrom = 'build' | 'runtime';
 export type RemoteEntryExports = {
   get: (id: string) => () => Promise<Module>;
   init: (

packages/webpack-bundler-runtime/src/initializeSharing.ts

@@ -10,9 +10,12 @@ export function initializeSharing({
   initScope,
 }: InitializeSharingOptions): Promise<boolean> | boolean | void {
   if (!initScope) initScope = [];
+  const mfInstance = webpackRequire.federation.instance!;
+
   // handling circular init calls
   var initToken = initTokens[shareScopeName];
-  if (!initToken) initToken = initTokens[shareScopeName] = {};
+  if (!initToken)
+    initToken = initTokens[shareScopeName] = { from: mfInstance.name };
   if (initScope.indexOf(initToken) >= 0) return;
   initScope.push(initToken);
 
@@ -42,8 +45,11 @@ export function initializeSharing({
       handleError(err);
     }
   };
-  const promises =
-    webpackRequire.federation.instance!.initializeSharing(shareScopeName);
+  const promises = mfInstance.initializeSharing(shareScopeName, {
+    strategy: mfInstance.options.shareStrategy,
+    initScope,
+    from: 'build',
+  });
   attachShareScopeMap(webpackRequire);
 
   const bundlerRuntimeRemotesOptions =