npm - @elliemae/ssf-host - Versions diffs - 2.23.6 → 2.24.0 - Mend

@elliemae/ssf-host 2.23.6 → 2.24.0

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 (91) hide show

package/dist/cjs/callchain-host.html +262 -0
package/dist/cjs/callchain-intermediate.html +92 -0
package/dist/cjs/e2e-host.html +603 -0
package/dist/cjs/e2e-index.html +234 -0
package/dist/cjs/host.js +93 -36
package/dist/cjs/index.html +304 -151
package/dist/cjs/popup-focus-host.html +318 -0
package/dist/cjs/utils.js +14 -1
package/dist/cjs/v2-host-v1-guest.html +3 -0
package/dist/esm/callchain-host.html +262 -0
package/dist/esm/callchain-intermediate.html +92 -0
package/dist/esm/e2e-host.html +603 -0
package/dist/esm/e2e-index.html +234 -0
package/dist/esm/host.js +94 -37
package/dist/esm/index.html +304 -151
package/dist/esm/popup-focus-host.html +318 -0
package/dist/esm/utils.js +14 -1
package/dist/esm/v2-host-v1-guest.html +3 -0
package/dist/public/callchain-host.html +34 -0
package/dist/public/callchain-host.js +3 -0
package/dist/public/callchain-host.js.br +0 -0
package/dist/public/callchain-host.js.gz +0 -0
package/dist/public/callchain-host.js.map +1 -0
package/dist/public/callchain-intermediate.html +1 -0
package/dist/public/e2e-host.html +5 -0
package/dist/public/e2e-host.js +8 -0
package/dist/public/e2e-host.js.br +0 -0
package/dist/public/e2e-host.js.gz +0 -0
package/dist/public/e2e-host.js.map +1 -0
package/dist/public/e2e-index.html +1 -0
package/dist/public/index.html +1 -1
package/dist/public/init.js +1 -1
package/dist/public/init.js.br +0 -0
package/dist/public/init.js.gz +0 -0
package/dist/public/init.js.map +1 -1
package/dist/public/js/emuiSsfHost.071827d0d7e775690fbb.js +3 -0
package/dist/public/js/emuiSsfHost.071827d0d7e775690fbb.js.br +0 -0
package/dist/public/js/emuiSsfHost.071827d0d7e775690fbb.js.gz +0 -0
package/dist/public/js/emuiSsfHost.071827d0d7e775690fbb.js.map +1 -0
package/dist/public/loan-object.js +1 -1
package/dist/public/loan-object.js.br +0 -0
package/dist/public/loan-object.js.gz +0 -0
package/dist/public/loan-object.js.map +1 -1
package/dist/public/popup-focus-host.html +1 -0
package/dist/public/popup-focus-host.js +6 -0
package/dist/public/popup-focus-host.js.br +0 -0
package/dist/public/popup-focus-host.js.gz +0 -0
package/dist/public/popup-focus-host.js.map +1 -0
package/dist/public/v1-guest-v2-host.html +1 -1
package/dist/public/v2-host-v1-guest.html +1 -1
package/dist/types/lib/host.d.ts +1 -0
package/dist/types/lib/ihost.d.ts +15 -0
package/dist/types/lib/tests/timingDedup.test.d.ts +1 -0
package/dist/types/lib/utils.d.ts +1 -0
package/dist/types/tsconfig.tsbuildinfo +1 -1
package/dist/umd/callchain-host.html +34 -0
package/dist/umd/callchain-host.js +3 -0
package/dist/umd/callchain-host.js.br +0 -0
package/dist/umd/callchain-host.js.gz +0 -0
package/dist/umd/callchain-host.js.map +1 -0
package/dist/umd/callchain-intermediate.html +1 -0
package/dist/umd/e2e-host.html +5 -0
package/dist/umd/e2e-host.js +8 -0
package/dist/umd/e2e-host.js.br +0 -0
package/dist/umd/e2e-host.js.gz +0 -0
package/dist/umd/e2e-host.js.map +1 -0
package/dist/umd/e2e-index.html +1 -0
package/dist/umd/index.html +1 -1
package/dist/umd/index.js +1 -1
package/dist/umd/index.js.br +0 -0
package/dist/umd/index.js.gz +0 -0
package/dist/umd/index.js.map +1 -1
package/dist/umd/init.js +1 -1
package/dist/umd/init.js.br +0 -0
package/dist/umd/init.js.gz +0 -0
package/dist/umd/init.js.map +1 -1
package/dist/umd/loan-object.js +1 -1
package/dist/umd/loan-object.js.br +0 -0
package/dist/umd/loan-object.js.gz +0 -0
package/dist/umd/loan-object.js.map +1 -1
package/dist/umd/popup-focus-host.html +1 -0
package/dist/umd/popup-focus-host.js +6 -0
package/dist/umd/popup-focus-host.js.br +0 -0
package/dist/umd/popup-focus-host.js.gz +0 -0
package/dist/umd/popup-focus-host.js.map +1 -0
package/dist/umd/v2-host-v1-guest.html +1 -1
package/package.json +5 -5
package/dist/public/js/emuiSsfHost.5855ec3cd0fa60013d84.js +0 -3
package/dist/public/js/emuiSsfHost.5855ec3cd0fa60013d84.js.br +0 -0
package/dist/public/js/emuiSsfHost.5855ec3cd0fa60013d84.js.gz +0 -0
package/dist/public/js/emuiSsfHost.5855ec3cd0fa60013d84.js.map +0 -1

