@module-federation/bridge-react 0.0.0-next-20250920074657 → 0.0.0-next-20250923081154

package/CHANGELOG.md

@@ -1,11 +1,11 @@
 # @module-federation/bridge-react
 
-## 0.0.0-next-20250920074657
+## 0.0.0-next-20250923081154
 
 ### Patch Changes
 
-- @module-federation/sdk@0.0.0-next-20250920074657
-- @module-federation/bridge-shared@0.0.0-next-20250920074657
+- @module-federation/sdk@0.0.0-next-20250923081154
+- @module-federation/bridge-shared@0.0.0-next-20250923081154
 
 ## 0.19.1
 

package/__tests__/bridge.spec.tsx

@@ -66,12 +66,8 @@ describe('bridge', () => {
     );
     expect(getHtml(container)).toMatch('loading');
 
-    await waitFor(
-      () => {
-        expect(getHtml(container)).toMatch('life cycle render');
-      },
-      { timeout: 1000 },
-    );
+    await sleep(200);
+    expect(getHtml(container)).toMatch('life cycle render');
     expect(getHtml(container)).toMatch('hello world');
   });
 
@@ -101,12 +97,8 @@ describe('bridge', () => {
     );
     expect(getHtml(container)).toMatch('loading');
 
-    await waitFor(
-      () => {
-        expect(getHtml(container)).toMatch('life cycle render');
-      },
-      { timeout: 1000 },
-    );
+    await sleep(200);
+    expect(getHtml(container)).toMatch('life cycle render');
     expect(getHtml(container)).toMatch('hello world');
     expect(ref.current).not.toBeNull();
   });
@@ -139,11 +131,7 @@ describe('bridge', () => {
     const { container } = render(<RemoteComponent />);
     expect(getHtml(container)).toMatch('loading');
 
-    await waitFor(
-      () => {
-        expect(renderMock).toHaveBeenCalledTimes(1);
-      },
-      { timeout: 1000 },
-    );
+    await sleep(200);
+    expect(renderMock).toHaveBeenCalledTimes(1);
   });
 });

