diff --git a/config/wdio.windows.app.conf.ts b/config/wdio.windows.app.conf.ts index f3e0ba319fc..618fc0c6dff 100644 --- a/config/wdio.windows.app.conf.ts +++ b/config/wdio.windows.app.conf.ts @@ -106,6 +106,7 @@ export const config: WebdriverIO.Config = { onPrepare: async function() { // Declare constants for folder locations const cacheFolder = homedir() + "\\.uplink\\.user" + const savedFile = join(process.cwd(), "\\tests\\fixtures\\saved.jpg") const sourceReusableData = join(process.cwd(), "\\tests\\fixtures\\users\\FriendsTestUser") const targetReusableData = join(process.cwd(), "\\tests\\fixtures\\users\\windows\\FriendsTestUser") const allureResultsFolder = join(process.cwd(), "\\allure-results"); @@ -113,6 +114,7 @@ export const config: WebdriverIO.Config = { const testResultsFolder = join(process.cwd(), "\\test-results"); try { await rmSync(allureResultsFolder, { recursive: true, force: true }); + await rmSync(savedFile, { recursive: true, force: true }); await rmSync(testReportFolder, { recursive: true, force: true }); await rmSync(testResultsFolder, { recursive: true, force: true }); console.log("Deleted Artifacts Folders Successfully!"); diff --git a/config/wdio.windows.ci.conf.ts b/config/wdio.windows.ci.conf.ts index 2abe8d83b25..a288729891f 100644 --- a/config/wdio.windows.ci.conf.ts +++ b/config/wdio.windows.ci.conf.ts @@ -106,6 +106,7 @@ export const config: WebdriverIO.Config = { onPrepare: async function() { // Declare constants for folder locations const cacheFolder = homedir() + "\\.uplink\\.user" + const savedFile = join(process.cwd(), "\\tests\\fixtures\\saved.jpg") const sourceReusableData = join(process.cwd(), "\\tests\\fixtures\\users\\FriendsTestUser") const targetReusableData = join(process.cwd(), "\\tests\\fixtures\\users\\windows\\FriendsTestUser") const allureResultsFolder = join(process.cwd(), "\\allure-results"); @@ -113,6 +114,7 @@ export const config: WebdriverIO.Config = { const testResultsFolder = join(process.cwd(), "\\test-results"); try { await rmSync(allureResultsFolder, { recursive: true, force: true }); + await rmSync(savedFile, { recursive: true, force: true }); await rmSync(testReportFolder, { recursive: true, force: true }); await rmSync(testResultsFolder, { recursive: true, force: true }); console.log("Deleted Artifacts Folders Successfully!"); diff --git a/tests/screenobjects/settings/CropToolProfileModal.ts b/tests/screenobjects/settings/CropToolProfileModal.ts index a974b1091be..d1574feacac 100644 --- a/tests/screenobjects/settings/CropToolProfileModal.ts +++ b/tests/screenobjects/settings/CropToolProfileModal.ts @@ -59,7 +59,7 @@ export default class CropImageProfileModal extends UplinkMainScreen { } get cropImagePreview() { - return this.cropImageTopbar.$(SELECTORS.CROP_IMAGE_PREVIEW); + return this.cropImageModal.$(SELECTORS.CROP_IMAGE_PREVIEW); } get cropImageRange() { @@ -145,4 +145,9 @@ export default class CropImageProfileModal extends UplinkMainScreen { const rangeValueText = await rangeValue.getText(); return rangeValueText; } + + async validateCropToolModalIsShown() { + const cropImageModal = await this.cropImageModal; + await cropImageModal.waitForDisplayed(); + } } diff --git a/tests/screenobjects/settings/SettingsProfileScreen.ts b/tests/screenobjects/settings/SettingsProfileScreen.ts index 8ff1bfa69fe..b76657953eb 100644 --- a/tests/screenobjects/settings/SettingsProfileScreen.ts +++ b/tests/screenobjects/settings/SettingsProfileScreen.ts @@ -339,7 +339,7 @@ export default class SettingsProfileScreen extends SettingsBaseScreen { await profileBannerImage.waitForExist(); } - async uploadProfilePicture(relativePath: string) { + async selectProfilePicture(relativePath: string) { // // Invoke File Selection method depending on current OS driver // If Windows driver is running, first retrieve the current context and pass it to file selection function @@ -354,7 +354,9 @@ export default class SettingsProfileScreen extends SettingsBaseScreen { await profilePictureImage.click(); await selectFileOnWindows(relativePath, uplinkContext, executor); } + } + async validateProfilePictureIsShown() { // Validate that profile banner is displayed on screen const profilePictureImage = await this.profilePicture; await profilePictureImage.waitForExist(); diff --git a/tests/specs/05-settings-profile.spec.ts b/tests/specs/05-settings-profile.spec.ts index 8ca22e21834..0547a42b245 100644 --- a/tests/specs/05-settings-profile.spec.ts +++ b/tests/specs/05-settings-profile.spec.ts @@ -1,9 +1,9 @@ import "module-alias/register"; -import ChatsSidebar from "@screenobjects/chats/ChatsSidebar"; +import CropImageProfileModal from "@screenobjects/settings/CropToolProfileModal"; import FilesScreen from "@screenobjects/files/FilesScreen"; import SettingsProfileScreen from "@screenobjects/settings/SettingsProfileScreen"; import { USER_A_INSTANCE } from "@helpers/constants"; -let chatsSidebarFirstUser = new ChatsSidebar(USER_A_INSTANCE); +let cropProfileFirstUser = new CropImageProfileModal(USER_A_INSTANCE); let filesScreenFirstUser = new FilesScreen(USER_A_INSTANCE); let settingsProfileFirstUser = new SettingsProfileScreen(USER_A_INSTANCE); @@ -72,12 +72,67 @@ export default async function settingsProfile() { await expect(statusInput).toHaveTextContaining(""); }); - // Skipping test since it needs implementation of Crop Tool recently merged - // Needs visual validation steps to ensure that picture was actually loaded matches with expected image - xit("Settings Profile - Add profile picture", async () => { - await settingsProfileFirstUser.uploadProfilePicture( + it("Settings Profile - Profile picture - Display Crop Tool Modal", async () => { + // Click on profile picture upload button and select the file logo.jpg + await settingsProfileFirstUser.selectProfilePicture( + "./tests/fixtures/logo.jpg" + ); + + // Validate Crop Tool Modal is displayed + await cropProfileFirstUser.validateCropToolModalIsShown(); + }); + + it("Settings Profile - Profile Picture - Crop Tool Modal elements", async () => { + // Validate Image Preview is displayed on Profile Picture Crop Tool Modal + await cropProfileFirstUser.cropImagePreview.waitForExist(); + + // Validate buttons to increase and decrease zoom are displayed on Profile Picture Crop Tool Modal + await cropProfileFirstUser.cropImageRangeDecreaseButton.waitForExist(); + await cropProfileFirstUser.cropImageRangeIncreaseButton.waitForExist(); + + // Validate input slider for zoom size is displayed on Profile Picture Crop Tool Modal + await cropProfileFirstUser.cropImageRangeInputSlider.waitForExist(); + + // Validate buttons to cancel or confirm edition are displayed on Profile Picture Crop Tool Modal + await cropProfileFirstUser.cropImageTopbarButtonCancel.waitForExist(); + await cropProfileFirstUser.cropImageTopbarButtonConfirm.waitForExist(); + + // Validate helper text is displayed on top of modal + await cropProfileFirstUser.cropImageTopbarLabel.waitForExist(); + + // Validate default value shown for zoom slider is 1 + const rangeValueText = await cropProfileFirstUser.cropImageRangeValueText; + await expect(rangeValueText).toHaveTextContaining("1"); + }); + + it("Settings Profile - Profile Picture - Close Crop Tool Modal", async () => { + // Click on Cancel button and assert Crop Tool Modal is closed + await cropProfileFirstUser.clickOnCancelButton(); + await cropProfileFirstUser.cropImageModal.waitForExist({ reverse: true }); + }); + + it("Settings Profile - Profile Picture - Crop Image and add profile picture", async () => { + // Click on profile picture upload button and select the file logo.jpg + await settingsProfileFirstUser.selectProfilePicture( "./tests/fixtures/logo.jpg" ); + + // Validate Crop Tool Modal is displayed + await cropProfileFirstUser.validateCropToolModalIsShown(); + + // Click three times on increase button, then one time on decrease button + await cropProfileFirstUser.clickMultipleTimesIncreaseButton(3); + await cropProfileFirstUser.clickOnDecreaseRangeButton(); + + // Validate final value shown for zoom slider is 1 + const rangeValueText = await cropProfileFirstUser.cropImageRangeValueText; + await expect(rangeValueText).toHaveTextContaining("1.2"); + + // Click on confirm button to save + await cropProfileFirstUser.clickOnConfirmButton(); + + // Validate new profile picture is displayed + await settingsProfileFirstUser.validateProfilePictureIsShown(); }); it("Settings Profile - Validate change banner tooltip", async () => { @@ -100,15 +155,24 @@ export default async function settingsProfile() { ); }); - // Skipping test since it needs implementation of Crop Tool recently merged - // Needs visual validation steps to ensure that picture was actually loaded matches with expected image - xit("Settings Profile - Change profile picture", async () => { + it("Settings Profile - Change profile picture", async () => { // Wait for toast notification to be closed before starting test await settingsProfileFirstUser.waitUntilNotificationIsClosed(); - await settingsProfileFirstUser.uploadProfilePicture( + // Click on profile picture upload button and select the file second-profile.jpg + await settingsProfileFirstUser.selectProfilePicture( "./tests/fixtures/second-profile.png" ); + + // Validate Crop Tool Modal is displayed + await cropProfileFirstUser.validateCropToolModalIsShown(); + + // Change the size of picture and click on confirm button to save + await cropProfileFirstUser.clickOnIncreaseRangeButton(); + await cropProfileFirstUser.clickOnConfirmButton(); + + // Validate new profile picture is displayed + await settingsProfileFirstUser.validateProfilePictureIsShown(); }); // Needs visual validation steps to ensure that picture was actually loaded matches with expected image diff --git a/tests/specs/14-create-reusable-accounts.spec.ts b/tests/specs/14-create-reusable-accounts.spec.ts index 1b48a0b1f93..8b315fcb7de 100644 --- a/tests/specs/14-create-reusable-accounts.spec.ts +++ b/tests/specs/14-create-reusable-accounts.spec.ts @@ -6,8 +6,10 @@ import { saveTestKeys, } from "@helpers/commands"; import { USER_A_INSTANCE } from "@helpers/constants"; +import CropImageProfileModal from "@screenobjects/settings/CropToolProfileModal"; import SettingsProfileScreen from "@screenobjects/settings/SettingsProfileScreen"; import WelcomeScreen from "@screenobjects/welcome-screen/WelcomeScreen"; +let cropProfileFirstUser = new CropImageProfileModal(USER_A_INSTANCE); let settingsProfileFirstUser = new SettingsProfileScreen(USER_A_INSTANCE); let welcomeScreenFirstUser = new WelcomeScreen(USER_A_INSTANCE); @@ -21,13 +23,19 @@ export default async function createReusableAccounts() { await settingsProfileFirstUser.waitForIsShown(true); }); - // Skipping test since it needs implementation of Crop Tool recently merged - xit("Add profile picture - Chat User A", async () => { - it("Settings Profile - Add profile picture", async () => { - await settingsProfileFirstUser.uploadProfilePicture( - "./tests/fixtures/logo.jpg" - ); - }); + it("Add profile picture - Chat User A", async () => { + await settingsProfileFirstUser.selectProfilePicture( + "./tests/fixtures/logo.jpg" + ); + + // Validate Crop Tool Modal is displayed + await cropProfileFirstUser.validateCropToolModalIsShown(); + + // Do not change the size of picture and just confirm on crop modal + await cropProfileFirstUser.clickOnConfirmButton(); + + // Validate new profile picture is displayed + await settingsProfileFirstUser.validateProfilePictureIsShown(); }); it("Add banner picture - Chat User A", async () => { @@ -66,11 +74,19 @@ export default async function createReusableAccounts() { await settingsProfileFirstUser.waitForIsShown(true); }); - // Skipping test since it needs implementation of Crop Tool recently merged - xit("Add profile picture - Chat User B", async () => { - await settingsProfileFirstUser.uploadProfilePicture( + it("Add profile picture - Chat User B", async () => { + await settingsProfileFirstUser.selectProfilePicture( "./tests/fixtures/second-profile.png" ); + + // Validate Crop Tool Modal is displayed + await cropProfileFirstUser.validateCropToolModalIsShown(); + + // Do not change the size of picture and just confirm on crop modal + await cropProfileFirstUser.clickOnConfirmButton(); + + // Validate new profile picture is displayed + await settingsProfileFirstUser.validateProfilePictureIsShown(); }); it("Add banner picture - Chat User B", async () => {