Merge pull request #31 from aldimhernandez/14-pom---download

refactor: 🎨 implements page object model for download suite case

Author: aldimhernandez

cypress/e2e/step_definitions/04.download.cy.ts

@@ -1,19 +1,21 @@
 import { Then, When } from "@badeball/cypress-cucumber-preprocessor";
+import { uploadAndDownloadPage } from "cypress/pages/04.download/UploadAndDownloadPage";
+import { homePage } from "cypress/pages/0A.home/HomePage";
+import { navBarPage } from "cypress/pages/0B.navbar/NavBarPage";
 
-//TODO: Refactor to POM
 When('I navigate to the "Elements" section', () => {
-    cy.contains("Elements").click();
+    homePage.navigateToElementsSection();
 });
 
 When('I click on the "Upload and Download" section', () => {
-    cy.contains("Upload and Download").click();
-
+    navBarPage.navigateToUploadAndDownloadSection();
 });
 
 When('I click on the "Download" button', () => {
-    cy.get("#downloadButton").click();
+    uploadAndDownloadPage.pageRedirectValidation();
+    uploadAndDownloadPage.clickDownloadButton();
 });
 
 Then('The file should be downloaded successfully', () => {
-    cy.readFile("cypress/downloads/sampleFile.jpeg").should("exist");
+    uploadAndDownloadPage.downloadFileValidation();
 });

cypress/pages/04.download/UploadAndDownloadPage.ts

@@ -0,0 +1,35 @@
+import BasePage from "../BasePage";
+import { IPage } from "../IPage";
+
+class UploadAndDownloadPage extends BasePage implements IPage {
+    readonly title: string = 'DEMOQA';
+    readonly url: string = `${Cypress.config().baseUrl}/upload-download`;
+    readonly h1: string = 'Upload and Download';
+
+    private readonly downloadButtonSelector = '#downloadButton';
+    private readonly uploadButtonSelector = '#uploadFile';
+    private readonly uploadFilePath = 'cypress/downloads/sampleFile.jpeg';
+
+    pageRedirectValidation() {
+        this.validateTitle(this.title);
+        this.validateUrl(this.url);
+        this.validateH1(this.h1);
+    }
+
+    clickDownloadButton() {
+        this.clickElementByText(UploadAndDownloadPage.DOWNLOAD_BUTTON_TEXT, this.downloadButtonSelector);
+    }
+
+    clickUploadButton() {
+        this.clickElementByText(UploadAndDownloadPage.UPLOAD_BUTTON_TEXT, this.uploadButtonSelector);
+    }
+
+    downloadFileValidation() {
+        cy.readFile(this.uploadFilePath).should("exist");
+    }
+
+    static readonly DOWNLOAD_BUTTON_TEXT: string = 'Download';
+    static readonly UPLOAD_BUTTON_TEXT: string = 'Upload';
+}
+
+export const uploadAndDownloadPage = new UploadAndDownloadPage();

cypress/pages/0A.home/HomePage.ts

@@ -25,6 +25,11 @@ class HomePage extends BasePage implements IPage {
         this.clickElementByText(HomePage.BOOK_STORE_TEXT, this.cardSectionSelector);
     }
 
+    navigateToElementsSection() {
+        this.clickElementByText(HomePage.ELEMENTS_TEXT, this.cardSectionSelector);
+    }
+
+    static readonly ELEMENTS_TEXT: string = 'Elements';
     static readonly FORM_CARD_TEXT: string = 'Forms';
     static readonly ALERTS_FRAMES_WINDOWS_CARD_TEXT: string = 'Alerts, Frame & Windows';
     static readonly BOOK_STORE_TEXT: string = 'Book Store Application';

cypress/pages/0B.navbar/NavBarPage.ts

@@ -15,9 +15,14 @@ class NavBarPage extends BasePage {
         this.clickElementByText(NavBarPage.LOGIN_TEXT, this.elementListSelector);
     }
 
+    navigateToUploadAndDownloadSection() {
+        this.clickElementByText(NavBarPage.UPLOAD_AND_DOWNLOAD_TEXT, this.elementListSelector);
+    }
+
     static readonly PRACTICE_FORM_TEXT: string = 'Practice Form';
     static readonly FRAME_TEXT: string = 'Frames';
     static readonly LOGIN_TEXT: string = 'Login';
+    static readonly UPLOAD_AND_DOWNLOAD_TEXT: string = 'Upload and Download';
 }
 
 export const navBarPage = new NavBarPage();