@paydock/client-sdk 1.138.1 → 1.139.0

package/bundles/index.cjs

@@ -847,6 +847,11 @@ var Browser = /*#__PURE__*/function () {
     value: function isJavaEnabled() {
       return navigator.javaEnabled();
     }
+  }, {
+    key: "getAgentUser",
+    value: function getAgentUser() {
+      return navigator.userAgent;
+    }
   }, {
     key: "getColorDepth",
     value: function getColorDepth() {
@@ -1189,7 +1194,7 @@ SDK.headerKeys = Object.freeze({
   version: 'x-sdk-version',
   type: 'x-sdk-type'
 });
-SDK._version = 'v1.138.1';
+SDK._version = 'v1.139.0';
 
 function isFunction(value) {
     return typeof value === 'function';
@@ -4933,9 +4938,28 @@ var IFrame = /*#__PURE__*/function () {
       var iframeClass = arguments.length > 2 ? arguments[2] : undefined;
       if (!this.container.isExist() || this.isExist()) return;
       var iFrame = document.createElement('iframe');
-      iFrame.setAttribute('src', link);
       if (options.title) iFrame.title = options.title;
       if (iframeClass) iFrame.classList.add(iframeClass);
+      // Set additional attributes before src and DOM insertion so that
+      // Permissions-Policy (e.g. allow="payment") is in place when the
+      // browser starts navigating the iframe.
+      if (options.attributes) {
+        for (var _i = 0, _Object$entries = Object.entries(options.attributes); _i < _Object$entries.length; _i++) {
+          var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
+            key = _Object$entries$_i[0],
+            value = _Object$entries$_i[1];
+          iFrame.setAttribute(key, value);
+        }
+      }
+      if (options.styles) {
+        for (var _i2 = 0, _Object$entries2 = Object.entries(options.styles); _i2 < _Object$entries2.length; _i2++) {
+          var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i2], 2),
+            prop = _Object$entries2$_i[0],
+            _value = _Object$entries2$_i[1];
+          iFrame.style[prop] = _value;
+        }
+      }
+      iFrame.setAttribute('src', link);
       this.container.getElement().appendChild(iFrame);
     }
   }, {
@@ -7777,6 +7801,33 @@ var WalletService = /*#__PURE__*/function () {
         });
       });
     }
+    /**
+     * Handles the merchant's onClick callback event.
+     * Supports both synchronous (boolean) and asynchronous (Promise) handlers.
+     * @protected
+     */
+  }, {
+    key: "handleMerchantOnButtonClickEvent",
+    value: function handleMerchantOnButtonClickEvent() {
+      var _this2 = this;
+      return new Promise(function (resolve, reject) {
+        var merchantResult;
+        _this2.eventEmitter.emit(WALLET_EVENT.BUTTON_CLICK, {
+          attachResult: function attachResult(value) {
+            merchantResult = value;
+          }
+        });
+        if (merchantResult instanceof Promise) {
+          merchantResult.then(resolve)["catch"](reject);
+        } else {
+          if (merchantResult === false) {
+            reject();
+          } else {
+            resolve();
+          }
+        }
+      });
+    }
   }]);
 }();
 
