Skip to content

Commit

Permalink
Merge branch 'dev' into luis/playwright
Browse files Browse the repository at this point in the history
  • Loading branch information
@luisecm
luisecm authored Jun 12, 2024
2 parents 35edad6 + c7d09d8 commit 2efa146
Show file tree
Hide file tree
Showing 6 changed files with 81 additions and 175 deletions.
2 changes: 1 addition & 1 deletion cypress/e2e/01-pin-input.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ describe("Create Account and Login Tests", () => {
cy.location("href").should("include", "/auth/new_account");
authNewAccount.textNewAccountSecondary.should(
"have.text",
"Let's setup your new account. Please choose a username below.",
"Let's set up your new account. Please choose a username below.",
);
authNewAccount.labelNewAccountUsername.should("have.text", "Username");
authNewAccount.labelNewAccountStatus.should("have.text", "Status Message");
Expand Down
2 changes: 1 addition & 1 deletion cypress/e2e/05-settings-profile.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -338,7 +338,7 @@ describe("Settings Profile Tests", () => {
);
settingsProfile.storeRecoverySeedText.should(
"have.text",
"Store recovery seed on account (disable for increased security, irriversable)",
"Store recovery seed on account (disable for increased security, irreversible)",
);

// Show Recovery Phrase and ensure is displayed now
Expand Down
81 changes: 35 additions & 46 deletions cypress/e2e/06-settings-inventory.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,11 @@ import settingsProfile from "./PageObjects/Settings/SettingsProfile";
describe("Settings - Inventory", () => {
const username = faker.internet.userName();
const status = faker.lorem.sentence(3);
const pin = "1234";

beforeEach(() => {
loginPinPage.loginWithPin("1234");
// Login and set up user before each test
loginPinPage.loginWithPin(pin);
authNewAccount.createRandomUser(username, status);
chatsMainPage.validateChatsMainPageIsShown();
chatsMainPage.goToSettings();
Expand All @@ -19,6 +21,7 @@ describe("Settings - Inventory", () => {

it("J1 - Page should display items purchased from Marketplace", () => {
cy.url().should("include", "/settings/inventory");

const expectedFrames = [
{ name: "Skull Party", type: "Profile Picture Frame" },
{ name: "Fire", type: "Profile Picture Frame" },
Expand All @@ -27,80 +30,66 @@ describe("Settings - Inventory", () => {
{ name: "Mustache", type: "Profile Picture Frame" },
{ name: "Orbiting Moon", type: "Profile Picture Frame" },
];

settingsInventory.validateInventoryFrames(expectedFrames);
});

it("J2 - After user selects Profile Picture Frame it should be properly displayed everywhere in the app where the user's profile picture appears", () => {
cy.url().should("include", "/settings/inventory");

// Fire inventory frame should not be equipped
settingsInventory.getFrameButtonText("Fire").should("have.text", "Equip");

// Equip Fire inventory frame
settingsInventory.clickOnFrameButton("Fire");
equipFrame("Fire");

// Fire inventory frame should be equipped
settingsInventory
.getFrameContainer("Fire")
.should("have.class", "equipped");

settingsInventory.profilePictureFrameName.should("have.text", "Fire");
settingsInventory.profilePictureFrameType.should(
"have.text",
"Profile Picture Frame",
);
// Validate the frame is equipped and displayed correctly
validateEquippedFrame("Fire");

// Navigate to Profile page and verify frame is displayed
settingsInventory.buttonProfile.click();
settingsProfile.profileImageFrame
.should("exist")
.and("have.attr", "src", "/assets/frames/fire.png");

// Navigate back to Inventory and unequip the frame
settingsProfile.buttonInventory.click();
``;

settingsInventory.profilePictureFrameUnequipButton
.should("contain", "Unequip")
.click();

// Fire inventory frame should be equipped
settingsInventory
.getFrameContainer("Fire")
.should("not.have.class", "equipped");
unequipFrame("Fire");

// Validate the frame is unequipped
settingsInventory.buttonProfile.click();
settingsProfile.profileImageFrame.should("not.exist");
});

it("J3, J4, J5, J6 - Equipping and unequipping inventory item", () => {
cy.url().should("include", "/settings/inventory");

// Fire inventory frame should not be equipped
settingsInventory.getFrameButtonText("Fire").should("have.text", "Equip");

// Equip Fire inventory frame
settingsInventory.clickOnFrameButton("Fire");

// Fire inventory frame should be equipped
settingsInventory
.getFrameContainer("Fire")
.should("have.class", "equipped");
equipFrame("Fire");

// Validate equipped frame
settingsInventory.inventoryFrameEquippedButton
.should("have.css", "background-color", "rgb(77, 77, 255)")
.should("contain", "Equipped");

settingsInventory.profilePictureFrameName.should("have.text", "Fire");
settingsInventory.profilePictureFrameType.should(
"have.text",
"Profile Picture Frame",
);
settingsInventory.profilePictureFrameUnequipButton
.should("contain", "Unequip")
.click();

// Fire inventory frame should be equipped
settingsInventory
.getFrameContainer("Fire")
.should("not.have.class", "equipped");
settingsInventory.profilePictureFrameType.should("have.text", "Profile Picture Frame");

// Unequip the frame
unequipFrame("Fire");
});

// Helper functions
const equipFrame = (frameName) => {
settingsInventory.getFrameButtonText(frameName).should("have.text", "Equip");
settingsInventory.clickOnFrameButton(frameName);
settingsInventory.getFrameContainer(frameName).should("have.class", "equipped");
};

const unequipFrame = (frameName) => {
settingsInventory.profilePictureFrameUnequipButton.should("contain", "Unequip").click();
settingsInventory.getFrameContainer(frameName).should("not.have.class", "equipped");
};

const validateEquippedFrame = (frameName) => {
settingsInventory.profilePictureFrameName.should("have.text", frameName);
settingsInventory.profilePictureFrameType.should("have.text", "Profile Picture Frame");
};
});
162 changes: 36 additions & 126 deletions cypress/e2e/07-settings-customization.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,25 +18,16 @@ describe("Settings - Customization", () => {
});

it("K1 - Language dropdown should display English", () => {
settingsCustomizations.appLanguageSectionLabel.should(
"have.text",
"App Language",
);
settingsCustomizations.appLanguageSectionText.should(
"have.text",
"Change language.",
);
settingsCustomizations.appLanguageSectionSelectorOption.should(
"have.length",
1,
);
cy.assertText(settingsCustomizations.appLanguageSectionLabel, "App Language", "App Language label should be present");
cy.assertText(settingsCustomizations.appLanguageSectionText, "Change language.", "App Language text should be present");
settingsCustomizations.appLanguageSectionSelectorOption.should("have.length", 1);
settingsCustomizations.appLanguageSectionSelectorOption
.should("have.value", "english")
.and("have.text", "English (USA)");
});

it("K2 - Font dropdown should show expected font names", () => {
const expectedFonts: string[] = [
const expectedFonts = [
"Poppins",
"SpaceMono",
"ChakraPetch",
Expand All @@ -52,56 +43,34 @@ describe("Settings - Customization", () => {
"MajorMono",
"Merriweather",
"PoiretOne",
"OpenDyslexic",
"OpenDyslexic"
];
settingsCustomizations.fontSectionLabel.should("have.text", "Font");
settingsCustomizations.fontSectionText.should(
"have.text",
"Change the font used in the app.",
);
settingsCustomizations.fontSectionSelectorOption.should("have.length", 16);
cy.assertText(settingsCustomizations.fontSectionLabel, "Font", "Font label should be present");
cy.assertText(settingsCustomizations.fontSectionText, "Change the font used in the app.", "Font text should be present");
settingsCustomizations.fontSectionSelectorOption.should("have.length", expectedFonts.length);
settingsCustomizations.validateFontNames(expectedFonts);
});

it("K3 - Selected Fonts should be applied everywhere throughout the app", () => {
settingsCustomizations.selectFont("JosefinSans");
settingsCustomizations.fontSectionText.should(
"have.css",
"font-family",
"JosefinSans",
);
settingsCustomizations.fontSectionText.should("have.css", "font-family", "JosefinSans");
settingsCustomizations.goToChat();
cy.contains("Let's get something started!").should(
"have.css",
"font-family",
"JosefinSans",
);
cy.contains("Let's get something started!").should("have.css", "font-family", "JosefinSans");
});

// Cannot be tested for now since its not working on Uplink Web
it.skip("K4 - Clicking OpenFolder should open the Fonts folder", () => {});

it("K5 - Font size should have a minimum of .82", () => {
settingsCustomizations.fontScalingSectionLabel.should(
"have.text",
"Font Scaling",
);
settingsCustomizations.fontScalingSectionText.should(
"have.text",
"Scale the font size up or down to your liking.",
);
cy.assertText(settingsCustomizations.fontScalingSectionLabel, "Font Scaling", "Font Scaling label should be present");
cy.assertText(settingsCustomizations.fontScalingSectionText, "Scale the font size up or down to your liking.", "Font Scaling text should be present");
settingsCustomizations.fontScalingSectionInput.should("have.value", "1.00");

for (let i = 0; i < 10; i++) {
settingsCustomizations.fontScalingSectionDecreaseButton.click();
}

settingsCustomizations.fontScalingSectionInput.should("have.value", "0.82");
settingsCustomizations.fontScalingSectionText.should(
"have.css",
"font-size",
"13.12px",
);
settingsCustomizations.fontScalingSectionText.should("have.css", "font-size", "13.12px");
});

it("K6, K7 - Font size should have a maximum of 1.50 and can be applied correctly everywhere through the app", () => {
Expand All @@ -112,38 +81,27 @@ describe("Settings - Customization", () => {
}

settingsCustomizations.fontScalingSectionInput.should("have.value", "1.50");
settingsCustomizations.fontScalingSectionText.should(
"have.css",
"font-size",
"24px",
);
settingsCustomizations.fontScalingSectionText.should("have.css", "font-size", "24px");
settingsCustomizations.goToChat();
cy.contains("Let's get something started!").should(
"have.css",
"font-size",
"24px",
);
cy.contains("Let's get something started!").should("have.css", "font-size", "24px");
});

// Cannot be tested for now since its not working on Uplink Web
it.skip("K8 - Clicking the moon button should change theme of the app from Dark to Light", () => {});

it("K9 - Themes dropdown should display Default", () => {
const expectedThemes: string[] = ["Default"];
settingsCustomizations.themeSectionLabel.should("have.text", "Theme");
settingsCustomizations.themeSectionText.should(
"have.text",
"Change the theme of the app.",
);
const expectedThemes = [
"Default"
];
cy.assertText(settingsCustomizations.themeSectionLabel, "Theme", "Theme label should be present");
cy.assertText(settingsCustomizations.themeSectionText, "Change the theme of the app.", "Theme text should be present");
settingsCustomizations.themeSectionSelectorOption.should("have.length", 1);
settingsCustomizations.validateThemes(expectedThemes);
});

// Cannot be tested for now since its not working on Uplink Web
it.skip("K10 - Themes folder button should open the themes folder", () => {});

it("K11 - Primary Colors should display expected values", () => {
const expectedPrimaryColors: string[] = [
const expectedPrimaryColors = [
"Neo Orbit",
"Creamy Peach",
"Neon Sunflower",
Expand All @@ -154,20 +112,11 @@ describe("Settings - Customization", () => {
"Rogue Pink",
"Squeaky",
"Apple Valley",
"Pencil Lead",
"Pencil Lead"
];
settingsCustomizations.primaryColorSectionLabel.should(
"have.text",
"Primary Color",
);
settingsCustomizations.primaryColorSectionText.should(
"have.text",
"Change the primary color of the app.",
);
settingsCustomizations.primaryColorSectionColorSwatchButton.should(
"have.length",
11,
);
cy.assertText(settingsCustomizations.primaryColorSectionLabel, "Primary Color", "Primary Color label should be present");
cy.assertText(settingsCustomizations.primaryColorSectionText, "Change the primary color of the app.", "Primary Color text should be present");
settingsCustomizations.primaryColorSectionColorSwatchButton.should("have.length", expectedPrimaryColors.length);
settingsCustomizations.validatePrimaryColors(expectedPrimaryColors);
});

Expand All @@ -176,67 +125,28 @@ describe("Settings - Customization", () => {
settingsCustomizations.customColorPicker.should("be.visible");
settingsCustomizations.customColorInput.clear().type("#ff8fb8");
settingsCustomizations.buttonCustomization.click({ force: true });
settingsCustomizations.buttonCustomization.should(
"have.css",
"background-color",
"rgb(255, 143, 184)",
);
settingsCustomizations.buttonCustomization.should("have.css", "background-color", "rgb(255, 143, 184)");
});

it("K13 - Selected primary color should be applied throughout the entire app", () => {
// Button selected has initially default color
settingsCustomizations.buttonCustomization.should(
"have.css",
"background-color",
"rgb(77, 77, 255)",
);

// Select Traffic Cone as primary color and validate that button selected has new background color
settingsCustomizations.buttonCustomization.should("have.css", "background-color", "rgb(77, 77, 255)");

settingsCustomizations.selectColorSwatch("Traffic Cone");
settingsCustomizations.buttonCustomization.should(
"have.css",
"background-color",
"rgb(255, 60, 0)",
);
settingsCustomizations.buttonCustomization.should("have.css", "background-color", "rgb(255, 60, 0)");

settingsCustomizations.goToChat();
chatsMain.buttonAddFriends.should(
"have.css",
"background-color",
"rgb(255, 60, 0)",
);
chatsMain.buttonAddFriends.should("have.css", "background-color", "rgb(255, 60, 0)");
});

it("K14 - User should be able to add additional custom CSS to the application", () => {
settingsCustomizations.sidebar.should(
"have.css",
"background-color",
"rgba(0, 0, 0, 0)",
);
settingsCustomizations.customCSSSectionLabel.should(
"have.text",
"Custom CSS",
);
settingsCustomizations.customCSSSectionText.should(
"have.text",
"Add additional custom CSS to the application.",
);
settingsCustomizations.customCSSSectionTextArea.type(
".sidebar {background-color: rgb(255, 0, 141)}",
{ parseSpecialCharSequences: false },
);
settingsCustomizations.sidebar.should("have.css", "background-color", "rgba(0, 0, 0, 0)");
cy.assertText(settingsCustomizations.customCSSSectionLabel, "Custom CSS", "Custom CSS label should be present");
cy.assertText(settingsCustomizations.customCSSSectionText, "Add additional custom CSS to the application.", "Custom CSS text should be present");
settingsCustomizations.customCSSSectionTextArea.type(".sidebar {background-color: rgb(255, 0, 141)}", { parseSpecialCharSequences: false });
settingsCustomizations.buttonCustomization.click();
settingsCustomizations.sidebar.should(
"have.css",
"background-color",
"rgb(255, 0, 141)",
);
settingsCustomizations.sidebar.should("have.css", "background-color", "rgb(255, 0, 141)");

settingsCustomizations.goToChat();
chatsMain.sidebar.should(
"have.css",
"background-color",
"rgb(255, 0, 141)",
);
chatsMain.sidebar.should("have.css", "background-color", "rgb(255, 0, 141)");
});
});
Loading

0 comments on commit 2efa146

Please sign in to comment.