fix: remove firstName lastName in the billingAddress for non Riverty …

…payments (#2591)

* fix: remove firstName lastName in the billingAddress for non Riverty payments

* fix: e2e-playwright test

.changeset/cool-zebras-whisper.md

@@ -0,0 +1,5 @@
+---
+"@adyen/adyen-web": patch
+---
+
+Sanitize `billingAddress` when making a `/payments` call. Remove `firstName` and `lastName` in the `billingAddress` for non Riverty payments.

packages/e2e-playwright/models/dropinModelUtils/getDropinCardComp.ts

@@ -2,7 +2,7 @@ import { Dropin } from '../dropin';
 import { getImageCount } from '../../tests/utils/image';
 
 export const getCreditCardPM = (dropin: Dropin) => {
-    const creditCard = dropin.getPaymentMethodItem('Credit Card');
+    const creditCard = dropin.getPaymentMethodItem('Cards');
 
     const brandsHolder = creditCard.locator('.adyen-checkout__payment-method__brands');
 

packages/lib/src/components/BaseElement.test.ts

@@ -34,6 +34,22 @@ describe('BaseElement', () => {
             expect(baseElement.data).toEqual({ clientStateDataIndicator: true });
             expect(spy).toHaveBeenCalled();
         });
+
+        test('return correct billingAddress data', () => {
+            const Element = class extends BaseElement<{}> {
+                constructor(props) {
+                    super(props);
+                }
+                protected formatData(): any {
+                    return { billingAddress: { firstName: 'bla' } };
+                }
+            };
+            let element;
+            element = new Element({ type: 'riverty' });
+            expect(element.data).toEqual({ clientStateDataIndicator: true, billingAddress: { firstName: 'bla' } });
+            element = new Element({ type: 'card' });
+            expect(element.data).toEqual({ clientStateDataIndicator: true, billingAddress: {} });
+        });
     });
 
     describe('render', () => {

packages/lib/src/components/BaseElement.ts

@@ -65,6 +65,14 @@ class BaseElement<P extends BaseElementProps> {
             componentData.paymentMethod.checkoutAttemptId = checkoutAttemptId;
         }
 
+        // Workaround, to be fixed properly
+        // Remove the firstName & lastName in the billingAddress for non Riverty components
+        // @ts-ignore type exists
+        if (this.props.type !== 'riverty' && componentData.billingAddress) {
+            const { firstName, lastName, ...rest } = componentData.billingAddress;
+            componentData.billingAddress = { ...rest };
+        }
+
         return {
             ...(clientData && { riskData: { clientData } }),
             ...(order && { order: { orderData: order.orderData, pspReference: order.pspReference } }),