@ideem/zsm-client-sdk 2.4.0 → 2.4.1

package/{RELEASE_NOTES.txt → CHANGELOG.md}

@@ -1,6 +1,6 @@
 ZSM Client SDK for Browser Apps
-Latest version: v2.3.0
-Latest release date: March 24, 2025
+Latest version: v2.4.1
+Latest release date: May 5, 2025
 
 The ZSM Client SDK for Browser Apps provides the resources needed to integrate Ideem's FIDO2 Authenticator
 and Universal MFA into a browser application. 
@@ -15,7 +15,15 @@ and Universal MFA into a browser application.
 
 ----
 
-## Release 2.4.0 - May 1, 2025 [ NPM PACKAGE RELEASE ] **[ LATEST ]**
+## Release 2.4.1 - May 5, 2025 [ NPM PACKAGE RELEASE ] **[ LATEST ]**
+- Minor bug fixes and improvements
+- Updates to documentation
+- Updates to sample apps
+- Alters worker communication protocol to ensure that the worker is not blocked 
+  by the main thread and vice versa, while still ensuring that the initialization
+  of the worker is completed before any other operations are performed.
+
+## Release 2.4.0 - May 1, 2025
 - Minor bug fixes and improvements
 - Updates to documentation
 - Adds event emitters to the UMFAClient and FIDO2Client for on-the-fly initializations

package/ZSMClientSDK.js