@@ -7836,6 +7887,16 @@ var AfterPayWalletService = /*#__PURE__*/function (_WalletService) {
     key: "onAfterPayButtonClicked",
     value: function onAfterPayButtonClicked() {
       var _this4 = this;
+      this.handleMerchantOnButtonClickEvent().then(function () {
+        _this4.initializeAfterpay();
+      })["catch"](function (err) {
+        console.error('Error while processing merchant callback', err);
+      });
+    }
+  }, {
+    key: "initializeAfterpay",
+    value: function initializeAfterpay() {
+      var _this5 = this;
       var _a, _b;
       var afterpayJS = document.createElement('script');
       var countryCode = (_a = this.meta) === null || _a === void 0 ? void 0 : _a.country;
@@ -7847,15 +7908,15 @@ var AfterPayWalletService = /*#__PURE__*/function (_WalletService) {
         window.AfterPay.initialize({
           countryCode: countryCode
         });
-        if (_this4.isRedirectMode) {
-          _this4.storageDispatcher.push({
+        if (_this5.isRedirectMode) {
+          _this5.storageDispatcher.push({
             intent: StorageDataIntent.WIDGET_SESSION,
             data: {
-              token: _this4.token
+              token: _this5.token
             }
           }, {
             onSuccess: function onSuccess() {
-              _this4.getCheckoutSession()
+              _this5.getCheckoutSession()
               // biome-ignore lint/suspicious/noExplicitAny: <explanation>
               .then(function (response) {
                 window.AfterPay.redirect({
@@ -7863,7 +7924,7 @@ var AfterPayWalletService = /*#__PURE__*/function (_WalletService) {
                 });
               })["catch"](function (err) {
                 window.AfterPay.close();
-                _this4.eventEmitter.emit(WALLET_EVENT.UNAVAILABLE, {
+                _this5.eventEmitter.emit(WALLET_EVENT.UNAVAILABLE, {
                   err: err
                 });
               });
@@ -7871,30 +7932,30 @@ var AfterPayWalletService = /*#__PURE__*/function (_WalletService) {
             onError: function onError() {
               console.error('Error initializing Afterpay wallet');
               window.AfterPay.close();
-              _this4.eventEmitter.emit(WALLET_EVENT.UNAVAILABLE, {});
+              _this5.eventEmitter.emit(WALLET_EVENT.UNAVAILABLE, {});
             }
           });
         } else {
           window.AfterPay.open();
-          _this4.getCheckoutSession()
+          _this5.getCheckoutSession()
           // biome-ignore lint/suspicious/noExplicitAny: <explanation>
           .then(function (response) {
             window.AfterPay.onComplete = function (event) {
               if (event.data.status === 'SUCCESS') {
-                _this4.eventEmitter.emit(WALLET_EVENT.PAYMENT_METHOD_SELECTED, {
+                _this5.eventEmitter.emit(WALLET_EVENT.PAYMENT_METHOD_SELECTED, {
                   data: {
                     token: response.ref_token,
                     merchantReference: event.data.orderToken
                   },
                   onSuccess: function onSuccess() {
-                    return _this4.eventEmitter.emit(WALLET_EVENT.PAYMENT_SUCCESS);
+                    return _this5.eventEmitter.emit(WALLET_EVENT.PAYMENT_SUCCESS);
                   },
                   onError: function onError() {
-                    return _this4.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR);
+                    return _this5.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR);
                   }
                 });
               } else {
-                _this4.eventEmitter.emit(WALLET_EVENT.CHECKOUT_CLOSE, {
+                _this5.eventEmitter.emit(WALLET_EVENT.CHECKOUT_CLOSE, {
                   data: event.data
                 });
               }
@@ -7904,7 +7965,7 @@ var AfterPayWalletService = /*#__PURE__*/function (_WalletService) {
             });
           })["catch"](function (err) {
             window.AfterPay.close();
-            _this4.eventEmitter.emit(WALLET_EVENT.UNAVAILABLE, {
+            _this5.eventEmitter.emit(WALLET_EVENT.UNAVAILABLE, {
               err: err
             });
           });
@@ -7915,20 +7976,20 @@ var AfterPayWalletService = /*#__PURE__*/function (_WalletService) {
   }, {
     key: "getCheckoutSession",
     value: function getCheckoutSession() {
-      var _this5 = this;
+      var _this6 = this;
       return new Promise(function (resolve, reject) {
-        return _this5.eventEmitter.emit(WALLET_EVENT.CALLBACK, {
+        return _this6.eventEmitter.emit(WALLET_EVENT.CALLBACK, {
           data: {
             request_type: 'CREATE_SESSION',
             wallet_type: WALLET_TYPE.AFTERPAY,
-            checkout_url: !_this5.isRedirectMode ? _this5.CHECKOUT_URL : undefined
+            checkout_url: !_this6.isRedirectMode ? _this6.CHECKOUT_URL : undefined
           },
           onSuccess: function onSuccess(res) {
             resolve(res);
           },
           onError: function onError(message) {
             console.error('Error generating order id', message);
-            _this5.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR, {
+            _this6.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR, {
               message: message
             });
             reject(message);
@@ -9746,34 +9807,12 @@ var FlypayV2WalletService = /*#__PURE__*/function (_WalletService) {
       this.flypayV2Button.innerHTML = getFlypayV2Button(this.widgetId);
       return this.flypayV2Button;
     }
-  }, {
-    key: "handleMerchantOnButtonClickEvent",
-    value: function handleMerchantOnButtonClickEvent() {
-      var _this3 = this;
-      return new Promise(function (resolve, reject) {
-        var merchantResult;
-        _this3.eventEmitter.emit(WALLET_EVENT.BUTTON_CLICK, {
-          attachResult: function attachResult(value) {
-            merchantResult = value;
-          }
-        });
-        if (merchantResult instanceof Promise) {
-          merchantResult.then(resolve)["catch"](reject);
-        } else {
-          if (merchantResult === false) {
-            reject();
-          } else {
-            resolve();
-          }
-        }
-      });
-    }
   }, {
     key: "getOrderId",
     value: function getOrderId() {
-      var _this4 = this;
+      var _this3 = this;
       return new Promise(function (resolve, reject) {
-        return _this4.eventEmitter.emit(WALLET_EVENT.CALLBACK, {
+        return _this3.eventEmitter.emit(WALLET_EVENT.CALLBACK, {
           data: {
             request_type: 'CREATE_SESSION'
           },
@@ -9782,7 +9821,7 @@ var FlypayV2WalletService = /*#__PURE__*/function (_WalletService) {
           },
           onError: function onError(message, code) {
             console.error('Error generating order id', message);
-            _this4.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR, {
+            _this3.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR, {
               message: message
             });
             reject({
@@ -9796,7 +9835,7 @@ var FlypayV2WalletService = /*#__PURE__*/function (_WalletService) {
   }, {
     key: "flypayV2Checkout",
     value: function flypayV2Checkout(orderId) {
-      var _this5 = this;
+      var _this4 = this;
       var _a;
       this.checkout = new Checkout$1(_extends(_extends({
         orderId: orderId
@@ -9811,29 +9850,29 @@ var FlypayV2WalletService = /*#__PURE__*/function (_WalletService) {
         url: ((_a = this.meta) === null || _a === void 0 ? void 0 : _a.gateway_mode) === 'live' ? 'https://checkout.colespay.com.au' : 'https://checkout.sandbox.cxbflypay.com.au',
         onCheckoutClosed: function onCheckoutClosed() {
           var _a;
-          _this5.eventEmitter.emit(WALLET_EVENT.CHECKOUT_CLOSE);
-          (_a = _this5.background) === null || _a === void 0 ? void 0 : _a.clear();
-          _this5.enable();
+          _this4.eventEmitter.emit(WALLET_EVENT.CHECKOUT_CLOSE);
+          (_a = _this4.background) === null || _a === void 0 ? void 0 : _a.clear();
+          _this4.enable();
         },
         onError: function onError(err) {
-          return _this5.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR, {
+          return _this4.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR, {
             error: err
           });
         },
         onPaymentSuccess: function onPaymentSuccess(data) {
-          return _this5.eventEmitter.emit(WALLET_EVENT.PAYMENT_SUCCESS, data);
+          return _this4.eventEmitter.emit(WALLET_EVENT.PAYMENT_SUCCESS, data);
         },
         onPaymentError: function onPaymentError(err) {
-          return _this5.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR, {
+          return _this4.eventEmitter.emit(WALLET_EVENT.PAYMENT_ERROR, {
             error: err
           });
         },
         onTokensChanged: function onTokensChanged(_ref) {
           var accessToken = _ref.accessToken,
             refreshToken = _ref.refreshToken;
-          _this5.accessToken = accessToken;
-          _this5.refreshToken = refreshToken;
-          _this5.eventEmitter.emit(WALLET_EVENT.AUTH_TOKENS_CHANGED, {
+          _this4.accessToken = accessToken;
+          _this4.refreshToken = refreshToken;
+          _this4.eventEmitter.emit(WALLET_EVENT.AUTH_TOKENS_CHANGED, {
             accessToken: accessToken,
             refreshToken: refreshToken
           });
@@ -9848,18 +9887,18 @@ var FlypayV2WalletService = /*#__PURE__*/function (_WalletService) {
   }, {
     key: "initBackground",
     value: function initBackground() {
-      var _this6 = this;
+      var _this5 = this;
       var bg = new WalletBackground(this.link.getNetUrl() + FLYPAY_LOGO_LINK, false, false);
       bg.setBackdropTitle('');
       bg.setBackdropDescription('');
       bg.onTrigger(TRIGGER$2.CLOSE, function () {
         var _a;
-        _this6.checkout.close();
-        (_a = _this6.background) === null || _a === void 0 ? void 0 : _a.clear();
-        _this6.enable();
+        _this5.checkout.close();
+        (_a = _this5.background) === null || _a === void 0 ? void 0 : _a.clear();
+        _this5.enable();
       });
       bg.onTrigger(TRIGGER$2.FOCUS, function () {
-        return _this6.checkout.open();
+        return _this5.checkout.open();
       });
       return bg;
     }
@@ -10541,28 +10580,6 @@ var AppleWalletService = /*#__PURE__*/function (_WalletService) {
         });
       });
     }
-  }, {
-    key: "handleMerchantOnButtonClickEvent",
-    value: function handleMerchantOnButtonClickEvent() {
-      var _this6 = this;
-      return new Promise(function (resolve, reject) {
-        var merchantResult;
-        _this6.eventEmitter.emit(WALLET_EVENT.BUTTON_CLICK, {
-          attachResult: function attachResult(value) {
-            merchantResult = value;
-          }
-        });
-        if (merchantResult instanceof Promise) {
-          merchantResult.then(resolve)["catch"](reject);
-        } else {
-          if (merchantResult === false) {
-            reject();
-          } else {
-            resolve();
-          }
-        }
-      });
-    }
   }, {
     key: "formatCapabilities",
     value: function formatCapabilities(capabilities) {
@@ -10818,39 +10835,17 @@ var GoogleWalletService = /*#__PURE__*/function (_WalletService) {
         console.error('Error while processing merchant callback', err);
       });
     }
-  }, {
-    key: "handleMerchantOnButtonClickEvent",
-    value: function handleMerchantOnButtonClickEvent() {
-      var _this5 = this;
-      return new Promise(function (resolve, reject) {
-        var merchantResult;
-        _this5.eventEmitter.emit(WALLET_EVENT.BUTTON_CLICK, {
-          attachResult: function attachResult(value) {
-            merchantResult = value;
-          }
-        });
-        if (merchantResult instanceof Promise) {
-          merchantResult.then(resolve)["catch"](reject);
-        } else {
-          if (merchantResult === false) {
-            reject();
-          } else {
-            resolve();
-          }
-        }
-      });
-    }
   }, {
     key: "loadPaymentData",
     value: function loadPaymentData() {
       return __awaiter(this, void 0, void 0, /*#__PURE__*/_regenerator().m(function _callee2() {
-        var _this6 = this;
+        var _this5 = this;
         return _regenerator().w(function (_context2) {
           while (1) switch (_context2.n) {
             case 0:
               return _context2.a(2, this.paymentsClient.loadPaymentData(this.createPaymentDataRequest())["catch"](function (err) {
-                _this6.eventEmitter.emit(WALLET_EVENT.CHECKOUT_CLOSE);
-                _this6.processingButtonClick = false;
+                _this5.eventEmitter.emit(WALLET_EVENT.CHECKOUT_CLOSE);
+                _this5.processingButtonClick = false;
                 console.error('Error while loading payment data', err);
                 throw err;
               }));
@@ -10861,7 +10856,7 @@ var GoogleWalletService = /*#__PURE__*/function (_WalletService) {
   }, {
     key: "onPaymentAuthorized",
     value: function onPaymentAuthorized(paymentData) {
-      var _this7 = this;
+      var _this6 = this;
       var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
       var billingAddressLine1 = (_c = (_b = (_a = paymentData.paymentMethodData) === null || _a === void 0 ? void 0 : _a.info) === null || _b === void 0 ? void 0 : _b.billingAddress) === null || _c === void 0 ? void 0 : _c.address1;
       var billingAddressLine2 = (_f = (_e = (_d = paymentData.paymentMethodData) === null || _d === void 0 ? void 0 : _d.info) === null || _e === void 0 ? void 0 : _e.billingAddress) === null || _f === void 0 ? void 0 : _f.address2;
@@ -10878,7 +10873,7 @@ var GoogleWalletService = /*#__PURE__*/function (_WalletService) {
       var onPaymentAuthorizedResponse = new Promise(function (resolve) {
         var emitPaymentEvent = function emitPaymentEvent() {
           var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-          _this7.eventEmitter.emit(WALLET_EVENT.PAYMENT_METHOD_SELECTED, {
+          _this6.eventEmitter.emit(WALLET_EVENT.PAYMENT_METHOD_SELECTED, {
             data: _extends({
               customer: {
                 payment_source: _extends(_extends(_extends({
@@ -10897,11 +10892,11 @@ var GoogleWalletService = /*#__PURE__*/function (_WalletService) {
                   ref_token: paymentData.paymentMethodData.tokenizationData.token
                 })
               }
-            }, _this7.isShippingRequired() && {
+            }, _this6.isShippingRequired() && {
               shipping: _extends(_extends(_extends(_extends(_extends(_extends(_extends(_extends(_extends({}, shippingOptionMethod && {
                 method: shippingOptionMethod
-              }), _this7.hasShippingOptions() && {
-                options: _this7.meta.shipping_options
+              }), _this6.hasShippingOptions() && {
+                options: _this6.meta.shipping_options
               }), shippingAddressLine1 && {
                 address_line1: shippingAddressLine1
               }), shippingAddressLine2 && {
@@ -10925,15 +10920,15 @@ var GoogleWalletService = /*#__PURE__*/function (_WalletService) {
               })
             }),
             onSuccess: function onSuccess() {
-              _this7.processingButtonClick = false;
-              _this7.isProcessingAuthorization = false;
+              _this6.processingButtonClick = false;
+              _this6.isProcessingAuthorization = false;
               resolve({
                 transactionState: 'SUCCESS'
               });
             },
             onError: function onError(error) {
-              _this7.processingButtonClick = false;
-              _this7.isProcessingAuthorization = false;
+              _this6.processingButtonClick = false;
+              _this6.isProcessingAuthorization = false;
               resolve({
                 transactionState: 'ERROR',
                 error: {
@@ -10945,7 +10940,7 @@ var GoogleWalletService = /*#__PURE__*/function (_WalletService) {
             }
           });
         };
-        if (_this7.isProcessingAuthorization) {
+        if (_this6.isProcessingAuthorization) {
           console.warn('Duplicate payment authorization detected. Ignoring.');
           resolve({
             transactionState: 'ERROR',
@@ -10956,7 +10951,7 @@ var GoogleWalletService = /*#__PURE__*/function (_WalletService) {
             }
           });
         } else {
-          _this7.isProcessingAuthorization = true;
+          _this6.isProcessingAuthorization = true;
           emitPaymentEvent();
         }
       });
@@ -10965,14 +10960,14 @@ var GoogleWalletService = /*#__PURE__*/function (_WalletService) {
   }, {
     key: "onPaymentDataChanged",
     value: function onPaymentDataChanged(intermediatePaymentData) {
-      var _this8 = this;
+      var _this7 = this;
       if (!this.isShippingRequired()) {
         return;
       }
       var parsedUpdateData = this.parseUpdateData(intermediatePaymentData);
       var returnPromise = new Promise(function (res, rej) {
-        _this8.latestShippingChangePromiseResolve = res;
-        _this8.latestShippingChangePromiseReject = rej;
+        _this7.latestShippingChangePromiseResolve = res;
+        _this7.latestShippingChangePromiseReject = rej;
       });
       this.eventEmitter.emit(WALLET_EVENT.UPDATE, parsedUpdateData);
       return returnPromise;
@@ -11219,6 +11214,11 @@ var PaypalWalletService = /*#__PURE__*/function (_WalletService) {
                 });
               } else {
                 responseValue = value;
+                if (responseValue === false) {
+                  actions.reject();
+                } else {
+                  actions.resolve();
+                }
               }
             }
           });
@@ -12090,7 +12090,7 @@ var WalletButtons = /*#__PURE__*/function () {
      * There are two operational modes supported, Synchronous and Asynchronous.
      * When asynchronous operations need to occur on the callback handler, attaching the Promise via `attachResult` is required to have the wallet wait for a result.
      * When synchronous operations occur on the callback handler, attaching a boolean result via `attachResult` is optional to control the execution flow.
-     * Note this is supported for Paypal, GooglePay and ApplePay wallet buttons at the moment.
+     * Note this is supported for Paypal, GooglePay, ApplePay, Afterpay and FlypayV2 wallet buttons at the moment.
      *
      * @example
      * button.onClick((data) => {
@@ -17303,7 +17303,9 @@ var InstructionCardFormShow = /*#__PURE__*/function (_InstructionHandler) {
           payload: _extends(_extends({
             status: 'success',
             ott_token: event.payment_source,
-            browser_details: get.getBrowserDetails()
+            browser_details: _extends(_extends({}, get.getBrowserDetails()), {
+              user_agent: Browser.getAgentUser()
+            })
           }, event.card_scheme && {
             card_schema: event.card_scheme
           }), {
@@ -17530,7 +17532,7 @@ function setCheckoutCustomisation(checkoutSelector, customStyles) {
       parentEl.style.setProperty('--pd-text-color', customStyles.text_color);
     }
     if (customStyles.font_family) {
-      parentEl.style.setProperty('--pd-font-family', customStyles.font_family);
+      parentEl.style.setProperty('--pd-font-family', "".concat(customStyles.font_family, ", \"Inter\", sans-serif"));
     }
     if (customStyles.font_size) {
       parentEl.style.setProperty('--pd-font-size', customStyles.font_size);
@@ -20832,47 +20834,28 @@ var PayPalDataCollectorService = /*#__PURE__*/function () {
     key: "collectDeviceData",
     value: function collectDeviceData() {
       if (!window.Promise) {
-        this.eventEmitter.emit(PAYPAL_DATA_COLLECTOR_EVENTS.ON_ERROR, {
+        var errorData = {
           error_code: ErrorCodes$1.PROMISE_NOT_ENABLED
-        });
+        };
+        this.eventEmitter.emit(PAYPAL_DATA_COLLECTOR_EVENTS.ON_ERROR, errorData);
+        throw errorData;
       }
       this.correlationId = Uuid.generate().replace(/-/g, '');
-      return this.appendPaypalSavePaymentSourceComponent();
+      return this.appendPaypalDataCollectorComponent();
     }
   }, {
-    key: "appendPaypalSavePaymentSourceComponent",
-    value: function appendPaypalSavePaymentSourceComponent() {
+    key: "appendPaypalDataCollectorComponent",
+    value: function appendPaypalDataCollectorComponent() {
       var _this = this;
-      var _a;
-      var paypalScript = document.createElement("script");
-      paypalScript.type = "application/json";
-      paypalScript.setAttribute("fncls", "fnparams-dede7cc5-15fd-4c75-a9f4-36c430ee3a99");
-      var scriptContent = _extends(_extends({
-        f: this.correlationId,
-        s: this.flowId ? this.flowId : Uuid.generate(),
-        cb1: 'paydockPayPalDataCollectorServiceCallbackPostOne',
-        cb2: 'paydockPayPalDataCollectorServiceCallbackPostTwo'
-      }, this.isSandbox && {
-        sandbox: this.isSandbox
-      }), ((_a = this.config) === null || _a === void 0 ? void 0 : _a.mouse_movement) && {
-        mm: this.config.mouse_movement
-      });
-      paypalScript.textContent = JSON.stringify(scriptContent, null, 4);
-      var fraudnetScript = document.createElement("script");
-      fraudnetScript.type = "text/javascript";
-      fraudnetScript.src = "https://c.paypal.com/da/r/fb.js";
-      fraudnetScript.onerror = function () {
-        return _this.onError();
-      };
-      document.body.appendChild(paypalScript);
-      document.body.appendChild(fraudnetScript);
-      return this.setupCallbacks();
-    }
-  }, {
-    key: "setupCallbacks",
-    value: function setupCallbacks() {
-      var _this2 = this;
       return new Promise(function (resolve, reject) {
+        var paypalScript = _this.createPaypalScript();
+        paypalScript.onerror = function () {
+          _this.onError(reject);
+        };
+        var fraudnetScript = _this.createFraudnetScript();
+        fraudnetScript.onerror = function () {
+          _this.onError(reject);
+        };
         var callbackOnePromise = new Promise(function (resolve) {
           window.paydockPayPalDataCollectorServiceCallbackPostOne = function () {
             resolve();
@@ -20883,19 +20866,53 @@ var PayPalDataCollectorService = /*#__PURE__*/function () {
             resolve();
           };
         });
+        document.body.appendChild(paypalScript);
+        document.body.appendChild(fraudnetScript);
         Promise.all([callbackOnePromise, callbackTwoPromise]).then(function () {
           resolve({
-            correlation_id: _this2.correlationId
+            correlation_id: _this.correlationId
           });
         })["catch"](reject);
       });
     }
+  }, {
+    key: "createPaypalScript",
+    value: function createPaypalScript() {
+      var _a;
+      var paypalScript = document.createElement('script');
+      paypalScript.type = 'application/json';
+      paypalScript.setAttribute('fncls', 'fnparams-dede7cc5-15fd-4c75-a9f4-36c430ee3a99');
+      var scriptContent = _extends(_extends({
+        f: this.correlationId,
+        s: this.flowId ? this.flowId : Uuid.generate(),
+        cb1: 'paydockPayPalDataCollectorServiceCallbackPostOne',
+        cb2: 'paydockPayPalDataCollectorServiceCallbackPostTwo'
+      }, this.isSandbox && {
+        sandbox: this.isSandbox
+      }), ((_a = this.config) === null || _a === void 0 ? void 0 : _a.mouse_movement) && {
+        mm: this.config.mouse_movement
+      });
+      paypalScript.textContent = JSON.stringify(scriptContent, null, 4);
+      return paypalScript;
+    }
+  }, {
+    key: "createFraudnetScript",
+    value: function createFraudnetScript() {
+      var fraudnetScript = document.createElement('script');
+      fraudnetScript.type = 'text/javascript';
+      fraudnetScript.src = 'https://c.paypal.com/da/r/fb.js';
+      return fraudnetScript;
+    }
   }, {
     key: "onError",
-    value: function onError() {
-      this.eventEmitter.emit(PAYPAL_DATA_COLLECTOR_EVENTS.ON_ERROR, {
+    value: function onError(rejectPromise) {
+      var errorData = {
         error_code: ErrorCodes$1.SCRIPT_ERROR
-      });
+      };
+      this.eventEmitter.emit(PAYPAL_DATA_COLLECTOR_EVENTS.ON_ERROR, errorData);
+      if (rejectPromise) {
+        rejectPromise(errorData);
+      }
     }
   }, {
     key: "setEnv",
@@ -20931,11 +20948,20 @@ var PayPalDataCollector = /*#__PURE__*/function () {
    * the correlation id used among the requests asynchronously.
    *
    * @returns {Promise<CollectedDeviceData>} Promise when resolved, returns an object
-   * that contains the `correlation_id` key.
+   * that contains the `correlation_id` key. The promise may be rejected if script loading fails.
    *
    * @example
    * const collectedDeviceData = await payPalDataCollectorWidget.collectDeviceData();
    * console.log(collectedDeviceData.correlation_id)
+   *
+   * @example
+   * payPalDataCollectorWidget.collectDeviceData()
+   *   .then((collectedDeviceData) => {
+   *     console.log(collectedDeviceData.correlation_id);
+   *   })
+   *   .catch((error) => {
+   *     console.error('Failed to collect device data', error);
+   *   });
    */
   return _createClass(PayPalDataCollector, [{
     key: "collectDeviceData",
@@ -21557,12 +21583,16 @@ var ClickToPaySRC = /*#__PURE__*/function () {
       // Initialize performance optimizations when environment is guaranteed to be final
       PerformanceService.initialize(this.link.getEnv());
       this.iFrame.load(this.link.getUrl(), {
-        title: 'Click To Pay checkout'
+        title: 'Click To Pay checkout',
+        attributes: {
+          allow: 'payment; accelerometer;'
+        },
+        styles: {
+          width: '100%'
+        }
       });
       var iframeElement = this.iFrame.getElement();
-      this.iFrame.setStyle('width', '100%');
       if (iframeElement) {
-        iframeElement.setAttribute('allow', 'payment; accelerometer;');
         iframeElement.onload = function () {
           _this2.isIframeLoaded = true;
           _this2.eventEmitter.emit(EVENT$1.IFRAME_LOADED, {});