Merge pull request #54 from empawlowski/test/small-refactor

test: refactor home locators

Author: empawlowski

.gitignore

@@ -1,8 +1,14 @@
-node_modules/
+# Node
+/node_modules/
+
+# Playwright
 test-results/
 playwright-report/
 playwright/.cache/
-e2e/output/
-e2e/download/
-.env
+e2e/output/**
+e2e/download/**
 
+# .env files
+.env
+.env.*
+!.env.template

e2e/components/footer.component.ts

@@ -1,11 +1,11 @@
 import { BasePage } from '@_e2e/pages/e2e/base.page';
-import { type Locator, type Page } from '@playwright/test';
+import { type Locator, type Page, expect } from '@playwright/test';
 
 export class FooterComponent extends BasePage {
-  readonly headerSubscription: Locator;
+  private readonly headerSubscription: Locator;
   private readonly fieldSubscribe: Locator;
   private readonly buttonSubscribe: Locator;
-  readonly alertSuccessSubs: Locator;
+  private readonly alertSuccessSubs: Locator;
 
   constructor(page: Page) {
     super(page);
@@ -15,8 +15,16 @@ export class FooterComponent extends BasePage {
     this.alertSuccessSubs = this.page.locator('#success-subscribe');
   }
 
+  async isHeaderSubscriptionVisible(): Promise<void> {
+    await expect(this.headerSubscription).toBeVisible();
+  }
+
   async sendSubscribe(email: string): Promise<void> {
     await this.fieldSubscribe.fill(email);
     await this.buttonSubscribe.click();
   }
+
+  async catchAlert(alert: string): Promise<void> {
+    await expect(this.alertSuccessSubs).toContainText(alert);
+  }
 }

e2e/pages/e2e/contact-us.page.ts

@@ -1,18 +1,19 @@
 import * as data from '@_e2e/assets/data/e2e/app.data.json';
 import { ContactUsModel } from '@_e2e/models/e2e/contact-us.model';
 import { BasePage } from '@_e2e/pages/e2e/base.page';
-import { type Locator, type Page } from '@playwright/test';
+import { HomePage } from '@_e2e/pages/e2e/home.page';
+import { type Locator, type Page, expect } from '@playwright/test';
 
 export class ContactUsPage extends BasePage {
-  readonly header: Locator;
+  private readonly header: Locator;
   private readonly fieldName: Locator;
   private readonly fieldEmail: Locator;
   private readonly fieldSubject: Locator;
   private readonly fieldMessage: Locator;
   private readonly fieldFileUpload: Locator;
   private readonly buttonSubmit: Locator;
-  readonly alertMessage: Locator;
-  readonly buttonBackHome: Locator;
+  private readonly alertMessage: Locator;
+  private readonly buttonBackHome: Locator;
 
   constructor(page: Page) {
     super(page);
@@ -27,6 +28,10 @@ export class ContactUsPage extends BasePage {
     this.buttonBackHome = page.locator('.btn-success');
   }
 
+  async isHeaderVisible(): Promise<void> {
+    await expect(this.header).toBeVisible();
+  }
+
   async fillContactUs(form: ContactUsModel): Promise<void> {
     await this.fieldName.fill(form.name);
     await this.fieldEmail.fill(form.email);
@@ -35,4 +40,13 @@ export class ContactUsPage extends BasePage {
     await this.fieldFileUpload.setInputFiles('./e2e/assets/images/image.jpg');
     await this.buttonSubmit.click();
   }
+
+  async clickBackHome(): Promise<HomePage> {
+    await this.buttonBackHome.click();
+    return new HomePage(this.page);
+  }
+
+  async catchAlert(alert: string): Promise<void> {
+    await expect(this.alertMessage).toContainText(alert);
+  }
 }

e2e/pages/e2e/home.page.ts

@@ -8,9 +8,9 @@ import { ProductsPage } from '@_e2e/pages/e2e/products/product.page';
 import { type Locator, type Page, expect } from '@playwright/test';
 
 export class HomePage extends BasePage {
-  readonly headerFullFledged: Locator;
+  private readonly headerFullFledged: Locator;
   private readonly linkViewCart: Locator;
-  readonly headerRecommendedItems: Locator;
+  private readonly headerRecommendedItems: Locator;
   private readonly linkAddToCartFromRecommendedItems: Locator;
 
   readonly leftSidebar: LeftSidebarComponent;
@@ -36,6 +36,14 @@ export class HomePage extends BasePage {
     await expect(this.page).toHaveTitle(data.title.home);
   }
 
+  async isHeaderFullFledgedInViewPort(): Promise<void> {
+    await expect(this.headerFullFledged).toBeInViewport();
+  }
+
+  async isHeaderRecommendedItemsVisible(): Promise<void> {
+    await expect(this.headerRecommendedItems).toBeVisible();
+  }
+
   async addFromRecommendedItemsAndViewCart(): Promise<CartPage> {
     await this.linkAddToCartFromRecommendedItems.last().click();
     await this.linkViewCart.click();

e2e/tests/e2e/test.spec.ts

@@ -239,14 +239,14 @@ test.describe('Test for test cases', { tag: ['@reg'] }, () => {
 
     //Act
     await header.openContactUsPage();
-    await expect.soft(contactUs.header).toBeVisible();
+    await contactUs.isHeaderVisible();
     await contactUs.fillContactUs(contactUsFormData);
 
     await contactUs.catchDialog();
     await contactUs.buttonAcceptDialog.click();
 
-    await expect.soft(contactUs.alertMessage).toContainText(data.contactUs.alertSuccess);
-    await contactUs.buttonBackHome.click();
+    await contactUs.catchAlert(data.contactUs.alertSuccess);
+    await contactUs.clickBackHome();
 
     //Assert
     await home.expectHomePage();
@@ -348,11 +348,11 @@ test.describe('Test for test cases', { tag: ['@reg'] }, () => {
 
     //Act
     await home.scrollDownPage();
-    await expect(home.footer.headerSubscription).toBeVisible();
+    await home.footer.isHeaderSubscriptionVisible();
     await home.footer.sendSubscribe(emailData.email);
 
     //Assert
-    await expect(home.footer.alertSuccessSubs).toContainText(data.footer.confirmationSubscribe);
+    await home.footer.catchAlert(data.footer.confirmationSubscribe);
 
     // Test Case 10: Verify Subscription in home page
     // 1. Launch browser
@@ -371,11 +371,11 @@ test.describe('Test for test cases', { tag: ['@reg'] }, () => {
     await header.openCartPage();
     await cart.expectCartPage();
     await cart.scrollDownPage();
-    await expect(footer.headerSubscription).toBeVisible();
+    await footer.isHeaderSubscriptionVisible();
     await footer.sendSubscribe(emailData.email);
 
     //Assert
-    await expect(footer.alertSuccessSubs).toContainText(data.footer.confirmationSubscribe);
+    await footer.catchAlert(data.footer.confirmationSubscribe);
 
     // Test Case 11: Verify Subscription in Cart page
     // 1. Launch browser
@@ -899,7 +899,7 @@ test.describe('Test for test cases', { tag: ['@reg'] }, () => {
   test('Case 22: Add to cart from Recommended items', async ({ home, cart }) => {
     //Act
     await home.scrollDownPage();
-    await expect.soft(home.headerRecommendedItems).toBeVisible();
+    await home.isHeaderRecommendedItemsVisible();
     await home.addFromRecommendedItemsAndViewCart();
 
     //Assert
@@ -1052,10 +1052,10 @@ test.describe('Test for test cases', { tag: ['@reg'] }, () => {
   test('Case 25: Verify Scroll Up using "Arrow" button and Scroll Down functionality', async ({ home }) => {
     //Act
     await home.scrollDownPage();
-    await expect(home.footer.headerSubscription).toBeInViewport();
+    await home.footer.isHeaderSubscriptionVisible();
     await home.takeScreenShot('footer');
     await home.clickScrollUpArrow();
-    await expect(home.headerFullFledged).toBeInViewport();
+    await home.isHeaderFullFledgedInViewPort();
     await home.takeScreenShot('header');
 
     //Assert
@@ -1076,10 +1076,10 @@ test.describe('Test for test cases', { tag: ['@reg'] }, () => {
   test('Case 26: Verify Scroll Up without "Arrow" button and Scroll Down functionality', async ({ home }) => {
     //Act
     await home.scrollDownPage();
-    await expect(home.footer.headerSubscription).toBeInViewport();
+    await home.footer.isHeaderSubscriptionVisible();
     await home.takeScreenShot('up-arrow');
     await home.scrollUpPage();
-    await expect(home.headerFullFledged).toBeInViewport();
+    await home.isHeaderFullFledgedInViewPort();
     await home.giveMeSmallSecond();
     await home.takeScreenShot('no-arrow');