(fix) Better typings in loadModules()

packages/framework/esm-framework/docs/API.md

@@ -2114,7 +2114,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-error-handling/src/index.ts:30](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-error-handling/src/index.ts#L30)
+[packages/framework/esm-error-handling/src/index.ts:31](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-error-handling/src/index.ts#L31)
 
 ___
 
@@ -2134,7 +2134,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-error-handling/src/index.ts:23](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-error-handling/src/index.ts#L23)
+[packages/framework/esm-error-handling/src/index.ts:24](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-error-handling/src/index.ts#L24)
 
 ___
 

packages/framework/esm-globals/src/globals.ts

@@ -1,4 +1,4 @@
-import { SpaConfig } from "./types";
+import type { SpaConfig } from "./types";
 
 export function setupPaths(config: SpaConfig) {
   window.openmrsBase = config.apiUrl;

packages/framework/esm-globals/src/types.ts

@@ -1,4 +1,4 @@
-import { LifeCycleFn } from "single-spa";
+import type { LifeCycleFn } from "single-spa";
 
 declare global {
   interface Window {

packages/shell/esm-app-shell/src/load-modules.ts

@@ -35,7 +35,7 @@ export async function loadModules(modules: Record<string, string>) {
         return [name, {}];
       }
 
-      const app: any = window[slugify(name)];
+      const app: unknown = window[slugify(name)];
       if (!app) {
         console.warn(
           `${name} failed to be loaded into the webpack container. Perhaps it has been built using openmrs@3.x (or @openmrs/webpack-config@3.x). The current app shell version is 4.x (${window.spaVersion}), therefore frontend modules will need to be built with openmrs@4 (or @openmrs/webpack-config@4). Check the version in ${name}'s package dependencies.`
@@ -52,22 +52,48 @@ export async function loadModules(modules: Record<string, string>) {
           return [name, {}];
         }
       }
-      app.init(__webpack_share_scopes__.default);
-      const start = await app.get("./start");
-      const moduleExports = start();
-      return [name, moduleExports];
+
+      if (isFederatedModule(app)) {
+        app.init(__webpack_share_scopes__.default);
+        const start = await app.get("./start");
+        const moduleExports = start();
+        return [name, moduleExports];
+      } else {
+        console.error(
+          `${name} did not resolve to a federated module as expected; instead got:`,
+          app
+        );
+
+        return [name, {}];
+      }
     })
   );
 }
 
+interface FederatedModule {
+  init: (scope: typeof __webpack_share_scopes__.default) => void;
+  get: (_export: string) => Promise<() => unknown>;
+}
+
+function isFederatedModule(a: unknown): a is FederatedModule {
+  return (
+    typeof a === "object" &&
+    a !== null &&
+    "init" in a &&
+    typeof a["init"] === "function" &&
+    "get" in a &&
+    typeof a["get"] === "function"
+  );
+}
+
 /**
  * Appends a `<script>` to the DOM with the given URL.
  */
 function loadScript(
   name: string,
   url: string,
   resolve: (value: unknown) => void,
-  reject: () => void
+  reject: (reason?: any) => void
 ) {
   if (!document.head.querySelector(`script[src="${url}"]`)) {
     const element = document.createElement("script");
@@ -84,7 +110,7 @@ function loadScript(
     element.onerror = (ev: ErrorEvent) => {
       console.error(`Failed to load script from ${url}`);
       console.error(ev);
-      reject();
+      reject(ev.message);
     };
 
     document.head.appendChild(element);
@@ -94,6 +120,6 @@ function loadScript(
   }
 }
 
-export function slugify(name) {
+export function slugify(name: string) {
   return name.replace(/[\/\-@]/g, "_");
 }