feat(runtime): support entry with query (module-federation#1833)

Author: 2heal1

.changeset/wet-dancers-raise.md

@@ -0,0 +1,5 @@
+---
+'@module-federation/runtime': patch
+---
+
+chore(runtime): support entry with query

commitlint.config.js

@@ -1,6 +1,3 @@
 module.exports = {
   extends: ['@commitlint/config-conventional', '@commitlint/config-nx-scopes'],
-  rules: {
-    'scope-enum': [2, 'always', ['release', 'docs', 'workflow']],
-  },
 };

packages/runtime/__tests__/load-remote.spec.ts

@@ -267,6 +267,24 @@ describe('loadRemote', () => {
     reset();
   });
 
+  it('remote entry url with query', async () => {
+    const FederationInstance = new FederationHost({
+      name: '@federation-test/compatible',
+      remotes: [
+        {
+          name: '__FEDERATION_@federation-test/app2:custom__',
+          alias: 'app2',
+          entry:
+            'http://localhost:1111/resources/app2/federation-remote-entry.js?kk=2',
+        },
+      ],
+    });
+    const module =
+      await FederationInstance.loadRemote<() => string>('app2/say');
+    assert(module, 'module should be a function');
+    expect(module()).toBe('hello app2');
+  });
+
   it('different instance with same module', async () => {
     const reset = addGlobalSnapshot({
       '@module-federation/load-remote-different-instance': {
@@ -399,6 +417,25 @@ describe('loadRemote with manifest.json', () => {
     Global.__FEDERATION__.__INSTANCES__ = [];
     globalThis.__FEDERATION__.__DEBUG_CONSTRUCTOR__ = undefined;
   });
+
+  it('manifest.json with query', async () => {
+    const FM = new FederationHost({
+      name: '@demo/host',
+      remotes: [
+        {
+          name: '@demo/main',
+          entry:
+            'http://localhost:1111/resources/main/federation-manifest.json?query=2',
+        },
+      ],
+    });
+
+    const [module, ,] = await Promise.all([
+      FM.loadRemote<Promise<() => string>>('@demo/main/say'),
+    ]);
+    assert(module);
+    expect(module()).toBe('hello world');
+  });
 });
 
 describe('lazy loadRemote add remote into snapshot', () => {
@@ -560,7 +597,7 @@ describe('loadRemote', () => {
     const loadedSrcs = [...document.querySelectorAll('script')].map(
       (i) => i.fakeSrc,
     );
-    expect(loadedSrcs.includes(`${remotePublicPath}/${jsSyncAssetPath}`));
+    expect(loadedSrcs.includes(`${remotePublicPath}${jsSyncAssetPath}`));
     reset();
   });
 });

packages/runtime/__tests__/mock/handlers.ts

@@ -31,7 +31,7 @@ export const handlers = [
       );
 
       const content = fs.readFileSync(filepath, 'utf-8');
-      if (typeof file === 'string' && file.endsWith('json')) {
+      if (typeof file === 'string' && file.includes('json')) {
         return res(ctx.status(200), ctx.json(JSON.parse(content)));
       } else {
         return res(ctx.status(200), ctx.text(content));

packages/runtime/__tests__/mock/mock-script.ts

@@ -61,7 +61,9 @@ function injector(current: Function, methodName: string) {
             (nEl as any)['fakeSrc'] = (element as any)[key];
           }
         }
-        const filePath = element.src.replace(matchInfo.baseUrl, '');
+        const filePath = element.src
+          .replace(matchInfo.baseUrl, '')
+          .replace(/\?.*$/, '');
 
         const execScriptContent = fs.readFileSync(
           path.resolve(matchInfo.baseDir, filePath),

packages/runtime/src/utils/tool.ts

@@ -28,7 +28,7 @@ export function isRemoteInfoWithEntry(
 }
 
 export function isPureRemoteEntry(remote: RemoteWithEntry): boolean {
-  return remote.entry.endsWith('.js');
+  return !remote.entry.includes('.json') && remote.entry.includes('.js');
 }
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

packages/sdk/src/generateSnapshotFromManifest.ts

@@ -167,7 +167,7 @@ export function isManifestProvider(
 ): moduleInfo is ManifestProvider {
   if (
     'remoteEntry' in moduleInfo &&
-    moduleInfo.remoteEntry.endsWith(MANIFEST_EXT)
+    moduleInfo.remoteEntry.includes(MANIFEST_EXT)
   ) {
     return true;
   } else {

packages/sdk/src/utils.ts

@@ -19,7 +19,7 @@ const parseEntry = (str: string, devVerOrUrl?: string): RemoteEntryInfo => {
     getProcessEnv()['NODE_ENV'] === 'development' && devVerOrUrl;
   const defaultVersion = '*';
   const isEntry = (s: string) =>
-    s.startsWith('http') || s.endsWith(MANIFEST_EXT);
+    s.startsWith('http') || s.includes(MANIFEST_EXT);
 
   // Check if the string starts with a type
   if (strSplit.length >= 2) {