-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
update(test): finish gif and stickers tests (#163)
- Loading branch information
Showing
4 changed files
with
402 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,11 +1,77 @@ | ||
| import MainPage from "../MainPage"; | ||
| import { type Locator, type Page } from "@playwright/test"; | ||
| import { type Locator, type Page, expect } from "@playwright/test"; | ||
| import { CombinedSelector } from "./CombinedSelector"; | ||
|
|
||
| export class GifPicker extends MainPage { | ||
| readonly combinedSelector: Locator; | ||
| export class GifPicker extends CombinedSelector { | ||
| readonly allFavoritesButton: Locator; | ||
| readonly allGifs: Locator; | ||
| readonly favoriteGifs: Locator; | ||
| readonly gifContainer: Locator; | ||
| readonly gifFavoriteButton: Locator; | ||
| readonly gifImage: Locator; | ||
| readonly gifsSizeLabel: Locator; | ||
| readonly gifsSizeRangeSelector: Locator; | ||
| readonly gifsSizeRangeSelectorInput: Locator; | ||
| readonly searchInput: Locator; | ||
| readonly textNoFavoritesYet: Locator; | ||
|
|
||
| constructor(public readonly page: Page) { | ||
| super(page); | ||
| this.combinedSelector = this.page.getByTestId("combined-selector"); | ||
| this.allFavoritesButton = this.page.getByTestId( | ||
| "giphy-selector-favorites-button", | ||
| ); | ||
| this.allGifs = this.page.getByTestId("giphy-selector-gifs"); | ||
| this.favoriteGifs = this.page.getByTestId("giphy-selector-favorites"); | ||
| this.gifContainer = this.page.getByTestId("gif-container"); | ||
| this.gifFavoriteButton = this.gifContainer.getByTestId( | ||
| "gif-container-favorite-button", | ||
| ); | ||
| this.gifImage = this.gifContainer.locator("img"); | ||
| this.gifsSizeLabel = this.page.getByTestId("giphy-selector-label-size"); | ||
| this.gifsSizeRangeSelector = this.page.getByTestId("range-selector"); | ||
| this.gifsSizeRangeSelectorInput = this.page.getByTestId( | ||
| "range-selector-input", | ||
| ); | ||
| this.searchInput = this.page.getByTestId("giphy-selector-search-bar"); | ||
| this.textNoFavoritesYet = this.page.getByTestId("text-no-favorites-yet"); | ||
| } | ||
|
|
||
| async changeGifSizeView(size: string) { | ||
| await this.gifsSizeRangeSelectorInput.fill(size); | ||
| } | ||
|
|
||
| async getGifAltText(index: number) { | ||
| const textOfGif = await this.gifContainer | ||
| .nth(index) | ||
| .locator("img") | ||
| .getAttribute("alt"); | ||
| return textOfGif; | ||
| } | ||
|
|
||
| async searchGif(gifText: string) { | ||
| await this.searchInput.focus(); | ||
| await this.page.keyboard.type(gifText); | ||
| await this.page.waitForTimeout(1000); | ||
| } | ||
|
|
||
| async selectGif(gifText: string) { | ||
| await this.page | ||
| .getByTestId("gif-container") | ||
| .filter({ | ||
| has: this.page.getByAltText(gifText), | ||
| }) | ||
| .first() | ||
| .click(); | ||
| await this.page.waitForTimeout(2000); | ||
| } | ||
|
|
||
| async validateSingleGifSize(gifText: string, expectedSize: string) { | ||
| const gifLocator = this.page.getByTestId("gif-container").filter({ | ||
| has: this.page.getByAltText(gifText), | ||
| }); | ||
| await expect(gifLocator).toHaveCSS("font-size", expectedSize); | ||
| } | ||
|
|
||
| async waitForGifsToLoad() { | ||
| await this.page.waitForTimeout(2000); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,11 +1,104 @@ | ||
| import MainPage from "../MainPage"; | ||
| import { type Locator, type Page } from "@playwright/test"; | ||
| import { type Locator, type Page, expect } from "@playwright/test"; | ||
| import { CombinedSelector } from "./CombinedSelector"; | ||
|
|
||
| export class StickerPicker extends MainPage { | ||
| readonly combinedSelector: Locator; | ||
| export class StickerPicker extends CombinedSelector { | ||
| readonly allStickers: Locator; | ||
| readonly stickerCollection: Locator; | ||
| readonly stickerCollectionItem: Locator; | ||
| readonly stickerCollectionItemImage: Locator; | ||
| readonly stickerCollectionItemName: Locator; | ||
| readonly stickerCollectionLabel: Locator; | ||
| readonly stickerSearchInput: Locator; | ||
| readonly stickerSelectorSidebar: Locator; | ||
| readonly stickerSidebarCollection: Locator; | ||
| readonly stickerSelectorSidebarLabel: Locator; | ||
|
|
||
| constructor(public readonly page: Page) { | ||
| super(page); | ||
| this.combinedSelector = this.page.getByTestId("combined-selector"); | ||
| this.allStickers = this.page.getByTestId("sticker-contents"); | ||
| this.stickerCollection = this.page.getByTestId("sticker-collection"); | ||
| this.stickerCollectionItem = this.page.getByTestId( | ||
| "sticker-collection-item", | ||
| ); | ||
| this.stickerCollectionItemImage = this.stickerCollectionItem.locator("img"); | ||
| this.stickerCollectionItemName = this.stickerCollectionItem.getByTestId( | ||
| "sticker-collection-item-name", | ||
| ); | ||
| this.stickerCollectionLabel = this.page.getByTestId( | ||
| "sticker-collection-label", | ||
| ); | ||
| this.stickerSelectorSidebar = this.page.getByTestId( | ||
| "sticker-selector-sidebar", | ||
| ); | ||
| this.stickerSidebarCollection = this.page.getByTestId( | ||
| "sticker-sidebar-collection", | ||
| ); | ||
| this.stickerSelectorSidebarLabel = this.page.getByTestId( | ||
| "sticker-selector-sidebar-label", | ||
| ); | ||
| } | ||
|
|
||
| async navigateThroughStickerCategories(collectionName: string) { | ||
| await this.page.getByLabel("Jump to " + collectionName).click(); | ||
| await this.page | ||
| .locator('[id="' + collectionName + '"]') | ||
| .waitFor({ state: "visible" }); | ||
| } | ||
|
|
||
| async selectSticker(collectionName: string, stickerName: string) { | ||
| const stickerCollection = this.page.locator( | ||
| '[id="' + collectionName + '"]', | ||
| ); | ||
| const stickerCollectionItem = stickerCollection | ||
| .getByTestId("sticker-collection-item") | ||
| .filter({ | ||
| has: this.page.getByAltText(stickerName), | ||
| }); | ||
| await stickerCollectionItem.click(); | ||
| await this.page.waitForTimeout(2000); | ||
| } | ||
|
|
||
| async searchSticker(stickerText: string) { | ||
| await this.stickerSearchInput.focus(); | ||
| await this.page.keyboard.type(stickerText); | ||
| await this.page.waitForTimeout(1000); | ||
| } | ||
|
|
||
| async validateStickerCategories(expectedCategories: string[]) { | ||
| // Define an array to store section names | ||
| const sectionNames = []; | ||
|
|
||
| // Select all section elements (assuming they have a data-cy attribute ending with '-section') | ||
| const sections = await this.page.$$( | ||
| `section[data-cy$="sticker-collection"]`, | ||
| ); | ||
|
|
||
| // Loop through each section and find its corresponding label | ||
| for (const section of sections) { | ||
| // Find the label within the current section that ends with '-label' | ||
| const label = await section.$( | ||
| `label[data-cy$="sticker-collection-label"]`, | ||
| ); | ||
| if (label) { | ||
| const sectionName = await label.textContent(); | ||
| sectionNames.push(sectionName.trim()); | ||
| } | ||
| } | ||
| expect(sectionNames).toEqual(expectedCategories); | ||
| } | ||
|
|
||
| async validateNumberOfStickersPerSection( | ||
| collectionName: string, | ||
| expectedNumber: number, | ||
| ) { | ||
| const stickerCount = await this.page | ||
| .locator('[id="' + collectionName + '"]') | ||
| .getByTestId("sticker-collection-item") | ||
| .count(); | ||
| expect(stickerCount).toEqual(expectedNumber); | ||
| } | ||
|
|
||
| async waitForStickersToLoad() { | ||
| await this.page.waitForTimeout(2000); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.