fix(node): enhance error messaging for fetchAndRun with url

Author: nameofname

packages/node/src/__tests__/runtimePlugin.test.ts

@@ -41,9 +41,10 @@ jest.mock('vm', () => ({
   },
 }));
 
-global.fetch = jest.fn().mockResolvedValue({
+(global as unknown as any).fetch = jest.fn().mockResolvedValue({
   text: jest.fn().mockResolvedValue('// mock chunk content'),
 });
+const globalFetch = (global as unknown as any).fetch as jest.Mock;
 
 const mockWebpackRequire = {
   u: jest.fn((chunkId: string) => `/chunks/${chunkId}.js`),
@@ -77,7 +78,7 @@ const mockNonWebpackRequire = jest.fn().mockImplementation((id: string) => {
   if (id === 'path') return require('path');
   if (id === 'fs') return require('fs');
   if (id === 'vm') return require('vm');
-  if (id === 'node-fetch') return { default: global.fetch };
+  if (id === 'node-fetch') return { default: globalFetch };
   return {};
 });
 
@@ -343,11 +344,11 @@ describe('runtimePlugin', () => {
 
   describe('fetchAndRun', () => {
     beforeEach(() => {
-      (global.fetch as jest.Mock).mockReset();
+      (globalFetch as jest.Mock).mockReset();
     });
 
     it('should fetch and execute remote content', async () => {
-      (global.fetch as jest.Mock).mockResolvedValue({
+      (globalFetch as jest.Mock).mockResolvedValue({
         text: jest.fn().mockResolvedValue('// mock script content'),
       });
 
@@ -381,7 +382,7 @@ describe('runtimePlugin', () => {
 
     it('should handle fetch errors', async () => {
       const fetchError = new Error('Fetch failed');
-      (global.fetch as jest.Mock).mockRejectedValue(fetchError);
+      (globalFetch as jest.Mock).mockRejectedValue(fetchError);
 
       const url = new URL('http://example.com/chunk.js');
       const callback = jest.fn();
@@ -403,6 +404,9 @@ describe('runtimePlugin', () => {
       await new Promise((resolve) => setTimeout(resolve, 10));
 
       expect(callback).toHaveBeenCalledWith(expect.any(Error), null);
+      expect(callback.mock.calls[0][0].message.includes(url.href)).toEqual(
+        true,
+      );
     });
   });
 
@@ -746,6 +750,50 @@ describe('runtimePlugin', () => {
       // The original promise should be reused
       expect(promises[0]).toBe(originalPromise);
     });
+
+    it('should delete chunks from the installedChunks when loadChunk fails', async () => {
+      // mock loadChunk to fail
+      jest
+        .spyOn(runtimePluginModule, 'loadChunk')
+        .mockImplementationOnce((strategy, chunkId, root, callback, args) => {
+          Promise.resolve().then(() => {
+            callback(new Error('failed to load'), undefined);
+          });
+        });
+
+      jest
+        .spyOn(runtimePluginModule, 'installChunk')
+        .mockImplementationOnce((chunk, installedChunks) => {
+          // Mock implementation that doesn't rely on iterating chunk.ids
+          installedChunks['test-chunk'] = 0;
+        });
+
+      // Mock installedChunks
+      const installedChunks: Record<string, any> = {};
+
+      // Call the function under test - returns the handler function, doesn't set webpack_require.f.require
+      const handler = setupChunkHandler(installedChunks, {});
+
+      const promises: Promise<any>[] = [];
+      let res, err;
+
+      try {
+        // Call the handler with mock chunk ID and promises array
+        handler('test-chunk', promises);
+        // Verify that installedChunks has test-chunk before the promise rejects
+        expect(installedChunks['test-chunk']).toBeDefined();
+        res = await promises[0];
+      } catch (e) {
+        err = e;
+      }
+
+      // Verify that an error was thrown, and the response is undefined
+      expect(res).not.toBeDefined();
+      expect(err instanceof Error).toEqual(true);
+
+      // Verify the chunk data was properly removed
+      expect(installedChunks['test-chunk']).not.toBeDefined();
+    });
   });
 
   describe('setupWebpackRequirePatching', () => {

packages/node/src/runtimePlugin.ts

@@ -2,6 +2,8 @@ import type {
   FederationRuntimePlugin,
   FederationHost,
 } from '@module-federation/runtime';
+import { Response } from 'node-fetch';
+
 type WebpackRequire = {
   (id: string): any;
   u: (chunkId: string) => string;
@@ -125,26 +127,29 @@ export const loadFromFs = (
     callback(new Error(`File ${filename} does not exist`), null);
   }
 };
-
 // Hoisted utility function to fetch and execute chunks from remote URLs
 export const fetchAndRun = (
   url: URL,
   chunkName: string,
   callback: (err: Error | null, chunk: any) => void,
   args: any,
 ): void => {
-  (typeof fetch === 'undefined'
+  const createFetchError = (e: Error) =>
+    new Error(`Error while fetching from URL: ${url}`, { cause: e });
+  (typeof (global as any).fetch === 'undefined'
     ? importNodeModule<typeof import('node-fetch')>('node-fetch').then(
         (mod) => mod.default,
       )
-    : Promise.resolve(fetch)
+    : Promise.resolve((global as any).fetch)
   )
     .then((fetchFunction) => {
       return args.origin.loaderHook.lifecycle.fetch
         .emit(url.href, {})
         .then((res: Response | null) => {
           if (!res || !(res instanceof Response)) {
-            return fetchFunction(url.href).then((response) => response.text());
+            return fetchFunction(url.href).then((response: Response) =>
+              response.text(),
+            );
           }
           return res.text();
         });
@@ -160,10 +165,10 @@ export const fetchAndRun = (
         );
         callback(null, chunk);
       } catch (e) {
-        callback(e as Error, null);
+        callback(createFetchError(e as Error), null);
       }
     })
-    .catch((err: Error) => callback(err, null));
+    .catch((err: Error) => callback(createFetchError(err as Error), null));
 };
 
 // Hoisted utility function to resolve URLs for chunks

packages/node/src/utils/flush-chunks.ts

@@ -1,5 +1,7 @@
 /* eslint-disable no-undef */
 
+import { Response } from 'node-fetch';
+
 // @ts-ignore
 if (!globalThis.usedChunks) {
   // @ts-ignore
@@ -121,7 +123,9 @@ const processChunk = async (chunk, shareMap, hostStats) => {
     let stats = {};
 
     try {
-      stats = await fetch(statsFile).then((res) => res.json());
+      stats = await (global as any)
+        .fetch(statsFile)
+        .then((res: Response) => res.json());
     } catch (e) {
       console.error('flush error', e);
     }

packages/node/src/utils/hot-reload.ts

@@ -2,6 +2,7 @@ import { getAllKnownRemotes } from './flush-chunks';
 import crypto from 'crypto';
 import helpers from '@module-federation/runtime/helpers';
 import path from 'path';
+import { Response } from 'node-fetch';
 
 declare global {
   var mfHashMap: Record<string, string> | undefined;

packages/node/tsconfig.json

@@ -2,6 +2,7 @@
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
     "target": "ES2021",
+    "lib": ["es2022.error"],
     "moduleResolution": "node",
     "resolveJsonModule": true,
     "skipLibCheck": true,