Refactor billing process in e2e tests

Code for billing process was refactored in end-to-end tests for clean code and better structure. In the described tests, related codes and classes have been moved to a new class named BillingPageObject. All corresponding calls were updated accordingly.

apps/e2e/tests/utils/billing.po.ts

@@ -0,0 +1,42 @@
+import { Page } from '@playwright/test';
+import { StripePageObject } from './stripe.po';
+
+export class BillingPageObject {
+  public readonly stripe: StripePageObject;
+
+  constructor(
+    private readonly page: Page,
+  ) {
+    this.stripe = new StripePageObject(page);
+  }
+
+  plans() {
+    return this.page.locator('[data-test-plan]');
+  }
+
+  selectPlan(index: number = 0) {
+    const plans = this.plans();
+
+    return plans.nth(index).click();
+  }
+
+  manageBillingButton() {
+    return this.page.locator('manage-billing-redirect-button');
+  }
+
+  successStatus() {
+    return this.page.locator('[data-test="payment-return-success"]');
+  }
+
+  async returnToHome() {
+    await this.successStatus().locator('button').click();
+  }
+
+  proceedToCheckout() {
+    return this.page.click('[data-test="checkout-submit-button"]');
+  }
+
+  async getStatus() {
+    return this.page.locator('[data-test="current-plan-card-status-badge"]');
+  }
+}

apps/e2e/tests/utils/stripe.po.ts

@@ -1,14 +1,13 @@
 import { Page, expect } from '@playwright/test';
+import { BillingPageObject } from './billing.po';
 
 export class StripePageObject {
-  private page: Page;
+  private readonly page: Page;
+  public readonly billing: BillingPageObject;
 
   constructor(page: Page) {
     this.page = page;
-  }
-
-  plans() {
-    return this.page.locator('[data-test-plan]');
+    this.billing = new BillingPageObject(page);
   }
 
   getStripeCheckoutIframe() {
@@ -66,22 +65,4 @@ export class StripePageObject {
   billingCountry() {
     return this.getStripeCheckoutIframe().locator('#billingCountry');
   }
-
-  selectPlan(index: number = 0) {
-    const plans = this.plans();
-
-    return plans.nth(index).click();
-  }
-
-  manageBillingButton() {
-    return this.page.locator('manage-billing-redirect-button');
-  }
-
-  successStatus() {
-    return this.page.locator('[data-test="payment-return-success"]');
-  }
-
-  proceedToCheckout() {
-    return this.page.click('[data-test="checkout-submit-button"]');
-  }
 }