From aa43e2941ae0f31fb2f011f7388b6f146432efb1 Mon Sep 17 00:00:00 2001
From: maguire-arman <maguire.arman@safelite.com>
Date: Mon, 19 May 2025 16:26:41 -0400
Subject: [PATCH] Updates PayPal login flow

Adds username input and "next" button handling to the PayPal login flow.
This update is necessary to support the new PayPal login screen, which requires entering the username before the password.
---
 playwright-tests/business-logic/Data/PaymentData.ts |  1 +
 playwright-tests/pages/PaypalPage.ts                | 13 +++++++++++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/playwright-tests/business-logic/Data/PaymentData.ts b/playwright-tests/business-logic/Data/PaymentData.ts
index ae733d755..699a2eeb9 100644
--- a/playwright-tests/business-logic/Data/PaymentData.ts
+++ b/playwright-tests/business-logic/Data/PaymentData.ts
@@ -28,6 +28,7 @@ const defaultAfterpayDetails: IPaymentDetails = {
 
 const defaultPaypalDetails: IPaymentDetails = {
     paymentType: PaymentType.Paypal,
+    username: 'itqatest@safelite.com',
     password: 'Safelite1'
 }
 
diff --git a/playwright-tests/pages/PaypalPage.ts b/playwright-tests/pages/PaypalPage.ts
index 862a97edf..25a5be26b 100644
--- a/playwright-tests/pages/PaypalPage.ts
+++ b/playwright-tests/pages/PaypalPage.ts
@@ -5,6 +5,9 @@ import { IPaymentDetails } from '@business-logic/types/CustomerDetails';
 export class PaypalPage extends BasePage {
     readonly page: Page;
     readonly loginWithPasswordButton: Locator;
+    readonly usernameTextBox: Locator;
+    readonly nextButton: Locator;
+    readonly usePasswordInsteadButton: Locator;
     readonly passwordTextBox: Locator;
     readonly paypalLoginButton: Locator;
     readonly completePurchaseButton: Locator;
@@ -12,13 +15,19 @@ export class PaypalPage extends BasePage {
     constructor(page: Page) {
         super(page);
         this.page = page;
-        this.loginWithPasswordButton = page.getByRole('link', { name: 'Log in with a password instead' });
+        this.usernameTextBox = page.getByPlaceholder('Email');
+        this.nextButton = page.getByRole('button', { name: 'Next' });
+        this.loginWithPasswordButton = page.getByRole('button', { name: 'Use Password Instead' });
         this.passwordTextBox = page.getByPlaceholder('Password');
         this.paypalLoginButton = page.getByRole('button', { name: 'Log In', exact: true });
-        this.completePurchaseButton = page.getByTestId('submit-button-initial');
+        this.completePurchaseButton = page.getByRole('button', { name: 'Pay $' });
     }
 
     async completePaypalPurchase(paymentDetails: IPaymentDetails){
+        if (!await this.loginWithPasswordButton.isVisible()) {
+            await this.usernameTextBox.fill(paymentDetails.username!);
+            await this.nextButton.click();
+        }
         await this.loginWithPasswordButton.click();
         await this.passwordTextBox.fill(paymentDetails.password!);
         await this.paypalLoginButton.click();