@fat-zebra/sdk 2.0.1-beta.4 → 2.0.1-beta.7

package/dist/hpp/hpp.d.ts

@@ -13,7 +13,7 @@ interface HppModuleConfig {
     username: string;
     sca: Sca;
     threeDSecure: ThreeDSecure;
-    isThreeDSecureEnabled: () => boolean;
+    requestThreeDSEnabled: () => Promise<boolean>;
     test?: boolean;
 }
 interface HppLoadParams {
@@ -54,12 +54,13 @@ declare class Hpp {
     private headlessPreviouslyLoaded;
     private iframeLoaded;
     private isThreeDSecureEnabled;
+    private requestThreeDSEnabled;
     private challengeWindowSize;
     private scaHandler;
     private crossFrameListenersBound;
     private publicEventListenersBound;
     constructor(config: HppModuleConfig);
-    setListenersAndEmitReady(): void;
+    setListenersAndEmitReady(): Promise<void>;
     load(config: HppLoadParams): void;
     purchase(): void;
     getPayNowUrl(options?: {

package/dist/hpp/hpp.js

@@ -4,6 +4,15 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 import * as bridge from '../shared/bridge-client';
 import { LocalStorageAccessTokenKey } from '../shared/constants';
 import { emit, off, on } from '../shared/event-manager';
@@ -21,6 +30,7 @@ const HPP_DEFAULT_OPTIONS = {
 };
 class Hpp {
     constructor(config) {
+        this.isThreeDSecureEnabled = false;
         this.paymentIntent = config.paymentIntent;
         this.customer = config.customer;
         this.username = config.username;
@@ -31,7 +41,7 @@ class Hpp {
         this.headlessPreviouslyLoaded = false;
         this.iframeLoaded = false;
         this.threeDSecure = config.threeDSecure;
-        this.isThreeDSecureEnabled = config.isThreeDSecureEnabled;
+        this.requestThreeDSEnabled = config.requestThreeDSEnabled;
         this.crossFrameListenersBound = false;
         this.publicEventListenersBound = false;
         configureLogger({
@@ -39,26 +49,30 @@ class Hpp {
         });
     }
     setListenersAndEmitReady() {
-        if (!this.crossFrameListenersBound) {
-            this.setCrossFramesEventListeners();
-            this.crossFrameListenersBound = true;
-        }
-        if (this.headlessLoaded && this.iframeLoaded) {
-            if (!this.publicEventListenersBound && !this.isThreeDSecureEnabled()) {
-                this.setPublicEventListeners();
-                this.publicEventListenersBound = true;
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!this.crossFrameListenersBound) {
+                this.setCrossFramesEventListeners();
+                this.crossFrameListenersBound = true;
             }
-            emit(PublicEvent.HPP_READY);
-        }
-        else if (this.headlessPreviouslyLoaded && this.iframeLoaded) {
-            // subsequent iframe loads after headless has been previously loaded
-            // this caters for the SPA scenario
-            if (!this.publicEventListenersBound && !this.isThreeDSecureEnabled()) {
-                this.setPublicEventListeners();
-                this.publicEventListenersBound = true;
+            if (this.headlessLoaded && this.iframeLoaded) {
+                this.isThreeDSecureEnabled = yield this.requestThreeDSEnabled();
+                if (!this.publicEventListenersBound && !this.isThreeDSecureEnabled) {
+                    this.setPublicEventListeners();
+                    this.publicEventListenersBound = true;
+                }
+                emit(PublicEvent.HPP_READY);
             }
-            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) {
+                    this.setPublicEventListeners();
+                    this.publicEventListenersBound = true;
+                }
+                emit(PublicEvent.HPP_READY);
+            }
+        });
     }
     load(config) {
         var _a;
@@ -74,10 +88,10 @@ class Hpp {
             channel: 'sca',
             target: this.iframe
         });
-        this.headless.onload = () => {
+        this.headless.addEventListener('load', () => {
             this.headlessLoaded = true;
             this.setListenersAndEmitReady();
-        };
+        });
         this.iframe.onload = () => {
             this.iframeLoaded = true;
             this.setListenersAndEmitReady();
@@ -145,7 +159,7 @@ class Hpp {
             if (this.hppOptions.tokenizeOnly)
                 return;
             if (this.hppOptions.enableSca) {
-                if (this.isThreeDSecureEnabled()) {
+                if (this.isThreeDSecureEnabled) {
                     this.threeDSecure.run({
                         paymentIntent: this.paymentIntent,
                         merchantUsername: this.username,

package/dist/main.d.ts

@@ -29,7 +29,6 @@ export default class FatZebra {
     private gatewayClient;
     private headless;
     private threeDSecure;
-    private threeDSEnabled;
     private threeDSecureListenersBound;
     constructor(config: FZConfig);
     tokenizeCard(card: Card): void;
@@ -37,9 +36,12 @@ export default class FatZebra {
     private requestThreeDSEnabled;
     verifyCard(params: VerifyCardParams): Promise<void>;
     setThreeDSecureListeners(): void;
-    renderPaymentsPage(params: HppLoadParams): Promise<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;
     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,6 @@ import { logMethod } from './logging/logMethod';
 import ThreeDSecure from './three_d_secure';
 export default class FatZebra {
     constructor(config) {
-        this.threeDSEnabled = false;
         this.threeDSecureListenersBound = false;
         setLoggerUsername(config.username);
         this.fzConfig = config;
@@ -53,9 +52,9 @@ export default class FatZebra {
             this.setThreeDSecureListeners();
         }
         else {
-            this.headless.onload = () => {
+            this.headless.addEventListener('load', () => {
                 this.setThreeDSecureListeners();
-            };
+            });
         }
         const message = {
             channel: 'sca',
@@ -91,9 +90,9 @@ export default class FatZebra {
         };
         postMessageClient.setEventListeners(handlers);
     }
-    requestThreeDSEnabled() {
+    requestThreeDSEnabled(paymentIntent) {
+        console.log('requestThreeDSEnabled');
         return new Promise((resolve) => {
-            var _a;
             const channel = 'sca';
             const postMessageClient = new PostMessageClient({
                 channel,
@@ -103,8 +102,8 @@ export default class FatZebra {
             postMessageClient.setEventListeners({
                 [BridgeEvent.THREE_D_SECURE_ENABLED]: (data) => {
                     const enabled = typeof data === 'boolean' ? data : false;
-                    this.threeDSEnabled = enabled;
                     if (!resolved) {
+                        this.reportThreeDSecureFetched(data, paymentIntent);
                         resolved = true;
                         resolve(enabled);
                     }
@@ -118,13 +117,14 @@ export default class FatZebra {
                     access_token: window.localStorage.getItem(LocalStorageAccessTokenKey),
                 },
             };
-            (_a = this.headless.contentWindow) === null || _a === void 0 ? void 0 : _a.postMessage(message, '*');
+            postMessageClient.send(message);
             window.setTimeout(() => {
                 if (!resolved) {
+                    this.reportRequestThreedsEnabledTimeout(paymentIntent);
                     resolved = true;
                     resolve(false);
                 }
-            }, 5000);
+            }, 1000);
         });
     }
     verifyCard(params) {
@@ -138,9 +138,10 @@ export default class FatZebra {
                 });
                 return;
             }
-            const threeDSEnabled = yield this.requestThreeDSEnabled();
+            const threeDSEnabled = yield this.requestThreeDSEnabled(params.paymentIntent);
             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;
@@ -169,6 +170,7 @@ export default class FatZebra {
                     break;
                 }
                 case PaymentMethodType.CARD_ON_FILE: {
+                    console.log('Verify card (card on file)');
                     const cardToken = params.paymentMethod.data.token;
                     if (threeDSEnabled) {
                         this.threeDSecure.run({
@@ -198,6 +200,7 @@ export default class FatZebra {
         });
     }
     setThreeDSecureListeners() {
+        console.log('setThreeDSecureListeners');
         if (this.threeDSecureListenersBound)
             return;
         this.threeDSecureListenersBound = true;
@@ -207,38 +210,33 @@ export default class FatZebra {
             target: this.headless,
         });
         const handlers = this.threeDSecure.messageHandlers();
-        handlers[BridgeEvent.THREE_D_SECURE_ENABLED] = (data) => {
-            this.threeDSEnabled = typeof data === 'boolean' ? data : false;
-        };
         postMessageClient.setEventListeners(handlers);
     }
     renderPaymentsPage(params) {
-        return __awaiter(this, void 0, void 0, function* () {
-            var _a;
-            const valid = validateHppLoadParams(params);
-            if (!valid) {
-                emit(PublicEvent.VALIDATION_ERROR, {
-                    errors: toHumanizedErrors(validateHppLoadParams.errors),
-                    data: null,
-                });
-                return;
-            }
-            yield this.requestThreeDSEnabled();
-            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.threeDSEnabled,
+        var _a;
+        console.log('renderPaymentsPage');
+        const valid = validateHppLoadParams(params);
+        if (!valid) {
+            emit(PublicEvent.VALIDATION_ERROR, {
+                errors: toHumanizedErrors(validateHppLoadParams.errors),
+                data: null,
             });
-            window.HPP.load(params);
+            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(),
         });
+        window.HPP.load(params);
     }
     renderApplePayButton(params) {
         const valid = validateApplePayLoadParams(params);
@@ -276,6 +274,15 @@ export default class FatZebra {
         });
         window.HPP.load(params);
     }
+    reportThreeDSecureFetchedOnInit(data) {
+        console.log("three_d_secure fetched on init", data);
+    }
+    reportThreeDSecureFetched(data, paymentIntent) {
+        console.log("three_d_secure fetched", data);
+    }
+    reportRequestThreedsEnabledTimeout(paymentIntent) {
+        console.log("3DS enabled check timed out");
+    }
     checkout() {
         window.HPP.purchase();
     }
@@ -289,6 +296,18 @@ export default class FatZebra {
         onOnce(event, callback);
     }
 }
+__decorate([
+    logMethod({
+        mapArgs: (args) => {
+            const params = args[0];
+            return [
+                {
+                    payment_intent: params === null || params === void 0 ? void 0 : params.paymentIntent
+                },
+            ];
+        },
+    })
+], FatZebra.prototype, "requestThreeDSEnabled", null);
 __decorate([
     logMethod({
         mapArgs: (args) => {
@@ -304,4 +323,53 @@ __decorate([
         },
     })
 ], FatZebra.prototype, "verifyCard", null);
+__decorate([
+    logMethod({
+        mapArgs: (args) => {
+            const params = args[0];
+            return [
+                {
+                    payment_intent: params.paymentIntent,
+                    version: params.version
+                },
+            ];
+        },
+    })
+], FatZebra.prototype, "renderPaymentsPage", null);
+__decorate([
+    logMethod({
+        mapArgs: (args) => {
+            const data = args[0];
+            return [
+                {
+                    data
+                },
+            ];
+        },
+    })
+], FatZebra.prototype, "reportThreeDSecureFetchedOnInit", null);
+__decorate([
+    logMethod({
+        mapArgs: (args) => {
+            const data = args[0];
+            return [
+                {
+                    data
+                },
+            ];
+        },
+    })
+], FatZebra.prototype, "reportThreeDSecureFetched", null);
+__decorate([
+    logMethod({
+        mapArgs: (args) => {
+            const data = args[0];
+            return [
+                {
+                    data
+                },
+            ];
+        },
+    })
+], FatZebra.prototype, "reportRequestThreedsEnabledTimeout", null);
 export { FatZebra, };

package/dist/sca/index.js

@@ -58,6 +58,7 @@ class Sca {
     }
     run(config) {
         return __awaiter(this, void 0, void 0, function* () {
+            console.log('Running 3DS (SCA)');
             try {
                 if (!this._cardinal) {
                     this._cardinal = new CardinalManager();

package/dist/three_d_secure/index.js

@@ -28,6 +28,7 @@ class ThreeDSecure {
         this.listenDeviceCollectionReady();
     }
     run({ paymentIntent, cardToken, merchantUsername, challengeWindowSize, test, tokenizeOnly, iframe }) {
+        console.log('Running 3DS (ThreeDSecure)');
         this.iframe = iframe;
         this.tokenizeOnly = tokenizeOnly;
         this.setLoading();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fat-zebra/sdk",
-  "version": "2.0.1-beta.4",
+  "version": "2.0.1-beta.7",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -63,7 +63,7 @@
     "ajv": "^8.17.1",
     "ajv-formats": "^3.0.1",
     "ajv-keywords": "^5.1.0",
-    "axios": "1.15.0",
+    "axios": "1.16.0",
     "custom-event-polyfill": "^1.0.7",
     "glob": "^13.0.6",
     "ts-polyfill": "^3.8.2",