package/dist/cjs/e2e-index.html ADDED Viewed

@@ -0,0 +1,234 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>SSF E2E Test Suite</title>
+    <script src="https://cdn.tailwindcss.com?plugins=forms"></script>
+  </head>
+  <body class="bg-gray-50">
+    <header class="bg-gray-900 text-white px-6 py-4">
+      <h1 class="text-xl font-bold">SSF End-to-End Test Suite</h1>
+      <p class="text-sm text-gray-400 mt-1">
+        Comprehensive blackbox tests for SSF Host &amp; Guest. Each page
+        includes test steps, expected values, and a verification checklist.
+      </p>
+    </header>
+    <main class="mx-auto max-w-5xl px-6 py-6">
+      <!-- Setup -->
+      <section
+        class="mb-6 bg-yellow-50 border border-yellow-200 rounded-lg p-4"
+      >
+        <h2 class="text-sm font-semibold text-yellow-800 mb-2">
+          Setup Instructions
+        </h2>
+        <ol class="text-xs text-yellow-700 list-decimal ml-4 space-y-1">
+          <li>
+            Install dependencies:
+            <code class="bg-yellow-100 px-1 rounded">pnpm install</code>
+          </li>
+          <li>
+            Start SSF Host dev server:
+            <code class="bg-yellow-100 px-1 rounded"
+              >pnpm nx run ssf-host:start-server</code
+            >
+            (port 4000)
+          </li>
+          <li>
+            Start SSF Guest dev server:
+            <code class="bg-yellow-100 px-1 rounded"
+              >pnpm nx run ssf-guest:start</code
+            >
+            (port 4001)
+          </li>
+          <li>
+            Open
+            <code class="bg-yellow-100 px-1 rounded"
+              >http://localhost:4000/e2e-index.html</code
+            >
+            in the browser
+          </li>
+          <li>
+            Each test page has
+            <code class="bg-yellow-100 px-1 rounded">data-testid</code>
+            attributes for Playwright/Cypress selectors
+          </li>
+        </ol>
+      </section>
+      <!-- 1. Core Host-Guest Communication -->
+      <section class="mb-6">
+        <h2 class="text-lg font-semibold text-gray-800 border-b pb-1 mb-3">
+          1. Core Host-Guest Communication
+        </h2>
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-3">
+          <a
+            href="./e2e-host.html"
+            data-testid="link-e2e-host"
+            class="block bg-white rounded-lg shadow p-4 hover:shadow-md transition"
+          >
+            <h3 class="font-medium text-indigo-700">Comprehensive E2E Host</h3>
+            <p class="text-xs text-gray-500 mt-1">
+              All host-guest scenarios: guest loading, scripting objects,
+              events, lifecycle, metadata, sandbox, guest-scoped objects.
+            </p>
+            <p class="text-xs text-gray-400 mt-2">
+              <strong>What to verify:</strong> Guests load in iframes/popups.
+              Scripting objects can be added/removed/invoked. Events reach
+              subscribed guests. Unload/close cleans up properly. Sandbox attrs
+              applied.
+            </p>
+            <div class="mt-2 text-xs text-gray-400">
+              <strong>Test Cases:</strong>
+              TC-LOAD-01..05 &bull; TC-SO-01..08 &bull; TC-EVT-01..04 &bull;
+              TC-LIFE-01..03 &bull; TC-META-01 &bull; TC-SB-01..03
+            </div>
+          </a>
+          <a
+            href="./index.html"
+            data-testid="link-main-demo"
+            class="block bg-white rounded-lg shadow p-4 hover:shadow-md transition"
+          >
+            <h3 class="font-medium text-indigo-700">Main Demo App</h3>
+            <p class="text-xs text-gray-500 mt-1">
+              Original Loan Application demo with embedded and popup guests,
+              events, scripting objects.
+            </p>
+            <p class="text-xs text-gray-400 mt-2">
+              <strong>What to verify:</strong> Loan form data flows to guests.
+              Events (onLoanAmountChanged, etc.) update guest UIs. Popup guests
+              open and interact with the Loan object.
+            </p>
+          </a>
+        </div>
+      </section>
+      <!-- 2. CallChain & Metadata -->
+      <section class="mb-6">
+        <h2 class="text-lg font-semibold text-gray-800 border-b pb-1 mb-3">
+          2. Call Chain &amp; Metadata Propagation
+        </h2>
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-3">
+          <a
+            href="./callchain-host.html"
+            data-testid="link-callchain"
+            class="block bg-white rounded-lg shadow p-4 hover:shadow-md transition"
+          >
+            <h3 class="font-medium text-indigo-700">
+              Nested CallChain Test (A → B → C)
+            </h3>
+            <p class="text-xs text-gray-500 mt-1">
+              Root Host (A) → Intermediate Guest+Host (B) → Grandchild Guest
+              (C). Verifies callContext.callChain and metadata propagation.
+            </p>
+            <p class="text-xs text-gray-400 mt-2">
+              <strong>What to verify:</strong> Click buttons in Grandchild C.
+              Host A should show <code>callContext.guest</code> = B and
+              <code>callChain</code> containing C and B with their metadata.
+              Return values should flow back to C.
+            </p>
+            <div class="mt-2 text-xs text-gray-400">
+              <strong>Test Cases:</strong> TC-CC-01..07
+            </div>
+          </a>
+        </div>
+      </section>
+      <!-- 3. Popup Behavior -->
+      <section class="mb-6">
+        <h2 class="text-lg font-semibold text-gray-800 border-b pb-1 mb-3">
+          3. Popup Guest Behavior
+        </h2>
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-3">
+          <a
+            href="./popup-focus-host.html"
+            data-testid="link-popup-focus"
+            class="block bg-white rounded-lg shadow p-4 hover:shadow-md transition"
+          >
+            <h3 class="font-medium text-indigo-700">
+              Popup Focus &amp; Lifecycle
+            </h3>
+            <p class="text-xs text-gray-500 mt-1">
+              Open, close, and refocus popup guests. Tests trusted vs untrusted
+              domain behavior.
+            </p>
+            <p class="text-xs text-gray-400 mt-2">
+              <strong>What to verify:</strong> Trusted popups (localhost):
+              re-open brings existing popup to front. Untrusted popups: opener
+              is nulled, focus falls back to WindowProxy. Closed popup detection
+              updates guest status.
+            </p>
+            <div class="mt-2 text-xs text-gray-400">
+              <strong>Test Cases:</strong> TC-POP-01..11
+            </div>
+          </a>
+        </div>
+      </section>
+      <!-- 4. V1/V2 Interoperability -->
+      <section class="mb-6">
+        <h2 class="text-lg font-semibold text-gray-800 border-b pb-1 mb-3">
+          4. V1 / V2 Interoperability
+        </h2>
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-3">
+          <a
+            href="./v2-host-v1-guest.html"
+            data-testid="link-v2-host-v1-guest"
+            class="block bg-white rounded-lg shadow p-4 hover:shadow-md transition"
+          >
+            <h3 class="font-medium text-indigo-700">V2 Host → V1 Guest</h3>
+            <p class="text-xs text-gray-500 mt-1">
+              V2 host loads V1 guest. Loan object, save flow, event feedback.
+            </p>
+            <p class="text-xs text-gray-400 mt-2">
+              <strong>What to verify:</strong> V1 guest connects, gets objects,
+              subscribes to events, and returns feedback correctly.
+            </p>
+            <div class="mt-2 text-xs text-gray-400">
+              <strong>Test Cases:</strong> TC-INTEROP-01..04
+            </div>
+          </a>
+          <a
+            href="./v2-host-v1-guest.html?nestV1GuestV2Host=true"
+            data-testid="link-v2-v1-v2-chain"
+            class="block bg-white rounded-lg shadow p-4 hover:shadow-md transition"
+          >
+            <h3 class="font-medium text-indigo-700">
+              V2 Host → V1 Guest → V2 Host → V2 Guest
+            </h3>
+            <p class="text-xs text-gray-500 mt-1">
+              Full mixed-version chain. V1 guest acts as intermediate host for a
+              V2 grandchild.
+            </p>
+            <p class="text-xs text-gray-400 mt-2">
+              <strong>What to verify:</strong> Scripting objects are cloned
+              across V1/V2 boundary. Events flow through all layers.
+            </p>
+            <div class="mt-2 text-xs text-gray-400">
+              <strong>Test Cases:</strong> TC-INTEROP-05..07
+            </div>
+          </a>
+        </div>
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-3 mt-3">
+          <a
+            href="./v1-host.html"
+            data-testid="link-v1-host"
+            class="block bg-white rounded-lg shadow p-4 hover:shadow-md transition"
+          >
+            <h3 class="font-medium text-indigo-700">
+              V1 Host → V1 Guest → V2 Host → V2 Guest
+            </h3>
+            <p class="text-xs text-gray-500 mt-1">
+              Starting from V1 host. Exercises the full V1-to-V2 upgrade path.
+            </p>
+            <p class="text-xs text-gray-400 mt-2">
+              <strong>What to verify:</strong> V1 host initializes. V1 guest
+              connects. V2 host/guest chain works through V1 intermediate.
+            </p>
+          </a>
+        </div>
+      </section>
+    </main>
+  </body>
+</html>

