feat(payment): PAYPAL-5044 Added tests to cover google pay functionality related to error handling logic

packages/google-pay-integration/src/google-pay-button-strategy.spec.ts

@@ -10,6 +10,7 @@ import {
     InvalidArgumentError,
     PaymentIntegrationService,
     PaymentMethod,
+    PaymentMethodCancelledError,
 } from '@bigcommerce/checkout-sdk/payment-integration-api';
 import {
     getCart,
@@ -27,6 +28,8 @@ import { getGeneric } from './mocks/google-pay-payment-method.mock';
 import { createInitializeImplementationMock } from './mocks/google-pay-processor-initialize.mock';
 import {
     CallbackTriggerType,
+    GooglePayButtonOptions,
+    GooglePayErrorObject,
     GooglePayInitializationData,
     NewShippingOptionParameters,
     NewTransactionInfo,
@@ -64,6 +67,17 @@ describe('GooglePayButtonStrategy', () => {
         defaultSelectedOptionId: consignment.selectedShippingOption?.id,
         shippingOptions: expectedSippingOptions,
     };
+    const mockFn = jest.fn();
+    const internalError = new Error('internal error');
+
+    const createInitializeWidgetMock = (error?: unknown) =>
+        jest.spyOn(processor, 'initializeWidget').mockImplementation(
+            error
+                ? () => {
+                      throw error;
+                  }
+                : undefined,
+        );
 
     beforeEach(() => {
         jest.clearAllMocks();
@@ -95,7 +109,9 @@ describe('GooglePayButtonStrategy', () => {
         options = {
             methodId: 'googlepaybraintree',
             containerId: CONTAINER_ID,
-            googlepaybraintree: {},
+            googlepaybraintree: {
+                onError: jest.fn(),
+            },
         };
 
         withBuyNowOptions = {
@@ -130,12 +146,22 @@ describe('GooglePayButtonStrategy', () => {
         jest.spyOn(processor, 'setExternalCheckoutForm').mockResolvedValue(undefined);
 
         jest.spyOn(processor, 'initialize').mockResolvedValue(undefined);
-        jest.spyOn(processor, 'initializeWidget').mockResolvedValue(undefined);
-        jest.spyOn(processor, 'addPaymentButton').mockImplementation((_, { onClick }) => {
-            button.onclick = onClick;
 
-            return button;
-        });
+        createInitializeWidgetMock();
+
+        jest.spyOn(processor, 'addPaymentButton').mockImplementation(
+            (_: string, buttonOptions: Omit<GooglePayButtonOptions, 'allowedPaymentMethods'>) => {
+                button.onclick = async (event) => {
+                    try {
+                        await buttonOptions.onClick(event);
+                    } catch (e) {
+                        mockFn(e);
+                    }
+                };
+
+                return button;
+            },
+        );
         jest.spyOn(processor, 'signOut').mockResolvedValue(undefined);
 
         jest.spyOn(processor, 'getCallbackTriggers').mockReturnValue({
@@ -156,6 +182,10 @@ describe('GooglePayButtonStrategy', () => {
     });
 
     describe('#initialize', () => {
+        afterEach(() => {
+            jest.clearAllMocks();
+        });
+
         describe('initialization of strategy with buy now required options', () => {
             it('should initialize the strategy', async () => {
                 expect(await buttonStrategy.initialize(withBuyNowOptions)).toBeUndefined();
@@ -291,6 +321,50 @@ describe('GooglePayButtonStrategy', () => {
             });
         });
 
+        it('throw an error on wallet button click', async () => {
+            const rejectedInitializeWidgetMock = createInitializeWidgetMock(internalError);
+
+            await buttonStrategy.initialize(options);
+
+            button.click();
+
+            await new Promise((resolve) => process.nextTick(resolve));
+
+            expect(rejectedInitializeWidgetMock).toHaveBeenCalledTimes(1);
+            expect(mockFn).toHaveBeenCalledWith(internalError);
+        });
+
+        it('triggers onError callback on wallet button click', async () => {
+            const rejectedInitializeWidgetMock = createInitializeWidgetMock(internalError);
+
+            await buttonStrategy.initialize(options);
+
+            button.click();
+
+            await new Promise((resolve) => process.nextTick(resolve));
+
+            expect(rejectedInitializeWidgetMock).toHaveBeenCalledTimes(1);
+            expect(options.googlepaybraintree?.onError).toHaveBeenCalled();
+        });
+
+        it('throw a canceled error on wallet button click', async () => {
+            const googlePayErrorObject: GooglePayErrorObject = {
+                statusCode: 'CANCELED',
+                statusMessage: 'Canceled',
+            };
+
+            const rejectedInitializeWidgetMock = createInitializeWidgetMock(googlePayErrorObject);
+
+            await buttonStrategy.initialize(options);
+
+            button.click();
+
+            await new Promise((resolve) => process.nextTick(resolve));
+
+            expect(rejectedInitializeWidgetMock).toHaveBeenCalledTimes(1);
+            expect(mockFn.mock.calls[0][0]).toBeInstanceOf(PaymentMethodCancelledError);
+        });
+
         describe('initialization of strategy without buy now required options', () => {
             it('should initialize the strategy', async () => {
                 const paymentDataCallbacks = () =>

packages/google-pay-integration/src/google-pay-button-strategy.ts

@@ -125,7 +125,7 @@ export default class GooglePayButtonStrategy implements CheckoutButtonStrategy {
 
     private _handleClick(
         onError: GooglePayCustomerInitializeOptions['onError'],
-    ): (event: MouseEvent) => unknown {
+    ): (event: MouseEvent) => Promise<void> {
         return async (event: MouseEvent) => {
             event.preventDefault();
 

packages/google-pay-integration/src/google-pay-customer-strategy.spec.ts

@@ -9,6 +9,7 @@ import {
     NotImplementedError,
     PaymentIntegrationService,
     PaymentMethod,
+    PaymentMethodCancelledError,
 } from '@bigcommerce/checkout-sdk/payment-integration-api';
 import {
     getConsignment,
@@ -26,6 +27,7 @@ import { createInitializeImplementationMock } from './mocks/google-pay-processor
 import {
     CallbackTriggerType,
     GooglePayButtonOptions,
+    GooglePayErrorObject,
     GooglePayInitializationData,
     NewTransactionInfo,
 } from './types';
@@ -72,6 +74,7 @@ describe('GooglePayCustomerStrategy', () => {
             googlepayworldpayaccess: {
                 container: CONTAINER_ID,
                 onClick: jest.fn(),
+                onError: jest.fn(),
             },
         };
     });
@@ -227,21 +230,43 @@ describe('GooglePayCustomerStrategy', () => {
     });
 
     describe('#handleClick', () => {
+        const mockFn = jest.fn();
+        const internalError = new Error('internal error');
+
+        const createInitializeWidgetMock = (error?: unknown) =>
+            jest.spyOn(processor, 'initializeWidget').mockImplementation(
+                error
+                    ? () => {
+                          throw error;
+                      }
+                    : undefined,
+            );
+
         beforeEach(() => {
             jest.spyOn(processor, 'addPaymentButton').mockImplementation(
                 (
                     _: string,
                     buttonOptions: Omit<GooglePayButtonOptions, 'allowedPaymentMethods'>,
                 ) => {
-                    button.onclick = buttonOptions.onClick;
+                    button.onclick = async (event) => {
+                        try {
+                            await buttonOptions.onClick(event);
+                        } catch (e) {
+                            mockFn(e);
+                        }
+                    };
 
                     return button;
                 },
             );
         });
 
+        afterEach(() => {
+            jest.clearAllMocks();
+        });
+
         it('triggers onClick callback on wallet button click', async () => {
-            const initializeWidgetMock = jest.spyOn(processor, 'initializeWidget');
+            const initializeWidgetMock = createInitializeWidgetMock();
 
             await strategy.initialize(options);
 
@@ -253,6 +278,50 @@ describe('GooglePayCustomerStrategy', () => {
             expect(initializeWidgetMock).toHaveBeenCalledTimes(1);
         });
 
+        it('throw an error on wallet button click', async () => {
+            const rejectedInitializeWidgetMock = createInitializeWidgetMock(internalError);
+
+            await strategy.initialize(options);
+
+            button.click();
+
+            await new Promise((resolve) => process.nextTick(resolve));
+
+            expect(rejectedInitializeWidgetMock).toHaveBeenCalledTimes(1);
+            expect(mockFn).toHaveBeenCalledWith(internalError);
+        });
+
+        it('triggers onError callback on wallet button click', async () => {
+            const rejectedInitializeWidgetMock = createInitializeWidgetMock(internalError);
+
+            await strategy.initialize(options);
+
+            button.click();
+
+            await new Promise((resolve) => process.nextTick(resolve));
+
+            expect(rejectedInitializeWidgetMock).toHaveBeenCalledTimes(1);
+            expect(options.googlepayworldpayaccess?.onError).toHaveBeenCalled();
+        });
+
+        it('throw a canceled error on wallet button click', async () => {
+            const googlePayErrorObject: GooglePayErrorObject = {
+                statusCode: 'CANCELED',
+                statusMessage: 'Canceled',
+            };
+
+            const rejectedInitializeWidgetMock = createInitializeWidgetMock(googlePayErrorObject);
+
+            await strategy.initialize(options);
+
+            button.click();
+
+            await new Promise((resolve) => process.nextTick(resolve));
+
+            expect(rejectedInitializeWidgetMock).toHaveBeenCalledTimes(1);
+            expect(mockFn.mock.calls[0][0]).toBeInstanceOf(PaymentMethodCancelledError);
+        });
+
         describe('#getGooglePayClientOptions', () => {
             let mockReturnedPaymentDataChangedValue: NewTransactionInfo | undefined;
 

packages/google-pay-integration/src/google-pay-customer-strategy.ts

@@ -177,7 +177,7 @@ export default class GooglePayCustomerStrategy implements CustomerStrategy {
     private _handleClick(
         onError: GooglePayCustomerInitializeOptions['onError'],
         onClick: GooglePayCustomerInitializeOptions['onClick'],
-    ): (event: MouseEvent) => unknown {
+    ): (event: MouseEvent) => Promise<void> {
         return async (event: MouseEvent) => {
             event.preventDefault();
 

packages/google-pay-integration/src/google-pay-payment-strategy.spec.ts

@@ -26,7 +26,6 @@ import getGooglePaymentsClientMocks from './mocks/google-pay-payments-client.moc
 import { createInitializeImplementationMock } from './mocks/google-pay-processor-initialize.mock';
 import {
     CallbackTriggerType,
-    GooglePayButtonOptions,
     GooglePayInitializationData,
     GooglePaymentsClient,
     NewTransactionInfo,
@@ -280,17 +279,32 @@ describe('GooglePayPaymentStrategy', () => {
     });
 
     describe('#handleClick', () => {
-        beforeEach(() => {
-            jest.spyOn(processor, 'addPaymentButton').mockImplementation(
-                (
-                    _: string,
-                    buttonOptions: Omit<GooglePayButtonOptions, 'allowedPaymentMethods'>,
-                ) => {
-                    button.onclick = buttonOptions.onClick;
-
-                    return button;
-                },
+        const internalError = new Error('internal error');
+
+        const createInitializeWidgetMock = (error?: unknown) =>
+            jest.spyOn(processor, 'initializeWidget').mockImplementation(
+                error
+                    ? () => {
+                          throw error;
+                      }
+                    : undefined,
             );
+
+        afterEach(() => {
+            jest.clearAllMocks();
+        });
+
+        it('triggers onError callback on wallet button click', async () => {
+            const rejectedInitializeWidgetMock = createInitializeWidgetMock(internalError);
+
+            await strategy.initialize(options);
+
+            button.click();
+
+            await new Promise((resolve) => process.nextTick(resolve));
+
+            expect(rejectedInitializeWidgetMock).toHaveBeenCalledTimes(1);
+            expect(options.googlepayworldpayaccess?.onError).toHaveBeenCalled();
         });
 
         describe('#getGooglePayClientOptions', () => {

packages/google-pay-integration/src/types.ts

@@ -261,7 +261,7 @@ interface GooglePayIsReadyToPayResponse {
 }
 
 export interface GooglePayButtonOptions {
-    onClick: (event: MouseEvent) => void;
+    onClick: (event: MouseEvent) => Promise<void>;
     allowedPaymentMethods: [GooglePayBaseCardPaymentMethod];
     buttonColor?: GooglePayButtonColor;
     buttonType?: GooglePayButtonType;