fix: add browser info data for OPF payment init

Closes: CXSPA-9130
SAP · Jan 3, 2025 · a8658d2 · a8658d2
1 parent 9125eee
commit a8658d2
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 6 deletions.
diff --git a/...kout/components/opf-checkout-payment-wrapper/opf-checkout-payment-wrapper.service.spec.ts b/...kout/components/opf-checkout-payment-wrapper/opf-checkout-payment-wrapper.service.spec.ts
@@ -8,21 +8,22 @@ import {
   RouterState,
   RoutingService,
   UserIdService,
+  WindowRef,
 } from '@spartacus/core';
 import {
   OpfDynamicScriptResourceType,
   OpfMetadataStoreService,
   OpfResourceLoaderService,
 } from '@spartacus/opf/base/root';
-import { OrderFacade } from '@spartacus/order/root';
-import { of, throwError } from 'rxjs';
-
 import { OPF_PAYMENT_AND_REVIEW_SEMANTIC_ROUTE } from '@spartacus/opf/checkout/root';
+import { getBrowserInfo } from '@spartacus/opf/payment/core';
 import {
   OpfPaymentFacade,
   OpfPaymentRenderPattern,
   OpfPaymentSessionData,
 } from '@spartacus/opf/payment/root';
+import { OrderFacade } from '@spartacus/order/root';
+import { of, throwError } from 'rxjs';
 import { OpfCheckoutPaymentWrapperService } from './opf-checkout-payment-wrapper.service';
 
 const mockUrl = 'https://sap.com';
@@ -38,6 +39,7 @@ describe('OpfCheckoutPaymentWrapperService', () => {
   let globalMessageServiceMock: jasmine.SpyObj<GlobalMessageService>;
   let orderFacadeMock: jasmine.SpyObj<OrderFacade>;
   let opfMetadataStoreServiceMock: jasmine.SpyObj<OpfMetadataStoreService>;
+  let windowRefMock: jasmine.SpyObj<WindowRef>;
 
   beforeEach(() => {
     opfPaymentFacadeMock = jasmine.createSpyObj('OpfPaymentFacade', [
@@ -69,6 +71,7 @@ describe('OpfCheckoutPaymentWrapperService', () => {
       'OpfMetadataStoreService',
       ['updateOpfMetadata']
     );
+    windowRefMock = jasmine.createSpyObj('WindowRef', ['nativeWindow']);
 
     routingServiceMock.getRouterState.and.returnValue(
       of({
@@ -96,6 +99,10 @@ describe('OpfCheckoutPaymentWrapperService', () => {
           provide: OpfMetadataStoreService,
           useValue: opfMetadataStoreServiceMock,
         },
+        {
+          provide: WindowRef,
+          useValue: windowRefMock,
+        },
       ],
     });
 
@@ -163,6 +170,7 @@ describe('OpfCheckoutPaymentWrapperService', () => {
           cartId: mockCartId,
           resultURL: mockUrl,
           cancelURL: mockUrl,
+          browserInfo: getBrowserInfo(windowRefMock.nativeWindow),
         },
       });
 
@@ -422,7 +430,8 @@ describe('OpfCheckoutPaymentWrapperService', () => {
     const config = service['getPaymentInitiationConfig'](
       mockActiveCartId,
       mockOtpKey,
-      mockPaymentOptionId
+      mockPaymentOptionId,
+      getBrowserInfo(windowRefMock.nativeWindow)
     );
 
     expect(config).toEqual({
@@ -432,6 +441,7 @@ describe('OpfCheckoutPaymentWrapperService', () => {
         cartId: mockActiveCartId,
         resultURL: mockUrl,
         cancelURL: mockUrl,
+        browserInfo: getBrowserInfo(windowRefMock.nativeWindow),
       },
     });
   });

diff --git a/.../checkout/components/opf-checkout-payment-wrapper/opf-checkout-payment-wrapper.service.ts b/.../checkout/components/opf-checkout-payment-wrapper/opf-checkout-payment-wrapper.service.ts
@@ -17,6 +17,7 @@ import {
   HttpResponseStatus,
   RoutingService,
   UserIdService,
+  WindowRef,
   backOff,
   isAuthorizationError,
 } from '@spartacus/core';
@@ -26,7 +27,9 @@ import {
   OpfResourceLoaderService,
 } from '@spartacus/opf/base/root';
 import { OPF_PAYMENT_AND_REVIEW_SEMANTIC_ROUTE } from '@spartacus/opf/checkout/root';
+import { getBrowserInfo } from '@spartacus/opf/payment/core';
 import {
+  OpfPaymentBrowserInfo,
   OpfPaymentFacade,
   OpfPaymentRenderMethodEvent,
   OpfPaymentRenderPattern,
@@ -53,6 +56,7 @@ export class OpfCheckoutPaymentWrapperService {
   protected orderFacade = inject(OrderFacade);
   protected opfMetadataStoreService = inject(OpfMetadataStoreService);
   protected cartAccessCodeFacade = inject(CartAccessCodeFacade);
+  protected winRef = inject(WindowRef);
 
   protected lastPaymentOptionId?: number;
 
@@ -110,7 +114,12 @@ export class OpfCheckoutPaymentWrapperService {
         this.cartAccessCodeFacade.getCartAccessCode(userId, cartId).pipe(
           filter((response) => Boolean(response?.accessCode)),
           map(({ accessCode: otpKey }) =>
-            this.getPaymentInitiationConfig(cartId, otpKey, paymentOptionId)
+            this.getPaymentInitiationConfig(
+              cartId,
+              otpKey,
+              paymentOptionId,
+              getBrowserInfo(this.winRef?.nativeWindow)
+            )
           )
         )
       ),
@@ -263,12 +272,14 @@ export class OpfCheckoutPaymentWrapperService {
   protected getPaymentInitiationConfig(
     cartId: string,
     otpKey: string,
-    paymentOptionId: number
+    paymentOptionId: number,
+    browserInfo?: OpfPaymentBrowserInfo
   ) {
     return {
       otpKey,
       config: {
         cartId,
+        browserInfo,
         configurationId: String(paymentOptionId),
         resultURL: this.routingService.getFullUrl({
           cxRoute: 'paymentVerificationResult',