From ddf7ff01a9b825652e2760af0e8e416b77c83f6a Mon Sep 17 00:00:00 2001 From: "Sinan Sonmez (Chaush)" <37421564+sinansonmez@users.noreply.github.com> Date: Sat, 13 Aug 2022 23:44:08 +0200 Subject: [PATCH 1/7] verify colorize option is selected or not --- ...age_display_mode_colorize_username_spec.js | 72 +++++++++++++++++++ 1 file changed, 72 insertions(+) create mode 100644 e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js diff --git a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js new file mode 100644 index 000000000000..f3ad9c6ea6d0 --- /dev/null +++ b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js @@ -0,0 +1,72 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +// *************************************************************** +// - [#] indicates a test step (e.g. # Go to a page) +// - [*] indicates an assertion (e.g. * Check the title) +// - Use element ID when selecting an element. Create one if none. +// *************************************************************** + +// Stage: @prod +// Group: @account_setting + +describe('Settings > Display > Message Display', () => { + before(() => { + // # Login as new user and visit off-topic + cy.apiInitSetup({loginAfter: true}).then(({offTopicUrl}) => { + cy.visit(offTopicUrl); + }); + goToMessageDisplaySetting(); + }); + + // it('MM-T4984_1 Message Display: colorize usernames option should be hidden in Compact mode', () => { + // // * Verify 'Standard' is selected + // cy.findByRole('heading', {name: 'Message Display'}).click(); + // cy.findByRole('radio', { + // name: 'Standard: Easy to scan and read.', + // }).click(); + + // // * Verify Colorize usernames option doesn't exist; + // cy.findByRole('checkbox', { + // name: 'Colorize usernames: Use colors to distinguish users in compact mode', + // }).should('not.exist'); + // }); + it('MM-T4984_2 Message Display: colorize usernames option should be hidden in Compact mode', () => { + // * Verify 'Standard' is selected + cy.findByRole('heading', {name: 'Message Display'}).click(); + cy.findByRole('radio', { + name: 'Compact: Fit as many messages on the screen as we can.', + }).click(); + + // * Verify Colorize usernames option exists; + cy.findByRole('checkbox', { + name: 'Colorize usernames: Use colors to distinguish users in compact mode', + }).should('exist'); + }); +}); + +function goToMessageDisplaySetting() { + // # Go to Settings modal - Display section - Message Display + cy.uiOpenSettingsModal('Display').within(() => { + cy.get('#displayButton').click(); + cy.get('#message_displayEdit').should('be.visible'); + cy.get('#message_displayEdit').click(); + + // cy.get('#accountSettingsHeader > .close').should('be.visible'); + }); +} + +// # Open Settings > Display > Themes +// cy.uiOpenSettingsModal('Display').within(() => { +// cy.get('#displayButton').click(); +// cy.get('#displaySettingsTitle').should('exist'); +// cy.get('#themeTitle').scrollIntoView().should('be.visible'); +// cy.get('#themeEdit').click(); + +// // * Verify image alt in Theme Images +// cy.get('#displaySettings').within(() => { +// cy.get('.appearance-section>div').children().each(($el) => { +// cy.wrap($el).get('#denim-theme-icon').should('have.text', 'Denim theme icon'); +// }); +// }); +// }); From 9b39f6db439d5733cd64b8e56481c737b7272807 Mon Sep 17 00:00:00 2001 From: "Sinan Sonmez (Chaush)" <37421564+sinansonmez@users.noreply.github.com> Date: Sun, 14 Aug 2022 00:02:17 +0200 Subject: [PATCH 2/7] fix test description --- ...age_display_mode_colorize_username_spec.js | 28 +++++++++++-------- 1 file changed, 16 insertions(+), 12 deletions(-) diff --git a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js index f3ad9c6ea6d0..4c8e90b472ee 100644 --- a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js +++ b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js @@ -19,19 +19,19 @@ describe('Settings > Display > Message Display', () => { goToMessageDisplaySetting(); }); - // it('MM-T4984_1 Message Display: colorize usernames option should be hidden in Compact mode', () => { - // // * Verify 'Standard' is selected - // cy.findByRole('heading', {name: 'Message Display'}).click(); - // cy.findByRole('radio', { - // name: 'Standard: Easy to scan and read.', - // }).click(); + it('MM-T4984_1 Message Display: colorize usernames option should not exist in Compact mode', () => { + // * Verify 'Standard' is selected + cy.findByRole('heading', {name: 'Message Display'}).click(); + cy.findByRole('radio', { + name: 'Standard: Easy to scan and read.', + }).click(); - // // * Verify Colorize usernames option doesn't exist; - // cy.findByRole('checkbox', { - // name: 'Colorize usernames: Use colors to distinguish users in compact mode', - // }).should('not.exist'); - // }); - it('MM-T4984_2 Message Display: colorize usernames option should be hidden in Compact mode', () => { + // * Verify Colorize usernames option doesn't exist; + cy.findByRole('checkbox', { + name: 'Colorize usernames: Use colors to distinguish users in compact mode', + }).should('not.exist'); + }); + it('MM-T4984_2 Message Display: colorize usernames option should exist in Compact mode', () => { // * Verify 'Standard' is selected cy.findByRole('heading', {name: 'Message Display'}).click(); cy.findByRole('radio', { @@ -42,6 +42,10 @@ describe('Settings > Display > Message Display', () => { cy.findByRole('checkbox', { name: 'Colorize usernames: Use colors to distinguish users in compact mode', }).should('exist'); + + // # Save and close the modal + cy.uiSave(); + cy.uiClose(); }); }); From c9a058b5acd72bd09cbd8710dda659ce5e534811 Mon Sep 17 00:00:00 2001 From: "Sinan Sonmez (Chaush)" <37421564+sinansonmez@users.noreply.github.com> Date: Mon, 15 Aug 2022 13:59:58 +0200 Subject: [PATCH 3/7] check colors are unique --- ...age_display_mode_colorize_username_spec.js | 103 ++++++++++++++---- 1 file changed, 84 insertions(+), 19 deletions(-) diff --git a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js index 4c8e90b472ee..8d7048ae9308 100644 --- a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js +++ b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js @@ -7,30 +7,66 @@ // - Use element ID when selecting an element. Create one if none. // *************************************************************** -// Stage: @prod // Group: @account_setting -describe('Settings > Display > Message Display', () => { +describe('Settings > Display > Message Display: Colorize username', () => { + let testTeam; + let firstUser; + let otherUser; + let testChannel; + const colors = {}; + before(() => { + // # Login as new user and visit off-topic - cy.apiInitSetup({loginAfter: true}).then(({offTopicUrl}) => { - cy.visit(offTopicUrl); - }); - goToMessageDisplaySetting(); - }); + cy.apiInitSetup().then(({channel, user, team}) => { + testTeam = team; + firstUser = user; + testChannel = channel; - it('MM-T4984_1 Message Display: colorize usernames option should not exist in Compact mode', () => { - // * Verify 'Standard' is selected - cy.findByRole('heading', {name: 'Message Display'}).click(); - cy.findByRole('radio', { - name: 'Standard: Easy to scan and read.', - }).click(); + cy.apiCreateUser({prefix: 'other'}).then(({user: user1}) => { + otherUser = user1; - // * Verify Colorize usernames option doesn't exist; - cy.findByRole('checkbox', { - name: 'Colorize usernames: Use colors to distinguish users in compact mode', - }).should('not.exist'); + // # Add user to team and channel + cy.apiAddUserToTeam(testTeam.id, otherUser.id).then(() => { + cy.apiAddUserToChannel(testChannel.id, otherUser.id); + + cy.visit(`/${team.name}/channels/${testChannel.name}`); + + // # Post some messages + cy.postMessageAs({ + sender: otherUser, + message: 'Other message', + channelId: testChannel.id, + }); + cy.postMessageAs({ + sender: firstUser, + message: 'Test message', + channelId: testChannel.id, + }); + }); + }); + goToMessageDisplaySetting(); + }, + ); }); + + // it('MM-T4984_1 Message Display: colorize usernames option should not exist in Compact mode', () => { + // // * Verify 'Standard' is selected + // cy.findByRole('heading', {name: 'Message Display'}).click(); + // cy.findByRole('radio', { + // name: 'Standard: Easy to scan and read.', + // }).click(); + + // // * Verify Colorize usernames option doesn't exist; + // cy.findByRole('checkbox', { + // name: 'Colorize usernames: Use colors to distinguish users in compact mode', + // }).should('not.exist'); + + // // # Save and close the modal + // cy.uiSave(); + // cy.uiClose(); + // }); it('MM-T4984_2 Message Display: colorize usernames option should exist in Compact mode', () => { // * Verify 'Standard' is selected cy.findByRole('heading', {name: 'Message Display'}).click(); @@ -46,6 +82,37 @@ describe('Settings > Display > Message Display', () => { // # Save and close the modal cy.uiSave(); cy.uiClose(); + + cy.findByText(firstUser.username).then((elements) => { + colors[firstUser.username] = elements[0].attributes.style.value; + console.log('------------------------------'); + console.log(elements); + console.log(elements[0].attributes.style.value); + console.log('------------------------------'); + + // elements.each((index, element) => { + // if (index === 0) { + // // todo skip the first element + // } else { + // cy.wrap(element).should('have.attr', 'style', 'color: rgb(255, 0, 0)'); + + // // cy.wrap(element).should('have.css', 'color', 'rgb(63, 67, 80)'); // todo check if there is a variable for defaul color + // } + // }); + }); + cy.findByText(otherUser.username).then((elements) => { + colors[otherUser.username] = elements[0].attributes.style.value; + console.log(colors); + console.log("------------------------------"); + console.log(elements); + console.log(elements[0].attributes.style.value); + console.log("------------------------------"); + }).then(() => { + console.log(colors); + expect(colors[firstUser.username]).to.not.equal(colors[otherUser.username]); + }); + + cy.reload(); }); }); @@ -55,8 +122,6 @@ function goToMessageDisplaySetting() { cy.get('#displayButton').click(); cy.get('#message_displayEdit').should('be.visible'); cy.get('#message_displayEdit').click(); - - // cy.get('#accountSettingsHeader > .close').should('be.visible'); }); } From cfbd155edebbeb71ab7165c5b94fcf6e709ed26b Mon Sep 17 00:00:00 2001 From: "Sinan Sonmez (Chaush)" <37421564+sinansonmez@users.noreply.github.com> Date: Mon, 15 Aug 2022 14:48:00 +0200 Subject: [PATCH 4/7] improve code to make it dry --- ...age_display_mode_colorize_username_spec.js | 94 +++++++------------ 1 file changed, 35 insertions(+), 59 deletions(-) diff --git a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js index 8d7048ae9308..a8789d12264f 100644 --- a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js +++ b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js @@ -17,7 +17,6 @@ describe('Settings > Display > Message Display: Colorize username', () => { const colors = {}; before(() => { - // # Login as new user and visit off-topic cy.apiInitSetup().then(({channel, user, team}) => { testTeam = team; @@ -31,8 +30,6 @@ describe('Settings > Display > Message Display: Colorize username', () => { cy.apiAddUserToTeam(testTeam.id, otherUser.id).then(() => { cy.apiAddUserToChannel(testChannel.id, otherUser.id); - cy.visit(`/${team.name}/channels/${testChannel.name}`); - // # Post some messages cy.postMessageAs({ sender: otherUser, @@ -46,73 +43,67 @@ describe('Settings > Display > Message Display: Colorize username', () => { }); }); }); - goToMessageDisplaySetting(); }, ); }); - // it('MM-T4984_1 Message Display: colorize usernames option should not exist in Compact mode', () => { - // // * Verify 'Standard' is selected - // cy.findByRole('heading', {name: 'Message Display'}).click(); - // cy.findByRole('radio', { - // name: 'Standard: Easy to scan and read.', - // }).click(); - - // // * Verify Colorize usernames option doesn't exist; - // cy.findByRole('checkbox', { - // name: 'Colorize usernames: Use colors to distinguish users in compact mode', - // }).should('not.exist'); - - // // # Save and close the modal - // cy.uiSave(); - // cy.uiClose(); - // }); - it('MM-T4984_2 Message Display: colorize usernames option should exist in Compact mode', () => { + beforeEach(() => { + // # Visit related channel + cy.visit(`/${testTeam.name}/channels/${testChannel.name}`); + + // # Go to Settings modal - Display section - Message Display + goToMessageDisplaySetting(); + }); + + it('MM-T4984_1 Message Display: colorize usernames option should not exist in Compact mode', () => { // * Verify 'Standard' is selected cy.findByRole('heading', {name: 'Message Display'}).click(); cy.findByRole('radio', { - name: 'Compact: Fit as many messages on the screen as we can.', + name: 'Standard: Easy to scan and read.', }).click(); - // * Verify Colorize usernames option exists; + // * Verify Colorize usernames option doesn't exist; cy.findByRole('checkbox', { name: 'Colorize usernames: Use colors to distinguish users in compact mode', - }).should('exist'); + }).should('not.exist'); + + // # Save and close the modal + cy.uiSave(); + cy.uiClose(); + }); + + it('MM-T4984_2 Message Display: colorize usernames option should exist in Compact mode', () => { + // * Verify 'Standard' is selected + cy.findByRole('heading', {name: 'Message Display'}).click(); + cy.findByRole('radio', {name: 'Compact: Fit as many messages on the screen as we can.'}).click(); + + // * Verify Colorize usernames option exists + cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).should('exist'); // # Save and close the modal cy.uiSave(); cy.uiClose(); + // # Save the color of the buttons cy.findByText(firstUser.username).then((elements) => { colors[firstUser.username] = elements[0].attributes.style.value; - console.log('------------------------------'); - console.log(elements); - console.log(elements[0].attributes.style.value); - console.log('------------------------------'); - - // elements.each((index, element) => { - // if (index === 0) { - // // todo skip the first element - // } else { - // cy.wrap(element).should('have.attr', 'style', 'color: rgb(255, 0, 0)'); - - // // cy.wrap(element).should('have.css', 'color', 'rgb(63, 67, 80)'); // todo check if there is a variable for defaul color - // } - // }); }); cy.findByText(otherUser.username).then((elements) => { colors[otherUser.username] = elements[0].attributes.style.value; - console.log(colors); - console.log("------------------------------"); - console.log(elements); - console.log(elements[0].attributes.style.value); - console.log("------------------------------"); }).then(() => { - console.log(colors); + // * Verify that colors are different expect(colors[firstUser.username]).to.not.equal(colors[otherUser.username]); }); cy.reload(); + + // * Verify that after reload colors are the same + cy.findByText(firstUser.username).then((elements) => { + cy.wrap(elements[0]).should('have.attr', 'style', colors[firstUser.username]); + }); + cy.findByText(otherUser.username).then((elements) => { + cy.wrap(elements[0]).should('have.attr', 'style', colors[otherUser.username]); + }); }); }); @@ -124,18 +115,3 @@ function goToMessageDisplaySetting() { cy.get('#message_displayEdit').click(); }); } - -// # Open Settings > Display > Themes -// cy.uiOpenSettingsModal('Display').within(() => { -// cy.get('#displayButton').click(); -// cy.get('#displaySettingsTitle').should('exist'); -// cy.get('#themeTitle').scrollIntoView().should('be.visible'); -// cy.get('#themeEdit').click(); - -// // * Verify image alt in Theme Images -// cy.get('#displaySettings').within(() => { -// cy.get('.appearance-section>div').children().each(($el) => { -// cy.wrap($el).get('#denim-theme-icon').should('have.text', 'Denim theme icon'); -// }); -// }); -// }); From 0831ca32bc046611f72b2e5d65a5acb9cdd71bff Mon Sep 17 00:00:00 2001 From: "Sinan Sonmez (Chaush)" <37421564+sinansonmez@users.noreply.github.com> Date: Mon, 15 Aug 2022 22:52:17 +0200 Subject: [PATCH 5/7] colors should be reverted to normal --- ...age_display_mode_colorize_username_spec.js | 29 +++++++++++++++++-- 1 file changed, 26 insertions(+), 3 deletions(-) diff --git a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js index a8789d12264f..b88c697197d8 100644 --- a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js +++ b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js @@ -72,13 +72,14 @@ describe('Settings > Display > Message Display: Colorize username', () => { cy.uiClose(); }); - it('MM-T4984_2 Message Display: colorize usernames option should exist in Compact mode', () => { - // * Verify 'Standard' is selected + it('MM-T4984_2 Message Display: colorize usernames option should exist in Compact mode and function as expected', () => { + // # Select 'Compact' option cy.findByRole('heading', {name: 'Message Display'}).click(); cy.findByRole('radio', {name: 'Compact: Fit as many messages on the screen as we can.'}).click(); - // * Verify Colorize usernames option exists + // * Verify Colorize usernames option exists and checked by default cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).should('exist'); + cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).should('be.checked'); // # Save and close the modal cy.uiSave(); @@ -105,6 +106,28 @@ describe('Settings > Display > Message Display: Colorize username', () => { cy.wrap(elements[0]).should('have.attr', 'style', colors[otherUser.username]); }); }); + + it('MM-T4984_3 Message Display: disabling colorize should revert to colors to normal color', () => { + // # Select 'Compact' option + cy.findByRole('heading', {name: 'Message Display'}).click(); + cy.findByRole('radio', {name: 'Compact: Fit as many messages on the screen as we can.'}).click(); + + // # Verify Colorize usernames option exists and make it unchecked + cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).should('exist'); + cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).uncheck().should('not.be.checked'); + + // # Save and close the modal + cy.uiSave(); + cy.uiClose(); + + // * Verify that colors are reverted to normal + cy.findByText(firstUser.username).then((elements) => { + cy.wrap(elements[0]).should('have.css', 'color', 'rgb(63, 67, 80)'); + }); + cy.findByText(otherUser.username).then((elements) => { + cy.wrap(elements[0]).should('have.css', 'color', 'rgb(63, 67, 80)'); + }); + }); }); function goToMessageDisplaySetting() { From 7eddccf74997c66c1be9054cac6067109a82c0a5 Mon Sep 17 00:00:00 2001 From: "Sinan Sonmez (Chaush)" <37421564+sinansonmez@users.noreply.github.com> Date: Tue, 16 Aug 2022 22:40:39 +0200 Subject: [PATCH 6/7] address comments --- ...age_display_mode_colorize_username_spec.js | 34 +++++++++---------- 1 file changed, 16 insertions(+), 18 deletions(-) diff --git a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js index b88c697197d8..437331f00a2e 100644 --- a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js +++ b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js @@ -50,17 +50,14 @@ describe('Settings > Display > Message Display: Colorize username', () => { beforeEach(() => { // # Visit related channel cy.visit(`/${testTeam.name}/channels/${testChannel.name}`); - - // # Go to Settings modal - Display section - Message Display - goToMessageDisplaySetting(); }); it('MM-T4984_1 Message Display: colorize usernames option should not exist in Compact mode', () => { - // * Verify 'Standard' is selected - cy.findByRole('heading', {name: 'Message Display'}).click(); - cy.findByRole('radio', { - name: 'Standard: Easy to scan and read.', - }).click(); + // # Select 'Standard' option + cy.uiChangeMessageDisplaySetting(); + + // # Go to Settings modal - Display section - Message Display + goToMessageDisplaySetting(); // * Verify Colorize usernames option doesn't exist; cy.findByRole('checkbox', { @@ -68,22 +65,22 @@ describe('Settings > Display > Message Display: Colorize username', () => { }).should('not.exist'); // # Save and close the modal - cy.uiSave(); - cy.uiClose(); + cy.uiSaveAndClose(); }); it('MM-T4984_2 Message Display: colorize usernames option should exist in Compact mode and function as expected', () => { // # Select 'Compact' option - cy.findByRole('heading', {name: 'Message Display'}).click(); - cy.findByRole('radio', {name: 'Compact: Fit as many messages on the screen as we can.'}).click(); + cy.uiChangeMessageDisplaySetting('COMPACT'); + + // # Go to Settings modal - Display section - Message Display + goToMessageDisplaySetting(); // * Verify Colorize usernames option exists and checked by default cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).should('exist'); cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).should('be.checked'); // # Save and close the modal - cy.uiSave(); - cy.uiClose(); + cy.uiSaveAndClose(); // # Save the color of the buttons cy.findByText(firstUser.username).then((elements) => { @@ -109,16 +106,17 @@ describe('Settings > Display > Message Display: Colorize username', () => { it('MM-T4984_3 Message Display: disabling colorize should revert to colors to normal color', () => { // # Select 'Compact' option - cy.findByRole('heading', {name: 'Message Display'}).click(); - cy.findByRole('radio', {name: 'Compact: Fit as many messages on the screen as we can.'}).click(); + cy.uiChangeMessageDisplaySetting('COMPACT'); + + // # Go to Settings modal - Display section - Message Display + goToMessageDisplaySetting(); // # Verify Colorize usernames option exists and make it unchecked cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).should('exist'); cy.findByRole('checkbox', {name: 'Colorize usernames: Use colors to distinguish users in compact mode'}).uncheck().should('not.be.checked'); // # Save and close the modal - cy.uiSave(); - cy.uiClose(); + cy.uiSaveAndClose(); // * Verify that colors are reverted to normal cy.findByText(firstUser.username).then((elements) => { From c7eea2b66d45925b2241aa2c3aee227f458b3719 Mon Sep 17 00:00:00 2001 From: "Sinan Sonmez (Chaush)" <37421564+sinansonmez@users.noreply.github.com> Date: Sat, 20 Aug 2022 14:14:42 +0200 Subject: [PATCH 7/7] replace hard coded colors --- .../message_display_mode_colorize_username_spec.js | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js index 437331f00a2e..ad11e273b9c9 100644 --- a/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js +++ b/e2e/cypress/tests/integration/settings/display/message_display_mode_colorize_username_spec.js @@ -15,6 +15,7 @@ describe('Settings > Display > Message Display: Colorize username', () => { let otherUser; let testChannel; const colors = {}; + let defaultTextColor = ''; before(() => { // # Login as new user and visit off-topic @@ -56,6 +57,13 @@ describe('Settings > Display > Message Display: Colorize username', () => { // # Select 'Standard' option cy.uiChangeMessageDisplaySetting(); + // # Set the default text color + cy.findByText(firstUser.username).then((elements) => { + cy.window().then((win) => { + defaultTextColor = win.getComputedStyle(elements[0]).color; + }); + }); + // # Go to Settings modal - Display section - Message Display goToMessageDisplaySetting(); @@ -120,10 +128,10 @@ describe('Settings > Display > Message Display: Colorize username', () => { // * Verify that colors are reverted to normal cy.findByText(firstUser.username).then((elements) => { - cy.wrap(elements[0]).should('have.css', 'color', 'rgb(63, 67, 80)'); + cy.wrap(elements[0]).should('have.css', 'color', defaultTextColor); }); cy.findByText(otherUser.username).then((elements) => { - cy.wrap(elements[0]).should('have.css', 'color', 'rgb(63, 67, 80)'); + cy.wrap(elements[0]).should('have.css', 'color', defaultTextColor); }); }); });