DigitalConsumer.ISS/playwright-tests/pages/PaymentMethodPage.ts

import { expect, type Locator, type Page } from '@playwright/test';
import { BasePage } from './BasePage';
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;

    readonly textReminderYesButton: Locator;
    readonly textReminderNoButton: Locator;
    readonly continueToCheckoutButton: Locator;
    readonly submitButton: Locator;

    issPageValue = 'payment-method';

    constructor(page: Page) {
        super(page);
        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"]'); 
        
        this.textReminderYesButton = this.page.locator('div.button-content', { hasText: /^yes$/i });
        this.textReminderNoButton = this.page.locator('div.button-content', { hasText: /^no$/i  });
        this.continueToCheckoutButton = this.page.getByRole('button', { name: 'Continue to checkout' });
        this.submitButton = this.page.getByRole('button', { name: 'Submit' });
    }

    async executePayment(paymentDetails: IPaymentDetails, paymentDetailsAdyen: IPaymentDetailsAdyen, claimDetails: IClaimDetails, servicePackage: ServicePackage) {
        const browserContext = this.page.context();

        switch (paymentDetailsAdyen?.paymentType ?? paymentDetails?.paymentType) {            case PaymentType.Credit:
                await this.payNowButton.click();
                await this.textReminderNoButton.click();
                await this.continueToCheckoutButton.click();
                await this.selectCreditCard(paymentDetailsAdyen);
                break;
            case PaymentType.Paypal:
                await this.payNowButton.click();
                await this.textReminderNoButton.click();
                await this.continueToCheckoutButton.click();

                const paypalPopup = await this.selectPaypal();
                const paypalPage = new PaypalPage(paypalPopup);

                await paypalPage.completePaypalPurchase(paymentDetailsAdyen);
                break;
            case PaymentType.AfterPay:
                await this.payInFourButton.click();
                await this.textReminderNoButton.click();
                await this.continueToCheckoutButton.click();

                // Capture popup
                const afterpayPage = await this.selectAfterpayAdyen();
                const afterpayAdyenPage = new AfterpayPage(afterpayPage);

                // Execute payment
                await afterpayAdyenPage.executeAfterpayPayment(paymentDetailsAdyen, claimDetails, servicePackage);
                break;

            case PaymentType.PayAtService:
                await this.payAtAppointmentButton.click();
                await this.textReminderNoButton.click();
                await this.submitButton.click();
                break;
            default:
                console.error('PaymentMethodPage >> Logic for this payment method unimplemented');
                break;
        }
    }
    async selectAfterpayAdyen(): Promise<Page> {
        await this.afterpayAdyenButton.click();
        await this.afterpayLaunchAdyenButton.click();
        //await this.page.waitForLoadState('networkidle');
        return this.page;
    }

    async selectPaypal(): Promise<Page>  {
        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() {
        await this.payAtAppointmentButton.click();
    }

    async submitOrderWithoutPIA() {
        await this.textReminderNoButton.click();
        await this.submitButton.click();
    }
}