@@ -21,10 +21,23 @@ class WorkerError extends Error {
 
 class ZSMClientBase {
     constructor(config) {
-        this.config                = config;
+        GLOBAL.zsmClient           = null;
         this.clientWorker          = null;
         this.timeoutTimer          = null;
-        GLOBAL.zsmClient           = null;
+        this.clientType            = null;
+        this.ready                 = false;
+        this.config                = config;
+    }
+
+    onReady(onReadyFn=null) {
+        return new Promise((resolve) => {
+            if(this.ready) return resolve(true);
+            window.addEventListener(`${this.clientType}Ready`, async (e) => {
+                this.ready = true;
+                if(onReadyFn) await onReadyFn?.();
+                resolve(this);
+            }, { once: true });
+        });
     }
 
     /**
@@ -35,7 +48,10 @@ class ZSMClientBase {
      * @returns         {Promise<ZSMClientBase>}                    A promise that resolves to the initialized ZSMClient instance.
      */
     async init(clientType='UMFAClient', config=this.config) {
-        if(GLOBAL.clientWorker) GLOBAL.clientWorker.terminate();
+        this.onReady();
+        this.ready          = false;
+        this.clientType     = clientType;
+        
         const workerPath    = GLOBAL?.workerPath ? GLOBAL.workerPath
                             : config?.workerPath ? config.workerPath
                             : './worker.js';
@@ -58,6 +74,11 @@ class ZSMClientBase {
      * @returns         {Promise<Object>}                           A promise that resolves with the result of the worker function.
      */
     async callWorkerFunction(functionName, data, responseExpected=true) {
+        if (functionName !== 'init' && !this.ready) await this.onReady();
+        if(!this.clientWorker) {
+            console.error('Worker not initialized. Please call init() before using this method.');
+            return Promise.reject(new WorkerError('Worker', 'Worker not initialized. Please call init() before using this method.'));
+        }
         let workerPromise = new Promise((resolve, reject) => {
             this.clientWorker.postMessage({functionName, data });
             if(responseExpected) this.timeoutTimer = GLOBAL.setTimeout(() => reject(new WorkerError('Transaction', 'Transaction timed out after 60 seconds!')), 60000);
@@ -67,7 +88,7 @@ class ZSMClientBase {
 
                 let workerResponse = event.data;
 
-                if(GLOBAL.showWorkerTelemetry && (workerResponse.result || workerResponse.error)) {
+                if((GLOBAL.showWorkerTelemetry) && (workerResponse.result || workerResponse.error)) {
                     console.groupCollapsed(`%cWorker posted to Main Thread a response to invocation:`, 'font-weight:bold; color:#F60;', functionName)
                     console.log(`%c   Function Invoked:`, 'font-weight:100; color:#AAA;', workerResponse.functionName);
                     console.log(`%c   Success Status:`, 'font-weight:100; color:#AAA;', workerResponse.success ? 'true' : 'false');
@@ -110,31 +131,32 @@ class ZSMClientBase {
 class UMFAClient extends ZSMClientBase {
     constructor(config) {
         super(config);
+        this.clientType            = 'UMFAClient';
         this.init                  = super.init.bind(this);
         this.callWorkerFunction    = super.callWorkerFunction.bind(this);
+        // this.onReady               = super.onReady.bind(this);
         this.checkEnrollment       = this.checkEnrollment.bind(this);
         this.enroll                = this.enroll.bind(this);
         this.authenticate          = this.authenticate.bind(this);
-        this.optimizedEnroll       = this.optimizedEnroll.bind(this);
-        this.optimizedAuthenticate = this.optimizedAuthenticate.bind(this);
+        this.unenroll              = this.unenroll.bind(this);
         this.init('UMFAClient');
     }
 
-    async checkEnrollment(user)       { return await this.callWorkerFunction('checkEnrollment',       user); }
-    async enroll(user)                { return await this.callWorkerFunction('enroll',                user); }
-    async authenticate(user)          { return await this.callWorkerFunction('authenticate',          user); }
-    async optimizedEnroll(user)       { return await this.callWorkerFunction('optimizedEnroll',       user); }
-    async optimizedAuthenticate(user) { return await this.callWorkerFunction('optimizedAuthenticate', user); }
-    async unenroll(user)              { return await this.callWorkerFunction('unenroll',              user); }
+    checkEnrollment(user)       { return this.callWorkerFunction('checkEnrollment',       user); }
+    enroll(user)                { return this.callWorkerFunction('enroll',                user); }
+    authenticate(user)          { return this.callWorkerFunction('authenticate',          user); }
+    unenroll(user)              { return this.callWorkerFunction('unenroll',              user); }
 }
 
 class FIDO2Client extends ZSMClientBase {
     constructor(config) {
         super(config);
+        this.clientType            = 'FIDO2Client';
         this.init                  = super.init.bind(this);
         this.callWorkerFunction    = super.callWorkerFunction.bind(this);
-        this.checkEnrollment       = this.checkEnrollment.bind(this);
+        this.onReady               = super.onReady.bind(this);
         this.checkIdentity         = this.checkIdentity.bind(this);
+        this.checkEnrollment       = this.checkEnrollment.bind(this);
         this.webauthnCreate        = this.webauthnCreate.bind(this);
         this.webauthnGet           = this.webauthnGet.bind(this);
         this.webauthnRetrieve      = this.webauthnRetrieve.bind(this);
@@ -142,12 +164,12 @@ class FIDO2Client extends ZSMClientBase {
         this.init('FIDO2Client');
     }
 
-    async checkIdentity(user, auto=true) { return await this.callWorkerFunction('checkIdentity',   [user, auto]); }
-    async checkEnrollment(user)          { return await this.callWorkerFunction('checkEnrollment',  user); }
-    async webauthnCreate(user)           { return await this.callWorkerFunction('webauthnCreate',   user); }
-    async webauthnGet(user)              { return await this.callWorkerFunction('webauthnGet',      user); }
-    async webauthnRetrieve(user)         { return await this.callWorkerFunction('webauthnRetrieve', user); }
-    async webauthnDelete(user)           { return await this.callWorkerFunction('webauthnDelete',   user); }
+    checkIdentity    = (user, auto=true) => this.callWorkerFunction('checkIdentity',   [user, auto]);
+    checkEnrollment  = (user)            => this.callWorkerFunction('checkEnrollment',  user);
+    webauthnCreate   = (user)            => this.callWorkerFunction('webauthnCreate',   user);
+    webauthnGet      = (user)            => this.callWorkerFunction('webauthnGet',      user);
+    webauthnRetrieve = (user)            => this.callWorkerFunction('webauthnRetrieve', user);
+    webauthnDelete   = (user)            => this.callWorkerFunction('webauthnDelete',   user);
 }
 
 function amendPerformanceLoggingToClass(cls) {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ideem/zsm-client-sdk",
-    "version": "2.4.0",
+    "version": "2.4.1",
     "description": "ZSM makes 2FA easy and invisible for everyone, all the time, using advanced cryptography like MPC to establish cryptographic proof of the origin of any transaction or login attempt, while eliminating opportunities for social engineering. ZSM has no reliance on specific hardware. Our cryptographic module has completed FIPS 140-3 NIST approved lab testing, is FIDO2-ready, and is on the Modules In Progress (MIP) list. Superior Usability. no opt-in, no codes, no downloads, no authenticator apps. Better Security.",
     "author": "@JJ (Jason Jurusz) <jj@useideem.com>/<nerdy.deeds@done.cheap>",
     "keywords": [
@@ -40,7 +40,7 @@
     "files": [
         "worker.js",
         "ZSMClientSDK.js",
-        "RELEASE_NOTES.txt",
+        "CHANGELOG.md",
         "LICENSE",
         "README.md"
     ],

package/worker.js

@@ -16,12 +16,13 @@ GLOBAL.clientsReadyDash    = {
 
 GLOBAL.checkReadiness = (client=null, status=null) => {
     let retVal = false;
-    if(GLOBAL.showWorkerTelemetry) console.log('GLOBAL.checkReadiness(client, status):', client, status, Object.values(GLOBAL.clientsReadyDash).reduce((c,i)=>!!c && !!i, true));
     if(status != null) retVal = (GLOBAL.clientsReadyDash[client] = status);
     else if(client != null) retVal = GLOBAL.clientsReadyDash[client];
+    if(GLOBAL.showWorkerTelemetry) console.log('GLOBAL.checkReadiness(client, status):', client, status, '\n   Fully initialized?', Object.values(GLOBAL.clientsReadyDash).every(v=>v));
 
     const allClientsReady = retVal = Object.values(GLOBAL.clientsReadyDash).every(v=>v);
     if(allClientsReady) {
+        GLOBAL.dispatchEvent(new CustomEvent(`${GLOBAL.clientType}Ready`, {bubbles: true, cancelable: false, detail: true }));
         GLOBAL.dispatchEventToMain(`${GLOBAL.clientType}Ready`, true);
         GLOBAL.checkReadiness = () => true;
     }
@@ -150,7 +151,7 @@ GLOBAL.uid2iid = (uid, iid) => {
     idbInstance.onsuccess = (e, db=e.target.result) => {
         const zsmTbl      = db.transaction("zsm", "readwrite");
         const write       = zsmTbl.objectStore("zsm").put(iid, uid);
-        write.onsuccess   = () => (db.close(), console.log(`Bound UID "${uid}" to IID "${iid}".`));
+        write.onsuccess   = () => (db.close());
         write.onerror     = (err=write.error) => (db.close(), console.error(`Unable to bind UID to IID:\n${err}`));
     };
 }
@@ -1687,7 +1688,6 @@ class RelyingParty {
      * @returns         {Promise<Object>}  Resolves with the response data.
      */
     makePostRequest = (url, body={}, headers={}, method='POST') => {
-        console.log('this.customerDefinedIdentifier :', this.customerDefinedIdentifier);
         url = `${this.host.endsWith('/') ? this.host.slice(0,-1) : this.host}/${url.startsWith('/') ? url.slice(1) : url}`;
         body = ((typeof body === 'object') ? body : {});
         body = Object.assign({customer_defined_identifier: this.customerDefinedIdentifier, application_id: this.applicationId}, body);
@@ -1885,8 +1885,9 @@ class WebAuthnClient {
 
         if(!config?.authenticator_host_url) config.authenticator_host = config.authenticator_host_url = config.host_url;
         if(!config?.zsm_host_url)           config.zsm_host_url       = config.zsm_host = config.host_url.replace("zsm-authenticator", "zsm");
+        config.host_url = config.zsm_host_url;
 
-        this.config      = config;
+        this.config      = GLOBAL.zsmAppConfig = config;
         GLOBAL.iid4uid(this.config.consumer_id)
         .then(v=>{
             GLOBAL.mpcConfig = Object.assign({}, config, {consumer_id: v});
@@ -1935,11 +1936,13 @@ class WebAuthnClient {
      */
     initializeZsm = async () => {
         if(GLOBAL.mpcConfig.consumer_id !== this.MPCConfig.consumer_id) {
-            await this.zsmApi.configure(GLOBAL.mpcConfig);
-            this.MPCConfig = Object.assign({}, GLOBAL.mpcConfig);
-            GLOBAL.uid2iid(this.config.consumer_id, this.MPCConfig.consumer_id);
+            // console.log('GLOBAL.mpcConfig :', Object.assign({},GLOBAL.mpcConfig));
+            let xyz = await this.zsmApi.configure(GLOBAL.mpcConfig);
+            await setTimeout(() => Promise.resolve(), 5000);
+            this.MPCConfig = await Object.assign({}, GLOBAL.mpcConfig);
+            await GLOBAL.uid2iid(this.config.consumer_id, this.MPCConfig.consumer_id);
         }
-        return this.zsmApi;
+        return await this.zsmApi;
     }
 
     /**
@@ -2244,7 +2247,7 @@ class WebAuthnClient {
         await this.initializeZsm('unbindFromDevice');
 
         const rawID = await this.webauthnRetrieve(userIdentifier);
-        if (!rawID) throw new Error(`[unenroll] unbindFromDevice failed :: ${userIdentifier} is not enrolled!`);
+        if (!rawID) return false;
 
         const request = indexedDB.open("ideem", 1);
         request.onsuccess = function(event) {
@@ -2287,6 +2290,8 @@ GLOBAL.UMFAClient = class UMFAClient {
         this.authenticate    = this.authenticate.bind(this);
         this.resetDevice     = this.resetDevice.bind(this);
         this.unenroll        = this.unenroll.bind(this);
+        this.loaded          = false;
+        GLOBAL.addEventListener(`${GLOBAL.clientType}Ready`, (e) => this.loaded=true);
         GLOBAL.dispatchEvent(new CustomEvent("ActiveClientReady", {bubbles: true, cancelable: false, detail: true }));
     }