package/dist/cjs/host.js CHANGED Viewed

@@ -93,6 +93,21 @@ class SSFHost {
    * callback for guest event unsubscription
    */
   #onGuestEventUnsubscribe = null;
+  /**
+   * host-supplied metadata keyed by guest id, forwarded in callChain
+   */
+  #guestMetadata = /* @__PURE__ */ new Map();
+  /**
+   * Tracks the last time a timing measurement was recorded for each metric name.
+   * Used to skip redundant startTiming/endTiming cross-window calls for
+   * the same API or event within the dedup window.
+   */
+  #timingLastRecorded = /* @__PURE__ */ new Map();
+  /**
+   * Minimum interval (ms) between timing measurements for the same metric name.
+   */
+  #timingDedupWindowMs;
+  static DEFAULT_TIMING_DEDUP_WINDOW_MS = 1e4;
   /**
    * Create a new host
    * @param hostId unique identifier for the host
@@ -104,6 +119,7 @@ class SSFHost {
     if (!option?.analyticsObj) throw new Error("Analytics object is required");
     this.#logger = option.logger;
     this.#analyticsObj = option.analyticsObj;
+    this.#timingDedupWindowMs = option?.timingDedupWindowMs ?? SSFHost.DEFAULT_TIMING_DEDUP_WINDOW_MS;
     this.#correlationId = (0, import_uuid.v4)();
     this.#remoting = new import_microfe_common.Remoting(this.#logger, this.#correlationId);
     if (option?.readyStateCallback && typeof option?.readyStateCallback !== "function")
@@ -139,6 +155,22 @@ class SSFHost {
       this.#logger.debug(`Analytics endTiming failed: ${e.message}`);
     });
   };
+  /**
+   * Returns true if a timing measurement should be recorded for the given
+   * metric name. Skips the measurement when one was already recorded for the
+   * same name within the configured dedup window ({@link HostOption.timingDedupWindowMs}).
+   * Always returns true when dedup is disabled (window = 0).
+   * @param name
+   */
+  #shouldTrackTiming = (name) => {
+    if (this.#timingDedupWindowMs <= 0) return true;
+    const now = performance.now();
+    const last = this.#timingLastRecorded.get(name);
+    if (last !== void 0 && now - last < this.#timingDedupWindowMs)
+      return false;
+    this.#timingLastRecorded.set(name, now);
+    return true;
+  };
   #closeAllPopupGuests = () => {
     const popupIds = Array.from(this.#guests.values()).filter((guest) => guest.openMode === import_types.OpenMode.Popup).map((guest) => guest.id);
     popupIds.forEach((id) => this.unloadGuest(id));
@@ -204,7 +236,8 @@ class SSFHost {
     guest,
     obj,
     functionName,
-    functionParams
+    functionParams,
+    callerChain
   }) => {
     const func = obj[functionName];
     if (!(0, import_utils.isFunction)(func)) {
@@ -222,7 +255,10 @@ class SSFHost {
     );
     return new Promise((resolve) => {
       Object.defineProperty(func, "callContext", {
-        value: { guest },
+        value: {
+          guest,
+          ...callerChain?.length ? { callChain: callerChain } : {}
+        },
         configurable: true,
         enumerable: true,
         writable: true
@@ -505,7 +541,7 @@ class SSFHost {
     requestId,
     body
   }) => {
-    const { objectId } = body;
+    const { objectId, callerChain } = body;
     const guest = this.#getGuestForWindow(sourceWin);
     if (!guest) {
       this.#logger.warn(
@@ -530,15 +566,20 @@ class SSFHost {
       return false;
     }
     const guestInfo = guest.getInfo();
-    this.#startTiming(`ScriptingObject.API.${objectId}.${body.functionName}`, {
-      appId: guestInfo.guestId,
-      appUrl: guestInfo.guestUrl
-    });
+    const timingName = `ScriptingObject.API.${objectId}.${body.functionName}`;
+    const trackTiming = this.#shouldTrackTiming(timingName);
+    if (trackTiming) {
+      this.#startTiming(timingName, {
+        appId: guestInfo.guestId,
+        appUrl: guestInfo.guestUrl
+      });
+    }
     this.#invoke({
       guest,
       obj,
       functionName: body.functionName,
-      functionParams: body.functionParams
+      functionParams: body.functionParams,
+      callerChain
     }).then((val) => {
       this.#remoting.respond({
         targetWin: sourceWin,
@@ -568,13 +609,12 @@ class SSFHost {
         ...guestInfo
       });
     }).finally(() => {
-      this.#endTiming(
-        `ScriptingObject.API.${objectId}.${body.functionName}`,
-        {
+      if (trackTiming) {
+        this.#endTiming(timingName, {
           appId: guestInfo.guestId,
           appUrl: guestInfo.guestUrl
-        }
-      );
+        });
+      }
     });
     return true;
   };
