npm - @equinor/fusion-framework-vite-plugin-spa - Versions diffs - 1.1.2 → 1.1.4 - Mend

@equinor/fusion-framework-vite-plugin-spa 1.1.2 → 1.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/CHANGELOG.md +44 -0
package/README.md +41 -31
package/dist/esm/html/bootstrap.js +87 -5
package/dist/esm/html/bootstrap.js.map +1 -1
package/dist/esm/html/register-service-worker.js +54 -11
package/dist/esm/html/register-service-worker.js.map +1 -1
package/dist/esm/version.js +1 -1
package/dist/html/bootstrap.js +4336 -980
package/dist/html/bootstrap.js.map +1 -1
package/dist/tsconfig.tsbuildinfo +1 -1
package/dist/types/html/index.html.d.ts +1 -1
package/dist/types/html/register-service-worker.d.ts +2 -1
package/dist/types/types.d.ts +3 -0
package/dist/types/version.d.ts +1 -1
package/package.json +7 -6
package/src/html/bootstrap.ts +109 -11
package/src/html/register-service-worker.ts +87 -35
package/src/types.ts +4 -0
package/src/version.ts +1 -1
package/tsconfig.json +3 -0

package/dist/types/html/index.html.d.ts CHANGED Viewed

@@ -15,5 +15,5 @@
  * @constant
  * @type {string}
  */
-export declare const html = "\n  <!DOCTYPE html>\n  <html>\n    <head>\n      <title>%FUSION_SPA_TITLE%</title>\n      <meta name=\"mode\" content=\"%MODE%\">\n      <meta name=\"fusion-spa-plugin-version\" content=\"1.1.2\">\n      <link rel=\"stylesheet\" href=\"https://cdn.eds.equinor.com/font/equinor-font.css\" />\n      <script type=\"module\" src=\"%FUSION_SPA_BOOTSTRAP%\"></script>\n      <script>\n        // suppress console error for custom elements already defined. \n        // WebComponents should be added by the portal, but not removed from application\n        const _customElementsDefine = window.customElements.define;\n        window.customElements.define = (name, cl, conf) => {\n          if (!customElements.get(name)) {\n            _customElementsDefine.call(window.customElements, name, cl, conf);\n          }\n        };\n      </script>\n      <style>\n        html, body {\n          margin: 0;\n          padding: 0;\n          height: 100%;\n          font-family: 'EquinorFont', sans-serif;\n        }\n      </style>\n    </head>\n    <body></body>\n  </html>\n";
+export declare const html = "\n  <!DOCTYPE html>\n  <html>\n    <head>\n      <title>%FUSION_SPA_TITLE%</title>\n      <meta name=\"mode\" content=\"%MODE%\">\n      <meta name=\"fusion-spa-plugin-version\" content=\"1.1.4\">\n      <link rel=\"stylesheet\" href=\"https://cdn.eds.equinor.com/font/equinor-font.css\" />\n      <script type=\"module\" src=\"%FUSION_SPA_BOOTSTRAP%\"></script>\n      <script>\n        // suppress console error for custom elements already defined. \n        // WebComponents should be added by the portal, but not removed from application\n        const _customElementsDefine = window.customElements.define;\n        window.customElements.define = (name, cl, conf) => {\n          if (!customElements.get(name)) {\n            _customElementsDefine.call(window.customElements, name, cl, conf);\n          }\n        };\n      </script>\n      <style>\n        html, body {\n          margin: 0;\n          padding: 0;\n          height: 100%;\n          font-family: 'EquinorFont', sans-serif;\n        }\n      </style>\n    </head>\n    <body></body>\n  </html>\n";
 export default html;

package/dist/types/html/register-service-worker.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
 import type { ModulesInstance } from '@equinor/fusion-framework-module';
 import type { MsalModule } from '@equinor/fusion-framework-module-msal';
-export declare function registerServiceWorker(framework: ModulesInstance<[MsalModule]>): Promise<void>;
+import { type TelemetryModule } from '@equinor/fusion-framework-module-telemetry';
+export declare function registerServiceWorker(framework: ModulesInstance<[MsalModule, TelemetryModule]>): Promise<void>;

package/dist/types/types.d.ts CHANGED Viewed

