feat(payment): PI-4492 google pay deinitialize block during paying

Author: bc-dronov

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

@@ -11,6 +11,7 @@ import {
     OrderRequestBody,
     PaymentArgumentInvalidError,
     PaymentInitializeOptions,
+    PaymentIntegrationSelectors,
     PaymentIntegrationService,
     PaymentMethod,
 } from '@bigcommerce/checkout-sdk/payment-integration-api';
@@ -581,6 +582,30 @@ describe('GooglePayPaymentStrategy', () => {
             await expect(deinitialize).resolves.toBeUndefined();
         });
 
+        it('should NOT deinitialize the strategy if deinitialization is blocked', async () => {
+            const delayedPromise = new Promise((r) => {
+                setTimeout(r, 100);
+            });
+
+            jest.spyOn(processor, 'showPaymentSheet').mockResolvedValue(
+                Promise.resolve(getCardDataResponse()),
+            );
+
+            jest.spyOn(paymentIntegrationService, 'updateBillingAddress').mockReturnValue(
+                delayedPromise as Promise<PaymentIntegrationSelectors>,
+            );
+
+            jest.spyOn(button, 'removeEventListener');
+
+            await strategy.initialize(options);
+
+            button.click();
+            await new Promise((resolve) => process.nextTick(resolve));
+            await strategy.deinitialize();
+
+            expect(button.removeEventListener).not.toHaveBeenCalled();
+        });
+
         it('should unbind payment button', async () => {
             await strategy.initialize(options);
             await strategy.deinitialize();

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

@@ -42,6 +42,7 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
     private _paymentButton?: HTMLElement;
     private _clickListener?: (event: MouseEvent) => unknown;
     private _methodId?: keyof WithGooglePayPaymentInitializeOptions;
+    private _isDeinitializationBlocked = false;
 
     constructor(
         protected _paymentIntegrationService: PaymentIntegrationService,
@@ -112,6 +113,10 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
     }
 
     deinitialize(): Promise<void> {
+        if (this._isDeinitializationBlocked) {
+            return Promise.resolve();
+        }
+
         if (this._clickListener) {
             this._paymentButton?.removeEventListener('click', this._clickListener);
         }
@@ -174,6 +179,8 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
                 );
 
                 throw err;
+            } finally {
+                this._toggleBlockDeinitialization(false);
             }
 
             onPaymentSelect?.();
@@ -183,6 +190,7 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
     protected async _interactWithPaymentSheet(): Promise<void> {
         const response = await this._googlePayPaymentProcessor.showPaymentSheet();
 
+        this._toggleBlockDeinitialization(true);
         this._toggleLoadingIndicator(true);
 
         const billingAddress =
@@ -197,6 +205,7 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
         await this._paymentIntegrationService.loadCheckout();
         await this._paymentIntegrationService.loadPaymentMethod(this._getMethodId());
         this._toggleLoadingIndicator(false);
+        this._toggleBlockDeinitialization(false);
     }
 
     protected _getMethodId(): keyof WithGooglePayPaymentInitializeOptions {
@@ -315,6 +324,10 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
         };
     }
 
+    private _toggleBlockDeinitialization(isBlocked: boolean) {
+        this._isDeinitializationBlocked = isBlocked;
+    }
+
     private _toggleLoadingIndicator(isLoading: boolean): void {
         if (isLoading && this._loadingIndicatorContainer) {
             this._loadingIndicator.show(this._loadingIndicatorContainer);