@@ -717,10 +757,11 @@ class SSFHost {
     let guest = this.#getGuestForUrl(url);
     if (guest) {
       if (!guest.window.closed) {
-        guest.send({
-          messageType: import_microfe_common.MessageType.GuestFocus,
-          messageBody: {}
-        });
+        if ((0, import_utils.isTrustedDomain)(url)) {
+          window.open("", title);
+        } else {
+          guest.window.focus();
+        }
       }
     } else {
       const windowFeatures = Object.entries({ width, height, top, left }).filter(([, v]) => v).map(([k, v]) => `${k}=${v}`).join(",");
@@ -747,7 +788,9 @@ class SSFHost {
           }
         }, 0);
       }
-      guestWindow.opener = null;
+      if (!(0, import_utils.isTrustedDomain)(url)) {
+        guestWindow.opener = null;
+      }
       guest = this.#attachGuest({
         guestId,
         window: guestWindow,
@@ -914,6 +957,22 @@ class SSFHost {
       } else if ((0, import_utils.isFunction)(propValue)) {
         Object.defineProperty(so, propName, {
           value: async (...args) => {
+            const callerCtx = so[propName]?.callContext;
+            if (callerCtx?.guest) {
+              const existingChain = callerCtx.callChain ?? [];
+              const guestId = callerCtx.guest.id;
+              const meta = this.#guestMetadata.get(guestId);
+              const callerEntry = { id: guestId };
+              if (meta) callerEntry.metadata = meta;
+              Object.defineProperty(propValue, "callContext", {
+                value: {
+                  callChain: [...existingChain, callerEntry]
+                },
+                configurable: true,
+                enumerable: true,
+                writable: true
+              });
+            }
             const retVal = await propValue(...args);
             return (0, import_microfe_common.isScriptingObjectProxy)(retVal) ? this.cloneScriptingObject(retVal) : retVal;
           },
@@ -948,6 +1007,7 @@ class SSFHost {
       this.#popupGuestMonitor = null;
     }
     this.#closeAllPopupGuests();
+    this.#guestMetadata.clear();
     this.#remoting.close();
     window.removeEventListener("beforeunload", this.#closeAllPopupGuests);
     this.#logger.debug(
@@ -998,19 +1058,17 @@ class SSFHost {
       };
     }
     const guestPromises = [];
+    const eventTimingName = `ScriptingObject.Event.${scriptingObject.id}.${name}`;
     let timingMetricStarted = false;
     const dispatchToGuest = (guest) => {
       const guestInfo = guest.getInfo();
       if (timeout && guest?.capabilities?.eventFeedback) {
         guestPromises.push(guest.dispatchEvent(eventObj, timeout));
-        if (!timingMetricStarted) {
-          this.#startTiming(
-            `ScriptingObject.Event.${scriptingObject.id}.${name}`,
-            {
-              appId: this.hostId,
-              appUrl: window.location.href
-            }
-          );
+        if (!timingMetricStarted && this.#shouldTrackTiming(eventTimingName)) {
+          this.#startTiming(eventTimingName, {
+            appId: this.hostId,
+            appUrl: window.location.href
+          });
           timingMetricStarted = true;
         }
         this.#logger.debug({
@@ -1035,7 +1093,7 @@ class SSFHost {
     } else {
       this.#guests.forEach(dispatchToGuest);
     }
-    const retValue = await Promise.all(guestPromises).then((values) => {
+    return Promise.all(guestPromises).then((values) => {
       this.#logger.debug({
         message: "Event feedback received",
         scriptingEventId: id
@@ -1050,15 +1108,11 @@ class SSFHost {
       throw ex;
     }).finally(() => {
       if (timingMetricStarted)
-        this.#endTiming(
-          `ScriptingObject.Event.${scriptingObject.id}.${name}`,
-          {
-            appId: this.hostId,
-            appUrl: window.location.href
-          }
-        );
+        this.#endTiming(eventTimingName, {
+          appId: this.hostId,
+          appUrl: window.location.href
+        });
     });
-    return retValue;
   };
   /**
    * get reference to all guest applications
@@ -1086,7 +1140,8 @@ class SSFHost {
       searchParams = {},
       onLoad,
       onError,
-      options = {}
+      options = {},
+      metadata
     } = param;
     if (!guestId) throw new Error("id for guest application is required");
     let instanceId = guestId;
@@ -1128,6 +1183,7 @@ class SSFHost {
     } else {
       throw new Error(`Invalid openMode: ${openMode}`);
     }
+    if (metadata) this.#guestMetadata.set(instanceId, metadata);
     this.#logger.audit({
       message: "Guest loaded",
       ...guest.getInfo()
@@ -1193,6 +1249,7 @@ class SSFHost {
       guest.dispose();
       this.#guestsByWindow.delete(guest.window);
       this.#guestsByUrl.delete(guest.url);
+      this.#guestMetadata.delete(guest.id);
       this.#guests.delete(guest.id);
       this.#logger.audit({
         message: `Guest is removed from host`,