package/dist/data-fetch-utils.cjs.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lazyUtils = require("./utils-vIpCrZmn.js");
-const prefetch = require("./prefetch-DfV67tNF.js");
+const prefetch = require("./prefetch-BnEr_VXN.js");
 async function callDataFetch() {
   const dataFetch = globalThis[lazyUtils.DATA_FETCH_FUNCTION];
   if (dataFetch) {

package/dist/data-fetch-utils.es.js

@@ -1,7 +1,7 @@
 import { x as DATA_FETCH_FUNCTION } from "./utils-VSOJTX_o.mjs";
 import { C, b, e, h, c, d, r } from "./utils-VSOJTX_o.mjs";
-import { d as dataFetchFunction } from "./prefetch-BfuXjKtn.mjs";
-import { i, p } from "./prefetch-BfuXjKtn.mjs";
+import { d as dataFetchFunction } from "./prefetch-DIwspSj-.mjs";
+import { i, p } from "./prefetch-DIwspSj-.mjs";
 async function callDataFetch() {
   const dataFetch = globalThis[DATA_FETCH_FUNCTION];
   if (dataFetch) {

package/dist/index.cjs.js

@@ -6,10 +6,10 @@ const React = require("react");
 const index = require("./index-eN2xRRXs.js");
 const ReactRouterDOM = require("react-router-dom");
 const plugin = require("./plugin.cjs.js");
-const lazyLoadComponentPlugin = require("./lazy-load-component-plugin-DFiVXILi.js");
+const lazyLoadComponentPlugin = require("./lazy-load-component-plugin-Br-Tkghx.js");
 const lazyUtils = require("./utils-vIpCrZmn.js");
 const dataFetchUtils = require("./data-fetch-utils.cjs.js");
-const prefetch = require("./prefetch-DfV67tNF.js");
+const prefetch = require("./prefetch-BnEr_VXN.js");
 function _interopNamespaceDefault(e2) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e2) {
@@ -28,37 +28,19 @@ function _interopNamespaceDefault(e2) {
 }
 const ReactRouterDOM__namespace = /* @__PURE__ */ _interopNamespaceDefault(ReactRouterDOM);
 function createReact16Or17Root(container) {
-  const reactVersion = ReactDOM.version || "";
-  const isReact18Plus = reactVersion.startsWith("18") || reactVersion.startsWith("19");
-  if (isReact18Plus) {
-    let modernRoot = null;
-    return {
-      render(children) {
-        if (!modernRoot) {
-          try {
-            const { createRoot } = require("react-dom/client");
-            modernRoot = createRoot(container);
-          } catch (error) {
-            ReactDOM.render(children, container);
-            return;
-          }
-        }
-        modernRoot.render(children);
-      },
-      unmount() {
-        if (modernRoot) {
-          modernRoot.unmount();
-        } else {
-          ReactDOM.unmountComponentAtNode(container);
-        }
-      }
-    };
-  }
   return {
     render(children) {
-      if (process.env.NODE_ENV !== "test") {
+      const reactVersion = ReactDOM.version || "";
+      const isReact18 = reactVersion.startsWith("18");
+      const isReact19 = reactVersion.startsWith("19");
+      if (isReact19) {
+        throw new Error(
+          `React 19 detected in legacy mode. This is not supported. Please use the version-specific import: import { createBridgeComponent } from '@module-federation/bridge-react/v19'`
+        );
+      }
+      if (isReact18) {
         console.warn(
-          `[Bridge-React] React 16/17 detected. For better compatibility, consider using version-specific imports: import { createBridgeComponent } from '@module-federation/bridge-react/v18' or v19`
+          `[Bridge-React] React 18 detected in legacy mode. For better compatibility, please use the version-specific import: import { createBridgeComponent } from '@module-federation/bridge-react/v18'`
         );
       }
       ReactDOM.render(children, container);

package/dist/index.d.ts

@@ -241,7 +241,7 @@ export declare interface RenderParams {
 export declare function revalidateTag(tag: string): void;
 
 export declare interface Root {
-    render(children: default_2.ReactNode): void;
+    render(children: React.ReactNode): void;
     unmount(): void;
 }
 

package/dist/index.es.js

@@ -4,42 +4,24 @@ import React__default, { forwardRef, useContext, useState, useEffect, useRef } f
 import { p as pathJoin, L as LoggerInstance, g as getRootDomDefaultClassName } from "./index-rAO0Wr0M.mjs";
 import * as ReactRouterDOM from "react-router-dom";
 import { federationRuntime } from "./plugin.es.js";
-import { b, a, c, l } from "./lazy-load-component-plugin-CENdJeja.mjs";
+import { b, a, c, l } from "./lazy-load-component-plugin-Cgr7vjhe.mjs";
 import { C, b as b2, E, e, h, c as c2, d, r, s } from "./utils-VSOJTX_o.mjs";
 import { callDataFetch } from "./data-fetch-utils.es.js";
-import { p } from "./prefetch-BfuXjKtn.mjs";
+import { p } from "./prefetch-DIwspSj-.mjs";
 function createReact16Or17Root(container) {
-  const reactVersion = ReactDOM.version || "";
-  const isReact18Plus = reactVersion.startsWith("18") || reactVersion.startsWith("19");
-  if (isReact18Plus) {
-    let modernRoot = null;
-    return {
-      render(children) {
-        if (!modernRoot) {
-          try {
-            const { createRoot } = require("react-dom/client");
-            modernRoot = createRoot(container);
-          } catch (error) {
-            ReactDOM.render(children, container);
-            return;
-          }
-        }
-        modernRoot.render(children);
-      },
-      unmount() {
-        if (modernRoot) {
-          modernRoot.unmount();
-        } else {
-          ReactDOM.unmountComponentAtNode(container);
-        }
-      }
-    };
-  }
   return {
     render(children) {
-      if (process.env.NODE_ENV !== "test") {
+      const reactVersion = ReactDOM.version || "";
+      const isReact18 = reactVersion.startsWith("18");
+      const isReact19 = reactVersion.startsWith("19");
+      if (isReact19) {
+        throw new Error(
+          `React 19 detected in legacy mode. This is not supported. Please use the version-specific import: import { createBridgeComponent } from '@module-federation/bridge-react/v19'`
+        );
+      }
+      if (isReact18) {
         console.warn(
-          `[Bridge-React] React 16/17 detected. For better compatibility, consider using version-specific imports: import { createBridgeComponent } from '@module-federation/bridge-react/v18' or v19`
+          `[Bridge-React] React 18 detected in legacy mode. For better compatibility, please use the version-specific import: import { createBridgeComponent } from '@module-federation/bridge-react/v18'`
         );
       }
       ReactDOM.render(children, container);

package/dist/{lazy-load-component-plugin-DFiVXILi.js → lazy-load-component-plugin-Br-Tkghx.js}

@@ -1,5 +1,5 @@
 "use strict";
-const prefetch = require("./prefetch-DfV67tNF.js");
+const prefetch = require("./prefetch-BnEr_VXN.js");
 const lazyUtils = require("./utils-vIpCrZmn.js");
 const React = require("react");
 const autoFetchData = () => {
@@ -112,7 +112,7 @@ function AwaitDataFetch({
   params,
   delayLoading
 }) {
-  const dataRef = React.useRef(void 0);
+  const dataRef = React.useRef();
   const data = dataRef.current || resolve;
   const getData = isPromise(data) ? fetchData(data, dataRef) : () => data;
   return /* @__PURE__ */ React.createElement(

package/dist/{lazy-load-component-plugin-CENdJeja.mjs → lazy-load-component-plugin-Cgr7vjhe.mjs}

@@ -1,4 +1,4 @@
-import { i as injectDataFetch, p as prefetch } from "./prefetch-BfuXjKtn.mjs";
+import { i as injectDataFetch, p as prefetch } from "./prefetch-DIwspSj-.mjs";
 import { i as initDataFetchMap, j as isDataLoaderExpose, k as getDataFetchInfo, m as getDataFetchMapKey, l as logger, n as getDataFetchItem, o as DATA_FETCH_CLIENT_SUFFIX, p as MF_DATA_FETCH_TYPE, q as isCSROnly, a as loadDataFetchModule, M as MF_DATA_FETCH_STATUS, g as getDataFetchMap, t as isServerEnv, u as getDataFetchIdWithErrorMsgs, v as DATA_FETCH_ERROR_PREFIX, E as ERROR_TYPE, w as wrapDataFetchId, L as LOAD_REMOTE_ERROR_PREFIX, x as DATA_FETCH_FUNCTION, y as getLoadedRemoteInfos, f as fetchData$1, z as setDataFetchItemLoadedStatus, F as FS_HREF } from "./utils-VSOJTX_o.mjs";
 import React__default, { useRef, useState, Suspense, useEffect } from "react";
 const autoFetchData = () => {
@@ -111,7 +111,7 @@ function AwaitDataFetch({
   params,
   delayLoading
 }) {
-  const dataRef = useRef(void 0);
+  const dataRef = useRef();
   const data = dataRef.current || resolve;
   const getData = isPromise(data) ? fetchData(data, dataRef) : () => data;
   return /* @__PURE__ */ React__default.createElement(

package/dist/lazy-load-component-plugin.cjs.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const lazyLoadComponentPlugin = require("./lazy-load-component-plugin-DFiVXILi.js");
-require("./prefetch-DfV67tNF.js");
+const lazyLoadComponentPlugin = require("./lazy-load-component-plugin-Br-Tkghx.js");
+require("./prefetch-BnEr_VXN.js");
 exports.default = lazyLoadComponentPlugin.lazyLoadComponentPlugin;
 exports.lazyLoadComponentPlugin = lazyLoadComponentPlugin.lazyLoadComponentPlugin;

package/dist/lazy-load-component-plugin.es.js

@@ -1,5 +1,5 @@
-import { l, l as l2 } from "./lazy-load-component-plugin-CENdJeja.mjs";
-import "./prefetch-BfuXjKtn.mjs";
+import { l, l as l2 } from "./lazy-load-component-plugin-Cgr7vjhe.mjs";
+import "./prefetch-DIwspSj-.mjs";
 export {
   l as default,
   l2 as lazyLoadComponentPlugin

package/dist/{prefetch-DfV67tNF.js → prefetch-BnEr_VXN.js}

@@ -271,7 +271,7 @@ function getGlobalFederationConstructor() {
 function setGlobalFederationConstructor(FederationConstructor, isDebug = index_esm.isDebugMode()) {
   if (isDebug) {
     CurrentGlobal.__FEDERATION__.__DEBUG_CONSTRUCTOR__ = FederationConstructor;
-    CurrentGlobal.__FEDERATION__.__DEBUG_CONSTRUCTOR_VERSION__ = "0.0.0-next-20250920074657";
+    CurrentGlobal.__FEDERATION__.__DEBUG_CONSTRUCTOR_VERSION__ = "0.0.0-next-20250923081154";
   }
 }
 function getInfoWithoutType(target, key) {
@@ -362,8 +362,8 @@ const registerGlobalPlugins = (plugins) => {
 const getGlobalHostPlugins = () => nativeGlobal.__FEDERATION__.__GLOBAL_PLUGIN__;
 const getPreloaded = (id) => CurrentGlobal.__FEDERATION__.__PRELOADED_MAP__.get(id);
 const setPreloaded = (id) => CurrentGlobal.__FEDERATION__.__PRELOADED_MAP__.set(id, true);
-const DEFAULT_REMOTE_TYPE = "global";
 const DEFAULT_SCOPE = "default";
+const DEFAULT_REMOTE_TYPE = "global";
 const buildIdentifier = "[0-9A-Za-z-]+";
 const build = `(?:\\+(${buildIdentifier}(?:\\.${buildIdentifier})*))`;
 const numericIdentifier = "0|[1-9]\\d*";
@@ -1043,7 +1043,7 @@ function getRemoteEntryUniqueKey(remoteInfo) {
   return index_esm.composeKeyWithSeparator(name, entry);
 }
 async function getRemoteEntry(params) {
-  const { origin, remoteEntryExports, remoteInfo, getEntryUrl } = params;
+  const { origin, remoteEntryExports, remoteInfo, getEntryUrl, _inErrorHandling = false } = params;
   const uniqueKey = getRemoteEntryUniqueKey(remoteInfo);
   if (remoteEntryExports) {
     return remoteEntryExports;
@@ -1069,6 +1069,28 @@ async function getRemoteEntry(params) {
         remoteInfo,
         loaderHook
       });
+    }).catch(async (err) => {
+      const uniqueKey2 = getRemoteEntryUniqueKey(remoteInfo);
+      const isScriptLoadError = err instanceof Error && err.message.includes(RUNTIME_008);
+      if (isScriptLoadError && !_inErrorHandling) {
+        const wrappedGetRemoteEntry = (params2) => {
+          return getRemoteEntry(_extends$1({}, params2, {
+            _inErrorHandling: true
+          }));
+        };
+        const RemoteEntryExports = await origin.loaderHook.lifecycle.loadEntryError.emit({
+          getRemoteEntry: wrappedGetRemoteEntry,
+          origin,
+          remoteInfo,
+          remoteEntryExports,
+          globalLoading,
+          uniqueKey: uniqueKey2
+        });
+        if (RemoteEntryExports) {
+          return RemoteEntryExports;
+        }
+      }
+      throw err;
     });
   }
   return globalLoading[uniqueKey];

package/dist/{prefetch-BfuXjKtn.mjs → prefetch-DIwspSj-.mjs}

@@ -270,7 +270,7 @@ function getGlobalFederationConstructor() {
 function setGlobalFederationConstructor(FederationConstructor, isDebug = isDebugMode()) {
   if (isDebug) {
     CurrentGlobal.__FEDERATION__.__DEBUG_CONSTRUCTOR__ = FederationConstructor;
-    CurrentGlobal.__FEDERATION__.__DEBUG_CONSTRUCTOR_VERSION__ = "0.0.0-next-20250920074657";
+    CurrentGlobal.__FEDERATION__.__DEBUG_CONSTRUCTOR_VERSION__ = "0.0.0-next-20250923081154";
   }
 }
 function getInfoWithoutType(target, key) {
@@ -361,8 +361,8 @@ const registerGlobalPlugins = (plugins) => {
 const getGlobalHostPlugins = () => nativeGlobal.__FEDERATION__.__GLOBAL_PLUGIN__;
 const getPreloaded = (id) => CurrentGlobal.__FEDERATION__.__PRELOADED_MAP__.get(id);
 const setPreloaded = (id) => CurrentGlobal.__FEDERATION__.__PRELOADED_MAP__.set(id, true);
-const DEFAULT_REMOTE_TYPE = "global";
 const DEFAULT_SCOPE = "default";
+const DEFAULT_REMOTE_TYPE = "global";
 const buildIdentifier = "[0-9A-Za-z-]+";
 const build = `(?:\\+(${buildIdentifier}(?:\\.${buildIdentifier})*))`;
 const numericIdentifier = "0|[1-9]\\d*";
@@ -1042,7 +1042,7 @@ function getRemoteEntryUniqueKey(remoteInfo) {
   return composeKeyWithSeparator(name, entry);
 }
 async function getRemoteEntry(params) {
-  const { origin, remoteEntryExports, remoteInfo, getEntryUrl } = params;
+  const { origin, remoteEntryExports, remoteInfo, getEntryUrl, _inErrorHandling = false } = params;
   const uniqueKey = getRemoteEntryUniqueKey(remoteInfo);
   if (remoteEntryExports) {
     return remoteEntryExports;
@@ -1068,6 +1068,28 @@ async function getRemoteEntry(params) {
         remoteInfo,
         loaderHook
       });
+    }).catch(async (err) => {
+      const uniqueKey2 = getRemoteEntryUniqueKey(remoteInfo);
+      const isScriptLoadError = err instanceof Error && err.message.includes(RUNTIME_008);
+      if (isScriptLoadError && !_inErrorHandling) {
+        const wrappedGetRemoteEntry = (params2) => {
+          return getRemoteEntry(_extends$1({}, params2, {
+            _inErrorHandling: true
+          }));
+        };
+        const RemoteEntryExports = await origin.loaderHook.lifecycle.loadEntryError.emit({
+          getRemoteEntry: wrappedGetRemoteEntry,
+          origin,
+          remoteInfo,
+          remoteEntryExports,
+          globalLoading,
+          uniqueKey: uniqueKey2
+        });
+        if (RemoteEntryExports) {
+          return RemoteEntryExports;
+        }
+      }
+      throw err;
     });
   }
   return globalLoading[uniqueKey];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@module-federation/bridge-react",
-  "version": "0.0.0-next-20250920074657",
+  "version": "0.0.0-next-20250923081154",
   "sideEffects": false,
   "publishConfig": {
     "access": "public"
@@ -95,8 +95,8 @@
   "dependencies": {
     "react-error-boundary": "^4.1.2",
     "lru-cache": "^10.4.3",
-    "@module-federation/bridge-shared": "0.0.0-next-20250920074657",
-    "@module-federation/sdk": "0.0.0-next-20250920074657"
+    "@module-federation/sdk": "0.0.0-next-20250923081154",
+    "@module-federation/bridge-shared": "0.0.0-next-20250923081154"
   },
   "peerDependencies": {
     "react": ">=16.9.0",
@@ -106,21 +106,20 @@
   "devDependencies": {
     "@testing-library/react": "15.0.7",
     "@testing-library/jest-dom": "6.6.3",
-    "@types/react": "19.0.0",
-    "@types/react-dom": "19.0.0",
+    "@types/react": "18.2.79",
+    "@types/react-dom": "18.3.0",
     "@vitejs/plugin-react": "^4.3.3",
     "@vitejs/plugin-vue": "^5.0.4",
     "@vitejs/plugin-vue-jsx": "^4.0.0",
-    "jsdom": "^24.1.0",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
     "react-router-dom": "6.22.3",
     "typescript": "^5.2.2",
     "vite": "^5.4.18",
     "vite-plugin-dts": "^4.3.0",
     "hono": "3.12.12",
-    "@module-federation/runtime-core": "0.0.0-next-20250920074657",
-    "@module-federation/runtime": "0.0.0-next-20250920074657"
+    "@module-federation/runtime-core": "0.0.0-next-20250923081154",
+    "@module-federation/runtime": "0.0.0-next-20250923081154"
   },
   "scripts": {
     "dev": "vite",

package/src/lazy/AwaitDataFetch.tsx

@@ -91,11 +91,9 @@ export function AwaitDataFetch<T>({
   params,
   delayLoading,
 }: AwaitProps<T>) {
-  const dataRef = useRef<T | undefined>(undefined);
+  const dataRef = useRef<T>();
   const data = dataRef.current || resolve;
-  const getData = isPromise(data)
-    ? fetchData(data as Promise<T>, dataRef)
-    : () => data;
+  const getData = isPromise(data) ? fetchData(data, dataRef) : () => data;
 
   return (
     <AwaitSuspense

package/src/lazy/createLazyComponent.tsx

@@ -308,7 +308,7 @@ export function createLazyComponent<T, E extends keyof T>(
       injectScript,
     });
 
-    const Com = m[exportName as string] as React.FC<ComponentType>;
+    const Com = m[exportName] as React.FC<ComponentType>;
     if (exportName in m && typeof Com === 'function') {
       return {
         default: (props: Omit<ComponentType, 'key'> & { mfData?: unknown }) => (
@@ -350,6 +350,7 @@ export function createLazyComponent<T, E extends keyof T>(
           delayLoading={options.delayLoading}
           errorElement={options.fallback}
         >
+          {/* @ts-expect-error ignore */}
           {(data) => <LazyComponent {...args} mfData={data} />}
         </AwaitDataFetch>
       );
@@ -403,6 +404,7 @@ export function createLazyComponent<T, E extends keyof T>(
           </>
         );
       }
+      // @ts-expect-error ignore
       return <LazyComponent {...args} mfData={data} />;
     }
   };

package/src/provider/versions/legacy.ts

@@ -5,7 +5,6 @@
 import type { ProviderFnParams } from '../../types';
 import { createBaseBridgeComponent } from './bridge-base';
 import ReactDOM from 'react-dom';
-import React from 'react';
 
 export interface CreateRootOptions {
   identifierPrefix?: string;
@@ -29,54 +28,40 @@ export interface Root {
 export function createReact16Or17Root(
   container: Element | DocumentFragment,
 ): Root {
-  /**
-   * Detect React version
-   */
-  const reactVersion = ReactDOM.version || '';
-  const isReact18Plus =
-    reactVersion.startsWith('18') || reactVersion.startsWith('19');
-
-  if (isReact18Plus) {
-    // For React 18+, use the modern createRoot API
-    let modernRoot: any = null;
-
-    return {
-      render(children: React.ReactNode) {
-        if (!modernRoot) {
-          try {
-            // Import createRoot dynamically to avoid issues if not available
-            const { createRoot } = require('react-dom/client');
-            modernRoot = createRoot(container);
-          } catch (error) {
-            // Fallback to legacy API if createRoot is not available
-            // @ts-ignore - React 17's render method is deprecated but still functional
-            ReactDOM.render(children, container);
-            return;
-          }
-        }
-        modernRoot.render(children);
-      },
-      unmount() {
-        if (modernRoot) {
-          modernRoot.unmount();
-        } else {
-          ReactDOM.unmountComponentAtNode(container as Element);
-        }
-      },
-    };
-  }
-
-  // For React 16/17, use the legacy API
   return {
     render(children: React.ReactNode) {
       /**
-       * Provide warning for non-test environments to suggest version-specific imports
+       * Detect React version
+       */
+      const reactVersion = ReactDOM.version || '';
+      const isReact18 = reactVersion.startsWith('18');
+      const isReact19 = reactVersion.startsWith('19');
+
+      /**
+       * Throw error for React 19
+       *
+       * Note: Due to Module Federation sharing mechanism, the actual version detected here
+       * might be 18 or 19, even if the application itself uses React 16/17.
+       * This happens because in MF environments, different remote modules may share different React versions.
+       * The console may throw warnings about version and API mismatches. If you need to resolve these issues,
+       * consider disabling the shared configuration for React.
+       */
+      if (isReact19) {
+        throw new Error(
+          `React 19 detected in legacy mode. This is not supported. ` +
+            `Please use the version-specific import: ` +
+            `import { createBridgeComponent } from '@module-federation/bridge-react/v19'`,
+        );
+      }
+
+      /**
+       * Provide warning for React 18
        */
-      if (process.env.NODE_ENV !== 'test') {
+      if (isReact18) {
         console.warn(
-          `[Bridge-React] React 16/17 detected. ` +
-            `For better compatibility, consider using version-specific imports: ` +
-            `import { createBridgeComponent } from '@module-federation/bridge-react/v18' or v19`,
+          `[Bridge-React] React 18 detected in legacy mode. ` +
+            `For better compatibility, please use the version-specific import: ` +
+            `import { createBridgeComponent } from '@module-federation/bridge-react/v18'`,
         );
       }