@fat-zebra/sdk 2.0.1-beta.10 → 2.0.1-beta.12

package/dist/hpp/hpp.d.ts

@@ -13,7 +13,7 @@ interface HppModuleConfig {
     username: string;
     sca: Sca;
     threeDSecure: ThreeDSecure;
-    requestThreeDSEnabled: () => Promise<boolean>;
+    isThreeDSecureEnabled?: boolean;
     test?: boolean;
 }
 interface HppLoadParams {
@@ -54,7 +54,6 @@ declare class Hpp {
     private headlessPreviouslyLoaded;
     private iframeLoaded;
     private isThreeDSecureEnabled;
-    private requestThreeDSEnabled;
     private challengeWindowSize;
     private scaHandler;
     private crossFrameListenersBound;

package/dist/hpp/hpp.js

@@ -30,6 +30,7 @@ const HPP_DEFAULT_OPTIONS = {
 };
 class Hpp {
     constructor(config) {
+        var _a;
         this.isThreeDSecureEnabled = false;
         this.paymentIntent = config.paymentIntent;
         this.customer = config.customer;
@@ -41,9 +42,9 @@ class Hpp {
         this.headlessPreviouslyLoaded = false;
         this.iframeLoaded = false;
         this.threeDSecure = config.threeDSecure;
-        this.requestThreeDSEnabled = config.requestThreeDSEnabled;
         this.crossFrameListenersBound = false;
         this.publicEventListenersBound = false;
+        this.isThreeDSecureEnabled = (_a = config.isThreeDSecureEnabled) !== null && _a !== void 0 ? _a : false;
         configureLogger({
             baseUrl: env[process.env.API_ENV].payNowUrl
         });
@@ -55,7 +56,6 @@ class Hpp {
                 this.crossFrameListenersBound = true;
             }
             if (this.headlessLoaded && this.iframeLoaded) {
-                this.isThreeDSecureEnabled = yield this.requestThreeDSEnabled();
                 if (!this.publicEventListenersBound && !this.isThreeDSecureEnabled) {
                     this.setPublicEventListeners();
                     this.publicEventListenersBound = true;
@@ -63,7 +63,6 @@ class Hpp {
                 emit(PublicEvent.HPP_READY);
             }
             else if (this.headlessPreviouslyLoaded && this.iframeLoaded) {
-                this.isThreeDSecureEnabled = yield this.requestThreeDSEnabled();
                 // subsequent iframe loads after headless has been previously loaded
                 // this caters for the SPA scenario
                 if (!this.publicEventListenersBound && !this.isThreeDSecureEnabled) {
@@ -136,6 +135,7 @@ class Hpp {
         return queryString ? `${base}?${searchParams.toString()}` : `${base}`;
     }
     setCrossFramesEventListeners() {
+        console.log('setCrossFramesEventListeners');
         const handlers = {};
         handlers[BridgeEvent.TOKENIZE_CARD_RESPONSE] = (data) => {
             var _a;
@@ -233,6 +233,7 @@ class Hpp {
         this.postMessageClient.setEventListeners(handlers);
     }
     setPublicEventListeners() {
+        console.log('setPublicEventListeners');
         this.scaHandler = (event) => {
             if (this.hppOptions.tokenizeOnly)
                 return;
@@ -249,6 +250,7 @@ class Hpp {
         }
     }
     createPurchase(extra = null) {
+        console.log('createPurchase');
         const message = {
             channel: 'sca',
             subject: BridgeEvent.CREATE_PAYMENT_REQUEST,

package/dist/main.d.ts

@@ -30,19 +30,21 @@ export default class FatZebra {
     private headless;
     private threeDSecure;
     private threeDSecureListenersBound;
+    private isThreeDSecureEnabled;
     private bridgeReady;
+    private authReady;
     constructor(config: FZConfig);
+    private setAuthImpl;
     tokenizeCard(card: Card): void;
     cardDidTokenize(callback: (data: any) => void): void;
-    private requestThreeDSEnabled;
+    private requestThreeDSecureEnabled;
     verifyCard(params: VerifyCardParams): Promise<void>;
-    setThreeDSecureListeners(): void;
     renderPaymentsPage(params: HppLoadParams): void;
     renderApplePayButton(params: ApplePayParams): void;
     renderClickToPay(params: HppClickToPayParams): void;
-    reportThreeDSecureFetchedOnInit(data: any): void;
-    reportThreeDSecureFetched(data: any, paymentIntent?: PaymentIntent): void;
-    reportRequestThreedsEnabledTimeout(paymentIntent?: PaymentIntent): void;
+    private setThreeDSecureListeners;
+    private reportThreeDSecureFetched;
+    private reportRequestThreedsEnabledTimeout;
     checkout(): void;
     on(event: PublicEvent, callback: (e: any) => void): void;
     off(event: PublicEvent, callback: (e: any) => void): void;

package/dist/main.js

@@ -30,7 +30,10 @@ import { logMethod } from './logging/logMethod';
 import ThreeDSecure from './three_d_secure';
 export default class FatZebra {
     constructor(config) {
+        var _a;
         this.threeDSecureListenersBound = false;
+        this.isThreeDSecureEnabled = false;
+        console.log('initialising');
         setLoggerUsername(config.username);
         this.fzConfig = config;
         window.MerchantUsername = config.username;
@@ -38,40 +41,43 @@ export default class FatZebra {
             username: config.username,
             environment: process.env.API_ENV,
         });
-        this.sca = new Sca({
-            gatewayClient: this.gatewayClient,
-        });
-        this.sca.loadScript();
         const { el, isExisting } = bridge.load2(process.env.PAYNOW_BRIDGE_URL);
         this.headless = el;
-        this.threeDSecure = new ThreeDSecure({
-            bridge: this.headless,
-            environment: process.env.API_ENV,
-        });
-        // bridgeReady is a single promise created once. 
-        // After it resolves (bridge loaded), every subsequent "await this.bridgeReady" 
-        // returns instantly — there's no re-evaluation. 
-        // So for a SPA where the bridge is already loaded, there's zero overhead.
         if (isExisting) {
-            console.log('headless exists');
             this.bridgeReady = Promise.resolve();
-            this.setThreeDSecureListeners();
         }
         else {
             this.bridgeReady = new Promise((resolve) => {
-                this.headless.addEventListener('load', () => {
-                    console.log('headless loaded');
-                    this.setThreeDSecureListeners();
-                    resolve();
-                });
+                this.headless.addEventListener('load', () => resolve());
             });
         }
+        this.authReady = this.setAuthImpl();
         const message = {
             channel: 'sca',
             subject: BridgeEvent.READY,
             data: {},
         };
-        window.top.postMessage(message, '*');
+        (_a = window.top) === null || _a === void 0 ? void 0 : _a.postMessage(message, '*');
+    }
+    setAuthImpl() {
+        return __awaiter(this, void 0, void 0, function* () {
+            console.log('setAuthImpl()');
+            yield this.bridgeReady;
+            this.isThreeDSecureEnabled = yield this.requestThreeDSecureEnabled(500);
+            if (this.isThreeDSecureEnabled) {
+                this.threeDSecure = new ThreeDSecure({
+                    bridge: this.headless,
+                    environment: process.env.API_ENV,
+                });
+                this.setThreeDSecureListeners();
+            }
+            else {
+                this.sca = new Sca({
+                    gatewayClient: this.gatewayClient,
+                });
+                this.sca.loadScript();
+            }
+        });
     }
     tokenizeCard(card) {
         const channel = 'sca';
@@ -100,18 +106,9 @@ export default class FatZebra {
         };
         postMessageClient.setEventListeners(handlers);
     }
-    requestThreeDSEnabled(timeout, paymentIntent) {
+    requestThreeDSecureEnabled(timeout, paymentIntent) {
         return __awaiter(this, void 0, void 0, function* () {
             console.log('requestThreeDSEnabled');
-            // If the bridge loads in time, bridgeReady wins and we can continue requesting the flag. 
-            // If not, the timeout resolves the race and we fall through 
-            // — the postMessage is sent to an unready bridge, the response never arrives, 
-            // and the existing window.setTimeout at the bottom fires and resolves false. 
-            // The total worst-case wait is still bounded by timeout.
-            yield Promise.race([
-                this.bridgeReady,
-                new Promise((resolve) => window.setTimeout(resolve, timeout)),
-            ]);
             return new Promise((resolve) => {
                 const channel = 'sca';
                 const postMessageClient = new PostMessageClient({
@@ -160,14 +157,14 @@ export default class FatZebra {
                 });
                 return;
             }
-            const threeDSEnabled = yield this.requestThreeDSEnabled(1000, params.paymentIntent);
+            yield this.authReady;
             switch (params.paymentMethod.type) {
                 case PaymentMethodType.CARD: {
                     console.log('Verify card (new card)');
                     const card = params.paymentMethod.data;
                     this.cardDidTokenize((data) => __awaiter(this, void 0, void 0, function* () {
                         var _a, _b;
-                        if (threeDSEnabled) {
+                        if (this.threeDSecure && this.isThreeDSecureEnabled) {
                             this.threeDSecure.run({
                                 paymentIntent: params.paymentIntent,
                                 cardToken: data.token,
@@ -194,7 +191,7 @@ export default class FatZebra {
                 case PaymentMethodType.CARD_ON_FILE: {
                     console.log('Verify card (card on file)');
                     const cardToken = params.paymentMethod.data.token;
-                    if (threeDSEnabled) {
+                    if (this.threeDSecure && this.isThreeDSecureEnabled) {
                         this.threeDSecure.run({
                             paymentIntent: params.paymentIntent,
                             cardToken,
@@ -221,21 +218,7 @@ export default class FatZebra {
             }
         });
     }
-    setThreeDSecureListeners() {
-        console.log('setThreeDSecureListeners');
-        if (this.threeDSecureListenersBound)
-            return;
-        const channel = 'sca';
-        const postMessageClient = new PostMessageClient({
-            channel,
-            target: this.headless,
-        });
-        const handlers = this.threeDSecure.messageHandlers();
-        postMessageClient.setEventListeners(handlers);
-        this.threeDSecureListenersBound = true;
-    }
     renderPaymentsPage(params) {
-        var _a;
         console.log('renderPaymentsPage');
         const valid = validateHppLoadParams(params);
         if (!valid) {
@@ -245,20 +228,25 @@ export default class FatZebra {
             });
             return;
         }
-        if ((_a = window.HPP) === null || _a === void 0 ? void 0 : _a.destroy) {
-            window.HPP.destroy();
-        }
-        window.HPP = new Hpp({
-            version: params.version,
-            paymentIntent: params.paymentIntent,
-            customer: params.customer,
-            username: this.fzConfig.username,
-            sca: this.sca,
-            test: this.fzConfig.test,
-            threeDSecure: this.threeDSecure,
-            requestThreeDSEnabled: () => this.requestThreeDSEnabled(1000, params.paymentIntent),
+        // chaining here to avoid making renderPaymentsPage async
+        // this is ugly but should only be temporary while we need to call requestThreeDSecureEnabled to fetch the flag
+        this.authReady.then(() => {
+            var _a;
+            if ((_a = window.HPP) === null || _a === void 0 ? void 0 : _a.destroy) {
+                window.HPP.destroy();
+            }
+            window.HPP = new Hpp({
+                version: params.version,
+                paymentIntent: params.paymentIntent,
+                customer: params.customer,
+                username: this.fzConfig.username,
+                sca: this.sca,
+                test: this.fzConfig.test,
+                threeDSecure: this.threeDSecure,
+                isThreeDSecureEnabled: this.isThreeDSecureEnabled,
+            });
+            window.HPP.load(params);
         });
-        window.HPP.load(params);
     }
     renderApplePayButton(params) {
         const valid = validateApplePayLoadParams(params);
@@ -296,14 +284,24 @@ export default class FatZebra {
         });
         window.HPP.load(params);
     }
-    reportThreeDSecureFetchedOnInit(data) {
-        console.log("three_d_secure fetched on init", data);
+    setThreeDSecureListeners() {
+        console.log('setThreeDSecureListeners');
+        if (this.threeDSecureListenersBound)
+            return;
+        const channel = 'sca';
+        const postMessageClient = new PostMessageClient({
+            channel,
+            target: this.headless,
+        });
+        const handlers = this.threeDSecure.messageHandlers();
+        postMessageClient.setEventListeners(handlers);
+        this.threeDSecureListenersBound = true;
     }
     reportThreeDSecureFetched(data, paymentIntent) {
-        console.log("three_d_secure fetched", data);
+        console.log('three_d_secure fetched', data);
     }
     reportRequestThreedsEnabledTimeout(paymentIntent) {
-        console.log("3DS enabled check timed out");
+        console.log('3DS enabled check timed out');
     }
     checkout() {
         window.HPP.purchase();
@@ -321,15 +319,14 @@ export default class FatZebra {
 __decorate([
     logMethod({
         mapArgs: (args) => {
-            const params = args[0];
             return [
                 {
-                    payment_intent: params === null || params === void 0 ? void 0 : params.paymentIntent
+                    payment_intent: args[1]
                 },
             ];
         },
     })
-], FatZebra.prototype, "requestThreeDSEnabled", null);
+], FatZebra.prototype, "requestThreeDSecureEnabled", null);
 __decorate([
     logMethod({
         mapArgs: (args) => {
@@ -361,22 +358,10 @@ __decorate([
 __decorate([
     logMethod({
         mapArgs: (args) => {
-            const data = args[0];
-            return [
-                {
-                    data
-                },
-            ];
-        },
-    })
-], FatZebra.prototype, "reportThreeDSecureFetchedOnInit", null);
-__decorate([
-    logMethod({
-        mapArgs: (args) => {
-            const data = args[0];
             return [
                 {
-                    data
+                    data: args[0],
+                    payment_intent: args[1]
                 },
             ];
         },
@@ -385,10 +370,9 @@ __decorate([
 __decorate([
     logMethod({
         mapArgs: (args) => {
-            const data = args[0];
             return [
                 {
-                    data
+                    payment_intent: args[0]
                 },
             ];
         },

package/dist/sca/index.js

@@ -1,3 +1,9 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -13,6 +19,7 @@ import { CardinalManager, } from './cardinal';
 import { emit, } from '../shared/event-manager';
 import env, { Environment } from "../shared/env";
 import { getEnrollmentResult, getValidationResult, threedsResponseData } from "./utility";
+import { logMethod } from '../logging/logMethod';
 class Sca {
     constructor({ gatewayClient, successCallback, failureCallback }) {
         this.gatewayClient = gatewayClient;
@@ -221,4 +228,42 @@ class Sca {
         }
     }
 }
+__decorate([
+    logMethod({
+        mapArgs: (args) => {
+            return [
+                {
+                    message: args[0],
+                    data: args[1],
+                    source: 'sca'
+                },
+            ];
+        },
+    })
+], Sca.prototype, "reportFailure", null);
+__decorate([
+    logMethod({
+        mapArgs: (args) => {
+            return [
+                {
+                    message: args[0],
+                    data: args[1],
+                    source: 'sca'
+                },
+            ];
+        },
+    })
+], Sca.prototype, "reportSuccess", null);
+__decorate([
+    logMethod({
+        mapArgs: (args) => {
+            const params = args[0];
+            return [
+                {
+                    payment_intent: params.paymentIntent
+                },
+            ];
+        },
+    })
+], Sca.prototype, "run", null);
 export default Sca;

package/dist/three_d_secure/index.js

@@ -198,10 +198,30 @@ class ThreeDSecure {
     }
 }
 __decorate([
-    logMethod()
+    logMethod({
+        mapArgs: (args) => {
+            return [
+                {
+                    message: args[0],
+                    data: args[1],
+                    source: 'three_d_secure'
+                },
+            ];
+        },
+    })
 ], ThreeDSecure.prototype, "reportSuccess", null);
 __decorate([
-    logMethod()
+    logMethod({
+        mapArgs: (args) => {
+            return [
+                {
+                    message: args[0],
+                    data: args[1],
+                    source: 'three_d_secure'
+                },
+            ];
+        },
+    })
 ], ThreeDSecure.prototype, "reportFailure", null);
 __decorate([
     logMethod()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fat-zebra/sdk",
-  "version": "2.0.1-beta.10",
+  "version": "2.0.1-beta.12",
   "description": "",
   "main": "index.js",
   "scripts": {