44 lines
No EOL
2.6 KiB
TypeScript
44 lines
No EOL
2.6 KiB
TypeScript
import { type Locator, type Page } from '@playwright/test';
|
|
import { BasePage } from './BasePage';
|
|
import { IPaymentDetails } from '@business-logic/types/CustomerDetails';
|
|
|
|
export class PaymentPage extends BasePage {
|
|
readonly page: Page;
|
|
readonly cardNumberTextField: Locator;
|
|
readonly expirationMonthDropDown: Locator;
|
|
readonly expirationYearDropDown: Locator;
|
|
readonly cvvTextField: Locator;
|
|
readonly billingAddressTextField: Locator;
|
|
readonly cityTextField: Locator;
|
|
readonly stateDropDown: Locator;
|
|
readonly billingZipTextField: Locator;
|
|
readonly submitPaymentButton: Locator;
|
|
issPageValue = 'payment-page';
|
|
|
|
constructor(page: Page) {
|
|
super(page);
|
|
this.page = page;
|
|
this.cardNumberTextField = page.frameLocator('iframe[name="card-frame"]').getByLabel('Card number*');
|
|
this.expirationMonthDropDown = page.frameLocator('iframe[name="card-frame"]').getByRole('combobox', { name: 'Expiration month' });
|
|
this.expirationYearDropDown = page.frameLocator('iframe[name="card-frame"]').getByRole('combobox', { name: 'Expiration year' });
|
|
this.cvvTextField = page.frameLocator('iframe[name="card-frame"]').getByRole('textbox', { name: 'CVV' });
|
|
this.billingAddressTextField = page.frameLocator('iframe[name="card-frame"]').getByRole('textbox', { name: 'Billing address' });
|
|
this.cityTextField = page.frameLocator('iframe[name="card-frame"]').getByRole('textbox', { name: 'City' });
|
|
this.stateDropDown = page.frameLocator('iframe[name="card-frame"]').getByRole('combobox', { name: 'State' });
|
|
this.billingZipTextField = page.frameLocator('iframe[name="card-frame"]').getByRole('textbox', { name: 'Billing ZIP code' });;
|
|
this.submitPaymentButton = page.getByRole('button', { name: 'Submit payment' });
|
|
}
|
|
|
|
async populateCreditCardDetails(paymentDetails: IPaymentDetails){
|
|
await this.cardNumberTextField.fill(paymentDetails.cardNumber || '');
|
|
await this.expirationMonthDropDown.selectOption(paymentDetails.expirationMonth!);
|
|
await this.expirationYearDropDown.selectOption(paymentDetails.expirationYear!);
|
|
await this.cvvTextField.fill(paymentDetails.cvv!);
|
|
await this.billingAddressTextField.fill(paymentDetails.billingAddress!.street);
|
|
await this.cityTextField.fill(paymentDetails.billingAddress!.city);
|
|
await this.stateDropDown.selectOption(paymentDetails.billingAddress!.state);
|
|
await this.billingZipTextField.fill(paymentDetails.billingAddress!.postalCode);
|
|
await this.submitPaymentButton.click();
|
|
}
|
|
|
|
} |