@@ -13,6 +13,9 @@ export type FusionTemplateEnv = {
     title: string;
     /** Template bootstrap file path */
     bootstrap: string;
+    telemetry?: {
+        consoleLevel?: number;
+    };
     /** Id of the portal to load */
     portal: {
         id: string;

package/dist/types/version.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export declare const version = "1.1.2";
1	+ export declare const version = "1.1.4";

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/fusion-framework-vite-plugin-spa",
-  "version": "1.1.2",
+  "version": "1.1.4",
   "description": "Vite plugin for SPA development",
   "type": "module",
   "types": "dist/types/index.d.ts",
@@ -46,11 +46,12 @@
     "@types/lodash.mergewith": "^4.6.2",
     "rollup": "^4.39.0",
     "typescript": "^5.8.2",
-    "vite": "^7.1.5",
-    "@equinor/fusion-framework-module": "^5.0.2",
-    "@equinor/fusion-framework-module-http": "^7.0.1",
-    "@equinor/fusion-framework-module-msal": "^5.0.1",
-    "@equinor/fusion-framework-module-service-discovery": "^9.0.1"
+    "vite": "^7.1.9",
+    "@equinor/fusion-framework-module": "5.0.3",
+    "@equinor/fusion-framework-module-http": "7.0.2",
+    "@equinor/fusion-framework-module-msal": "5.0.1",
+    "@equinor/fusion-framework-module-telemetry": "4.2.0",
+    "@equinor/fusion-framework-module-service-discovery": "9.0.2"
   },
   "scripts": {
     "build": "tsc -b",

package/src/html/bootstrap.ts CHANGED Viewed

@@ -6,8 +6,18 @@ import {
   enableServiceDiscovery,
   type ServiceDiscoveryModule,
 } from '@equinor/fusion-framework-module-service-discovery';
+import {
+  enableTelemetry,
+  TelemetryLevel,
+  type TelemetryModule,
+} from '@equinor/fusion-framework-module-telemetry';
+import { ConsoleAdapter } from '@equinor/fusion-framework-module-telemetry/console-adapter';
 import { registerServiceWorker } from './register-service-worker.js';
+import { version } from '../version.js';
 // @todo - add type for portal manifest when available
 type PortalManifest = {
   build: {
@@ -23,8 +33,6 @@ const importWithoutVite = <T>(path: string): Promise<T> => import(/* @vite-ignor
 // Create Fusion Framework configurator
 const configurator = new ModulesConfigurator();
-configurator.logger.level = import.meta.env.FUSION_SPA_LOG_LEVEL ?? 1;
 const serviceDiscoveryUrl = new URL(
   import.meta.env.FUSION_SPA_SERVICE_DISCOVERY_URL,
   import.meta.env.FUSION_SPA_SERVICE_DISCOVERY_URL.startsWith('http')
@@ -56,12 +64,65 @@ enableMSAL(configurator, (builder) => {
   builder.setRequiresAuth(Boolean(import.meta.env.FUSION_SPA_MSAL_REQUIRES_AUTH));
 });
+enableTelemetry(configurator, {
+  attachConfiguratorEvents: true,
+  configure: (builder) => {
+    const consoleLevel = Number(
+      import.meta.env.FUSION_SPA_TELEMETRY_CONSOLE_LEVEL ?? TelemetryLevel.Information,
+    );
+    if (Number.isNaN(consoleLevel)) {
+      // If environment variable is set but invalid, log all telemetry
+      builder.setAdapter(new ConsoleAdapter());
+    } else {
+      builder.setAdapter(
+        new ConsoleAdapter({
+          filter: (item) => item.level >= consoleLevel,
+        }),
+      );
+    }
+    builder.setMetadata(({ modules }) => {
+      const metadata = {
+        fusion: {
+          spa: {
+            version,
+          },
+        },
+        // biome-ignore lint/suspicious/noExplicitAny: we need to use any here to allow dynamic properties
+      } as Record<string, any>;
+      if (modules?.auth) {
+        metadata.fusion.user = {
+          id: modules.auth.defaultAccount?.homeAccountId,
+          name: modules.auth.defaultAccount?.name,
+          email: modules.auth.defaultAccount?.username,
+        };
+      }
+      return metadata;
+    });
+  },
+});
 (async () => {
   // initialize the framework - this will create the framework instance and configure the modules
-  const ref = await configurator.initialize<[ServiceDiscoveryModule, HttpModule, MsalModule]>();
+  const ref =
+    await configurator.initialize<
+      [ServiceDiscoveryModule, HttpModule, MsalModule, TelemetryModule]
+    >();
+  const telemetry = ref.telemetry;
   // attach service discovery to the framework - append auth token to configured endpoints
-  await registerServiceWorker(ref);
+  using measurement = telemetry.measure({
+    name: 'bootstrap',
+    level: TelemetryLevel.Information,
+  });
+  await measurement.clone().resolve(registerServiceWorker(ref), {
+    data: {
+      level: TelemetryLevel.Debug,
+      name: 'bootstrap::registerServiceWorker',
+    },
+  });
   // create a client for the portal service - this is used to fetch the portal manifest
   const portalClient = await ref.serviceDiscovery.createClient('portal-config');
@@ -69,11 +130,34 @@ enableMSAL(configurator, (builder) => {
   // fetch the portal manifest - this is used to load the portal template
   const portalId = import.meta.env.FUSION_SPA_PORTAL_ID;
   const portalTag = import.meta.env.FUSION_SPA_PORTAL_TAG ?? 'latest';
-  const portal_manifest = await portalClient.json<PortalManifest>(
-    `/portals/${portalId}@${portalTag}`,
-  );
-  const portal_config = await portalClient.json(`/portals/${portalId}@${portalTag}/config`);
+  const portal_manifest = await measurement
+    .clone()
+    .resolve(portalClient.json<PortalManifest>(`/portals/${portalId}@${portalTag}`), {
+      data: (manifest: PortalManifest) => ({
+        name: 'bootstrap::loadPortalManifest',
+        level: TelemetryLevel.Debug,
+        properties: {
+          portalId,
+          portalTag,
+          templateEntry: manifest.build.templateEntry,
+          manifestVersion: manifest.build.config?.version,
+          assetPath: manifest.build.assetPath,
+        },
+      }),
+    });
+  const portal_config = await measurement
+    .clone()
+    .resolve(portalClient.json(`/portals/${portalId}@${portalTag}/config`), {
+      data: {
+        name: 'bootstrap::loadPortalConfig',
+        level: TelemetryLevel.Debug,
+        properties: {
+          portalId,
+          portalTag,
+        },
+      },
+    });
   // create a entrypoint for the portal - this is used to render the portal
   const el = document.createElement('div');
@@ -86,8 +170,22 @@ enableMSAL(configurator, (builder) => {
   // @todo: should test if the entrypoint is external or internal
   // @todo: add proper return type
-  const { render } =
-    await importWithoutVite<Promise<{ render: (...args: unknown[]) => void }>>(portalEntryPoint);
+  const { render } = await measurement
+    .clone()
+    .resolve(
+      importWithoutVite<Promise<{ render: (...args: unknown[]) => void }>>(portalEntryPoint),
+      {
+        data: {
+          name: 'bootstrap::loadPortalSourceCode',
+          level: TelemetryLevel.Debug,
+          properties: {
+            portalId,
+            portalTag,
+            entryPoint: portalEntryPoint,
+          },
+        },
+      },
+    );
   // render the portal - this will load the portal template and render it
   render(el, { ref, manifest: portal_manifest, config: portal_config });

package/src/html/register-service-worker.ts CHANGED Viewed

@@ -1,16 +1,30 @@
 import type { ModulesInstance } from '@equinor/fusion-framework-module';
 import type { MsalModule } from '@equinor/fusion-framework-module-msal';
+import { TelemetryLevel, type TelemetryModule } from '@equinor/fusion-framework-module-telemetry';
-export async function registerServiceWorker(framework: ModulesInstance<[MsalModule]>) {
+export async function registerServiceWorker(
+  framework: ModulesInstance<[MsalModule, TelemetryModule]>,
+) {
+  const telemetry = framework.telemetry;
   if ('serviceWorker' in navigator === false) {
-    console.warn('Service workers are not supported in this browser.');
-    return;
+    const exception = new Error('Service workers are not supported in this browser.');
+    exception.name = 'ServiceWorkerNotSupported';
+    telemetry.trackException({
+      name: `registerServiceWorker.${exception.name}`,
+      exception,
+    });
+    throw exception;
   }
   const resourceConfigs = import.meta.env.FUSION_SPA_SERVICE_WORKER_RESOURCES;
   if (!resourceConfigs) {
-    console.warn('Service worker config is not defined.');
-    return;
+    const exception = new Error('Service worker config is not defined.');
+    exception.name = 'ServiceWorkerConfigNotDefined';
+    telemetry.trackException({
+      name: `registerServiceWorker.${exception.name}`,
+      exception,
+    });
+    throw exception;
   }
   /**
@@ -34,14 +48,19 @@ export async function registerServiceWorker(framework: ModulesInstance<[MsalModu
           // extract scopes from the event data
           const scopes = event.data.scopes as string[];
           if (!scopes || !Array.isArray(scopes)) {
-            throw new Error('Invalid scopes provided');
+            const error = new Error('Invalid scopes provided');
+            error.name = 'InvalidScopesProvided';
+            throw error;
           }
           // request a token from the MSAL module
           const token = await framework.auth.acquireToken({ scopes });
           if (!token) {
-            throw new Error('Failed to acquire token');
+            const error = new Error('Failed to acquire token');
+            error.name = 'FailedToAcquireToken';
+            throw error;
           }
           // send the token back to the service worker
@@ -50,6 +69,11 @@ export async function registerServiceWorker(framework: ModulesInstance<[MsalModu
             expiresOn: token.expiresOn?.getTime(),
           });
         } catch (error) {
+          const exception = error as Error;
+          telemetry.trackException({
+            name: `serviceWorker.onMessage.${exception.name}`,
+            exception,
+          });
           event.ports[0].postMessage({
             error: (error as Error).message,
           });
@@ -57,14 +81,26 @@ export async function registerServiceWorker(framework: ModulesInstance<[MsalModu
       }
     });
-    // register the service worker
+    // register the service worker with telemetry
     // updateViaCache: 'none' ensures the service worker script is always fetched fresh
     // This is important during development to pick up code changes
-    const registration = await navigator.serviceWorker.register('/@fusion-spa-sw.js', {
-      type: 'module',
-      scope: '/',
-      updateViaCache: 'none',
+    using measurement = telemetry.measure({
+      name: 'registerServiceWorker',
+      level: TelemetryLevel.Information,
     });
+    const registration = await measurement.clone().resolve(
+      navigator.serviceWorker.register('/@fusion-spa-sw.js', {
+        type: 'module',
+        scope: '/',
+        updateViaCache: 'none',
+      }),
+      {
+        data: {
+          name: 'registerServiceWorker.register',
+          level: TelemetryLevel.Debug,
+        },
+      },
+    );
     // Handle service worker updates/installations
     // If there's a service worker waiting or installing, send config when it activates
@@ -88,7 +124,12 @@ export async function registerServiceWorker(framework: ModulesInstance<[MsalModu
     });
     // wait for the service worker to be ready
-    const readyRegistration = await navigator.serviceWorker.ready;
+    const readyRegistration = await measurement.clone().resolve(navigator.serviceWorker.ready, {
+      data: {
+        name: 'registerServiceWorker.ready',
+        level: TelemetryLevel.Debug,
+      },
+    });
     // ensure we have an active service worker before sending config
     const activeWorker = readyRegistration.active;
@@ -100,27 +141,35 @@ export async function registerServiceWorker(framework: ModulesInstance<[MsalModu
     // CRITICAL: Wait for the service worker to become the controller
     // This ensures the service worker can intercept fetch requests
     if (!navigator.serviceWorker.controller) {
-      await new Promise<void>((resolve) => {
-        let checkInterval: NodeJS.Timeout;
-        const finish = () => {
-          clearInterval(checkInterval);
-          navigator.serviceWorker.removeEventListener('controllerchange', onControllerChange);
-          resolve();
-        };
-        const onControllerChange = () => finish();
-        // If controllerchange fires, the service worker has taken control
-        navigator.serviceWorker.addEventListener('controllerchange', onControllerChange);
-        // Polling fallback and timeout to prevent infinite waiting
-        checkInterval = setInterval(() => {
-          if (navigator.serviceWorker.controller) finish();
-        }, 200);
-        setTimeout(finish, 5000);
-      });
+      await measurement.clone().resolve(
+        new Promise<void>((resolve) => {
+          let checkInterval: NodeJS.Timeout;
+          const finish = () => {
+            clearInterval(checkInterval);
+            navigator.serviceWorker.removeEventListener('controllerchange', onControllerChange);
+            resolve();
+          };
+          const onControllerChange = () => finish();
+          // If controllerchange fires, the service worker has taken control
+          navigator.serviceWorker.addEventListener('controllerchange', onControllerChange);
+          // Polling fallback and timeout to prevent infinite waiting
+          checkInterval = setInterval(() => {
+            if (navigator.serviceWorker.controller) finish();
+          }, 200);
+          setTimeout(finish, 5000);
+        }),
+        {
+          data: {
+            name: 'registerServiceWorker.controllerWait',
+            level: TelemetryLevel.Debug,
+          },
+        },
+      );
     }
     // send the config to the active service worker
@@ -131,6 +180,9 @@ export async function registerServiceWorker(framework: ModulesInstance<[MsalModu
       sendConfigToServiceWorker(navigator.serviceWorker.controller);
     }
   } catch (error) {
-    console.error('Service Worker registration failed:', error);
+    telemetry.trackException({
+      name: `registerServiceWorker.${(error as Error).name}`,
+      exception: error as Error,
+    });
   }
 }

package/src/types.ts CHANGED Viewed

@@ -17,6 +17,10 @@ export type FusionTemplateEnv = {
   /** Template bootstrap file path */
   bootstrap: string;
+  telemetry?: {
+    consoleLevel?: number;
+  };
   /** Id of the portal to load */
   portal: {
     id: string;

package/src/version.ts CHANGED Viewed

@@ -1,2 +1,2 @@
 // Generated by genversion.
-export const version = '1.1.2';
+export const version = '1.1.4';

package/tsconfig.json CHANGED Viewed

@@ -21,6 +21,9 @@
     {
       "path": "../../modules/service-discovery"
     },
+    {
+      "path": "../../modules/telemetry"
+    },
     {
       "path": "../../modules/services"
     }