diff --git a/playwright-tests/pages/AfterpayPage.ts b/playwright-tests/pages/AfterpayPage.ts index 2f13ed04..e70ef387 100644 --- a/playwright-tests/pages/AfterpayPage.ts +++ b/playwright-tests/pages/AfterpayPage.ts @@ -1,6 +1,6 @@ import { Locator, Page } from "@playwright/test"; import { BasePage } from "./BasePage"; -import { IClaimDetails, IPaymentDetails } from "@business-logic/types/CustomerDetails"; +import { IClaimDetails, IPaymentDetails, IPaymentDetailsAdyen } from "@business-logic/types/CustomerDetails"; import { ServicePackage } from "@business-logic/types/Enums"; export class AfterpayPage extends BasePage { @@ -33,11 +33,11 @@ export class AfterpayPage extends BasePage { await this.submitButton.click(); } - async executeAfterpayPayment(paymentDetails: IPaymentDetails, claimDetails: IClaimDetails, servicePackage: ServicePackage) { + async executeAfterpayPayment(paymentDetailsAdyen: IPaymentDetailsAdyen, claimDetails: IClaimDetails, servicePackage: ServicePackage) { const confirmButtonOrPaymentOptions = this.confirmButton.or(this.selectAfterpayWithoutInterestButton); - await this.login(paymentDetails.password!); + await this.login(paymentDetailsAdyen.password!); await this.page.locator('div[data-testid=\'loading-icon-svg\']').filter({ visible: true}).first().waitFor({ state: 'hidden' }); await confirmButtonOrPaymentOptions.waitFor({ state: 'visible' }); diff --git a/playwright-tests/pages/PaymentMethodPage.ts b/playwright-tests/pages/PaymentMethodPage.ts index d7c7ef9c..b74dd22c 100644 --- a/playwright-tests/pages/PaymentMethodPage.ts +++ b/playwright-tests/pages/PaymentMethodPage.ts @@ -1,18 +1,24 @@ import { expect, type Locator, type Page } from '@playwright/test'; import { BasePage } from './BasePage'; -import { IClaimDetails, IPaymentDetails } from '@business-logic/types/CustomerDetails'; +import { IClaimDetails, IPaymentDetails, IPaymentDetailsAdyen } from '@business-logic/types/CustomerDetails'; import { PaymentType, ServicePackage } from '@business-logic/types/Enums'; import { PaymentPage } from './PaymentPage'; import { AfterpayPage } from './AfterpayPage'; import { PaypalPage } from './PaypalPage'; +import { PaymentAdyenPage } from './PaymentAdyenPage'; export class PaymentMethodPage extends BasePage { readonly page: Page; readonly paypalPage: PaypalPage; readonly paymentPage: PaymentPage; + readonly paymentAdyenPage: PaymentAdyenPage; readonly payNowButton: Locator; readonly paypalButton: Locator; + readonly payPalAdyenButton: Locator; + readonly payPalLaunchAdyenButton: Locator; + readonly afterpayAdyenButton: Locator; + readonly afterpayLaunchAdyenButton: Locator; readonly payInFourButton: Locator; readonly payAtAppointmentButton: Locator; @@ -28,9 +34,20 @@ export class PaymentMethodPage extends BasePage { this.page = page; this.paypalPage = new PaypalPage(page); this.paymentPage = new PaymentPage(page); + this.paymentAdyenPage = new PaymentAdyenPage(page); this.payNowButton = this.page.locator('[buttonlabel="Pay now"]'); // credit and paypal options behind this button this.paypalButton = this.page.frameLocator('iframe[name="card-frame"]').locator('div[id="paypalParentDiv"]'); + + // Ayden Paypal button + this.payPalAdyenButton = this.page.getByRole('radio', { name: 'PayPal' }); + this.payPalLaunchAdyenButton = this.page.frameLocator('iframe[title="PayPal-paypal"]:first-of-type').locator('div[role="link"][class*="paypal-button"]'); + + // Ayden Afterpay buttons + this.afterpayAdyenButton = this.page.getByRole('radio', { name: 'Afterpay' }); + this.afterpayLaunchAdyenButton = this.page.getByRole('button', { name: 'Continue to Afterpay' }); + + this.payInFourButton = this.page.locator('[buttonlabel="Pay in 4 installments"]'); // Afterpay this.payAtAppointmentButton = this.page.locator('[buttonlabel="Pay at my appointment"]'); @@ -40,22 +57,24 @@ export class PaymentMethodPage extends BasePage { this.submitButton = this.page.getByRole('button', { name: 'Submit' }); } - async executePayment(paymentDetails: IPaymentDetails, claimDetails: IClaimDetails, servicePackage: ServicePackage) { + async executePayment(paymentDetails: IPaymentDetails, paymentDetailsAdyen: IPaymentDetailsAdyen, claimDetails: IClaimDetails, servicePackage: ServicePackage) { const browserContext = this.page.context(); - switch (paymentDetails.paymentType) { - case PaymentType.Credit: + switch (paymentDetailsAdyen?.paymentType ?? paymentDetails?.paymentType) { case PaymentType.Credit: await this.payNowButton.click(); await this.textReminderNoButton.click(); await this.continueToCheckoutButton.click(); - await this.selectCreditCard(paymentDetails); + await this.selectCreditCard(paymentDetailsAdyen); break; case PaymentType.Paypal: await this.payNowButton.click(); await this.textReminderNoButton.click(); await this.continueToCheckoutButton.click(); - await this.selectPaypal(); - await this.paypalPage.completePaypalPurchase(paymentDetails); + + const paypalPopup = await this.selectPaypal(); + const paypalPage = new PaypalPage(paypalPopup); + + await paypalPage.completePaypalPurchase(paymentDetailsAdyen); break; case PaymentType.AfterPay: await this.payInFourButton.click(); @@ -63,11 +82,11 @@ export class PaymentMethodPage extends BasePage { await this.continueToCheckoutButton.click(); // Capture popup - const afterpayPopup = await browserContext.waitForEvent('page'); - const afterpayPage = new AfterpayPage(afterpayPopup); + const afterpayPage = await this.selectAfterpayAdyen(); + const afterpayAdyenPage = new AfterpayPage(afterpayPage); // Execute payment - await afterpayPage.executeAfterpayPayment(paymentDetails, claimDetails, servicePackage); + await afterpayAdyenPage.executeAfterpayPayment(paymentDetailsAdyen, claimDetails, servicePackage); break; case PaymentType.PayAtService: @@ -80,13 +99,25 @@ export class PaymentMethodPage extends BasePage { break; } } - - async selectPaypal() { - await this.paypalButton.click(); + async selectAfterpayAdyen(): Promise { + await this.afterpayAdyenButton.click(); + await this.afterpayLaunchAdyenButton.click(); + //await this.page.waitForLoadState('networkidle'); + return this.page; } - async selectCreditCard(paymentDetails: IPaymentDetails) { - await this.paymentPage.populateCreditCardDetails(paymentDetails); + async selectPaypal(): Promise { + await this.payPalAdyenButton.click(); + const paypalPage = this.page.waitForEvent('popup'); + await this.payPalLaunchAdyenButton.click(); + const paypalPopup = await paypalPage; + await paypalPopup.waitForLoadState(); + return paypalPopup; + } + + async selectCreditCard(paymentDetailsAdyen: IPaymentDetailsAdyen) { + await this.paymentAdyenPage.populateCreditCardDetails(paymentDetailsAdyen); + await this.paymentAdyenPage.payButton.click(); } async selectPayAtAppointment() { diff --git a/playwright-tests/pages/PaymentPage.ts b/playwright-tests/pages/PaymentPage.ts index 4ba47ee6..fff2edd3 100644 --- a/playwright-tests/pages/PaymentPage.ts +++ b/playwright-tests/pages/PaymentPage.ts @@ -1,6 +1,5 @@ import { type Locator, type Page } from '@playwright/test'; import { BasePage } from './BasePage'; -import { AfterpayPage } from './AfterpayPage'; import { IPaymentDetails } from '@business-logic/types/CustomerDetails'; export class PaymentPage extends BasePage { diff --git a/playwright-tests/pages/PaypalPage.ts b/playwright-tests/pages/PaypalPage.ts index 05178dd9..8f97a019 100644 --- a/playwright-tests/pages/PaypalPage.ts +++ b/playwright-tests/pages/PaypalPage.ts @@ -1,6 +1,6 @@ import { expect, type Locator, type Page } from "@playwright/test"; import { BasePage } from "./BasePage"; -import { IPaymentDetails } from "@business-logic/types/CustomerDetails"; +import { IPaymentDetailsAdyen } from "@business-logic/types/CustomerDetails"; export class PaypalPage extends BasePage { readonly page: Page; @@ -13,7 +13,7 @@ export class PaypalPage extends BasePage { constructor(page: Page) { super(page); this.page = page; - this.usernameTextBox = page.locator("#email"); + this.usernameTextBox = page.getByRole("textbox", { name: "Email or mobile number" }); this.nextButton = page.getByRole("button", { name: "Next" }); this.passwordTextBox = page.getByRole("textbox", { name: "Password" }); this.paypalLoginButton = page.getByRole("button", { @@ -23,16 +23,16 @@ export class PaypalPage extends BasePage { this.payButton = page.getByRole("button", { name: "Pay $" }); } - async completePaypalPurchase(paymentDetails: IPaymentDetails) { + async completePaypalPurchase(paymentDetailsAdyen: IPaymentDetailsAdyen) { await expect(async () => { - await this.usernameTextBox.fill(paymentDetails.username!); + await this.usernameTextBox.fill(paymentDetailsAdyen.username!); await this.nextButton.waitFor({ state: 'visible', timeout: 5000 }); await this.nextButton.click(); await expect(this.passwordTextBox).toBeVisible({ timeout: 5000 }); }).toPass({ timeout: 30000 }); - await this.passwordTextBox.fill(paymentDetails.password!); + await this.passwordTextBox.fill(paymentDetailsAdyen.password!); await this.paypalLoginButton.click(); await this.payButton.click(); }