[CP-3204] [E2E] [HELP] Help Page and Home Page refactor (#2145)

Co-authored-by: Milena Niebrzydowska <[email protected]>
mudita · Oct 23, 2024 · d5ac886 · d5ac886
1 parent beb7a16
commit d5ac886
Show file tree

Hide file tree

Showing 4 changed files with 61 additions and 55 deletions.
diff --git a/apps/mudita-center-e2e/src/page-objects/help.page.ts b/apps/mudita-center-e2e/src/page-objects/help.page.ts
@@ -6,66 +6,71 @@
 import Page from "./page"
 
 class HelpPage extends Page {
+
+  //Getters
   public get helpTabTitle() {
-    return $('[data-testid="location"]')
+    return $('//h4[@data-testid="location"]')
   }
   public get helpMainHeader() {
-    return $('[data-testid="help-main-header"]')
+    return $('//h3[@data-testid="help-main-header"]')
   }
   public get helpMainSubHeader() {
-    return $('[data-testid="help-main-subheader"]')
+    return $('//p[@data-testid="help-main-subheader"]')
   }
   public get iconSearch() {
-    return $('[data-testid="icon-search"]')
+    return $('//div[@data-testid="icon-search"]')
   }
   public get helpSearchInput() {
-    return $('[data-testid="help-search-input"]')
+    return $('//input[@data-testid="help-search-input"]')
   }
   public get helpSearchResults() {
-    return $('[data-testid="help-search-results"]')
+    return $('//div[@data-testid="help-search-results"]')
   }
   public get iconSearchHelpSearchResults() {
-    return $('[data-testid="help-search-results"] [data-testid="icon-search"]')
+    return $('//div[@data-testid="help-search-results"]//div[@data-testid="icon-search"]')
   }
   public get helpSearchResultsParagraph() {
-    return $('[data-testid="help-search-results"] p')
+    return $('//div[@data-testid="help-search-results"]//p')
   }
   public get helpSearchResultsList() {
-    return $('[data-testid="help-search-results"] ul')
+    return $('//div[@data-testid="help-search-results"]//ul')
   }
   public get helpSearchResultsItems() {
-    return $$('[data-testid="help-search-result-item"]')
+    return $$('//a[@data-testid="help-search-result-item"]')
   }
   public get helpCategoriesTitle() {
-    return $('[data-testid="help-categories-title"]')
+    return $('//h2[@data-testid="help-categories-title"]')
   }
   public get helpCategoriesList() {
-    return $('[data-testid="help-categories-list"]')
+    return $('//nav[@data-testid="help-categories-list"]')
   }
   public get helpCategoriesListItems() {
-    return $$('[data-testid="help-categories-list-item"]')
+    return $$('//a[@data-testid="help-categories-list-item"]')
   }
   public get helpSubCategoriesList() {
-    return $('[data-testid="help-subcategories-list"]')
+    return $('//div[@data-testid="help-subcategories-list"]')
   }
   public get helpSubCategoriesListItems() {
-    return $$('[data-testid="help-subcategories-list-item"]')
+    return $$('//div[@data-testid="help-subcategories-list-item"]')
+  }
+  public getHelpSubCategoriesListItemsFromColumn(columnIndex: number){
+    return $$(`(//div[@data-testid="help-subcategories-list"]/div)[${columnIndex + 1}]//div[@data-testid="help-subcategories-list-item"]`)   
   }
   public get helpSubCategoriesListItemsLeftColumn() {
-    return $$('[data-testid="help-subcategories-list"]>div')[0].$$(
-      '[data-testid="help-subcategories-list-item"]'
-    )
+    return this.getHelpSubCategoriesListItemsFromColumn(0)
   }
   public get helpSubCategoriesListItemsRightColumn() {
-    return $$('[data-testid="help-subcategories-list"]>div')[1].$$(
-      '[data-testid="help-subcategories-list-item"]'
-    )
+    return this.getHelpSubCategoriesListItemsFromColumn(1)
   }
   public get helpMainFooterDescription() {
-    return $('[data-testid="help-main-footer-description"]')
+    return $('//p[@data-testid="help-main-footer-description"]')
   }
   public get helpMainFooterContactSupportButton() {
-    return $('[data-testid="help-main-footer-contact-support-button"]')
+    return $('//button[@data-testid="help-main-footer-contact-support-button"]')
+  }
+  public async searchForArticle(text:string) {
+    const searchInput = await this.helpSearchInput
+    await searchInput.setValue(text)
   }
 }
 

diff --git a/apps/mudita-center-e2e/src/page-objects/home.page.ts b/apps/mudita-center-e2e/src/page-objects/home.page.ts
@@ -7,73 +7,79 @@ import Page from "./page"
 
 class HomePage extends Page {
   get homeHeader() {
-    return $("h1[data-testid='onboarding-title-header']")
+    return $("//h1[@data-testid='onboarding-title-header']")
   }
 
   get notNowButton() {
-    return $("button[data-testid='onboarding-not-now-button']")
+    return $("//button[@data-testid='onboarding-not-now-button']")
   }
 
   get myDevicesDoesntShowButton() {
     return $(
-      "button[data-testid='onboarding-my-device-does-not-show-up-button']"
+      "//button[@data-testid='onboarding-my-device-does-not-show-up-button']"
     )
   }
 
   get weAreSorryPageHeader() {
-    return $("h2[data-testid=onboarding-troubleshooting-title-header]")
+    return $("//h2[@data-testid='onboarding-troubleshooting-title-header']")
   }
 
   get weAreSorryPageFollowTheInstructionsParagraph() {
-    return $("p[data-testid='onboarding-troubleshooting-subtitle-paragraph']")
+    return $("//p[@data-testid='onboarding-troubleshooting-subtitle-paragraph']")
   }
 
   get weAreSorryPageInstructionsList() {
     return $$(
-      "ol li[data-testid='onboarding-troubleshooting-instruction-step-list-item']"
+      "//ol/li[@data-testid='onboarding-troubleshooting-instruction-step-list-item']"
     )
   }
 
   get thisDidntSolveParagraph() {
     return $(
-      "button[data-testid='onboarding-troubleshooting-ui-more-instructions'] p"
+      "//button[@data-testid='onboarding-troubleshooting-ui-more-instructions']/p"
     )
   }
 
   get tryAgainParagraph() {
-    return $("button[data-testid='onboarding-troubleshooting-ui-retry'] p")
+    return $("//button[@data-testid='onboarding-troubleshooting-ui-retry']/p")
   }
 
   get contactSupportButton() {
-    return $("[data-testid='onboarding-troubleshooting-ui-contact-support']")
+    return $("//button[@data-testid='onboarding-troubleshooting-ui-contact-support']")
   }
 
   get muditaCenterSupportModalHeader() {
-    return $("h2[data-testid='modal-title']")
+    return $("//h2[@data-testid='modal-title']")
   }
 
   get emailField() {
-    return $("input[data-testid='email-input']")
+    return $("//input[@data-testid='email-input']")
   }
 
   get messageField() {
-    return $("textarea[data-testid='description-input']")
+    return $("//textarea[@data-testid='description-input']")
   }
 
   get attachedFile() {
-    return $("ul[data-testid='file-list']")
+    return $("//ul[@data-testid='file-list']")
   }
 
   get sendButton() {
-    return $("button[data-testid='submit-button']")
+    return $("//button[@data-testid='submit-button']")
   }
 
   get closeCenterSupportModalButton() {
-    return $("button[data-testid='close-modal-button']")
+    return $("//button[@data-testid='close-modal-button']")
   }
 
   get centerSupportModal() {
-    return $("div[data-testid='contact-support-modal']")
+    return $("//div[@data-testid='contact-support-modal']")
+  }
+
+  public async clickNotNowButton() {
+    const button = await this.notNowButton;
+    await button.waitForDisplayed();
+    await button.click();
   }
 }
 export default new HomePage()
diff --git a/apps/mudita-center-e2e/src/page-objects/tabs.page.ts b/apps/mudita-center-e2e/src/page-objects/tabs.page.ts
@@ -52,8 +52,10 @@ class NavigationTabs extends Page {
     return $('[data-testid="help-menu-button"]')
   }
 
-  async helpTabClick() {
-    await this.helpTab.click()
+  public async openHelpPage() {
+    const helpTab = await this.helpTab;
+    await helpTab.waitForDisplayed({ timeout: 15000 });
+    await helpTab.click();
   }
 }
 

diff --git a/apps/mudita-center-e2e/src/specs/help/help-section-search-noresults.e2e.ts b/apps/mudita-center-e2e/src/specs/help/help-section-search-noresults.e2e.ts
@@ -10,25 +10,18 @@ import HomePage from "../../page-objects/home.page"
 describe("Check Help search for no results", () => {
   before(async () => {
     //Click Not Now button
-    const notNowButton = await HomePage.notNowButton
-    await notNowButton.waitForDisplayed()
-    await notNowButton.click()
+    await HomePage.clickNotNowButton()
     //Open Help page
-    const helpTab = await NavigationTabs.helpTab
-    await helpTab.waitForDisplayed({ timeout: 15000 })
-    await helpTab.click()
+    await NavigationTabs.openHelpPage()
   })
 
   it("Search for not existing article and verify no results information", async () => {
     //Search for not existing article by entering not findable string (special characters)
-    const helpSearchInput = await HelpPage.helpSearchInput
-    await helpSearchInput.setValue("!@#$%^&*()")
+    await HelpPage.searchForArticle("!@#$%^&*()")
 
     //Verify quick search: no results information
-    const helpSearchResults = await HelpPage.helpSearchResults
-    await expect(helpSearchResults).toBeDisplayed()
-    const iconSearchHelpSearchResults = await HelpPage.iconSearchHelpSearchResults
-    await expect(iconSearchHelpSearchResults).toBeDisplayed()
-    await expect(helpSearchResults).toHaveText("We couldn't find any topics...")
-  })
+    await expect(HelpPage.helpSearchResults).toBeDisplayed()
+    await expect(HelpPage.helpSearchResultsParagraph).toHaveText("We couldn't find any topics...")
+    }
+  )
 })