Unverified Commit f2161612 authored by Joseph Baylon's avatar Joseph Baylon Committed by GitHub
Browse files

MM-26074 Cypress Test for MM-T301 - Timezone Display mode (#5871)

* MM-26074 Cypress Test for MM-T301 - Timezone Display mode

* Fix lint issues

* Simplify timezone desc verification

* Explicitly add moment-timezone to package.json

* Updated minute format
parent 5db6b583
......@@ -91,11 +91,20 @@ function setClockDisplayTo(clockFormat) {
// # Navigate to Clock Display Settings
navigateToClockDisplaySettings();
// # Click the radio button
cy.get(`#${clockFormat}`).should('be.visible').click({force: true});
// # Click the radio button and verify checked
cy.get(`#${clockFormat}`).should('be.visible').click({force: true}).should('be.checked');
// # Click Save button and close Account Settings modal
// # Click Save button
cy.get('#saveSetting').should('be.visible').click();
// * Verify clock description
if (clockFormat === 'clockFormatA') {
cy.get('#clockDesc').should('have.text', '12-hour clock (example: 4:00 PM)');
} else {
cy.get('#clockDesc').should('have.text', '24-hour clock (example: 16:00)');
}
// # Close Account Settings modal
cy.get('#accountSettingsHeader > .close').should('be.visible').click();
}
......
// 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.
// ***************************************************************
// Group: @account_setting
import moment from 'moment-timezone';
import {getAdminAccount} from '../../../support/env';
import * as TIMEOUTS from '../../../fixtures/timeouts';
describe('Account Settings > Display > Timezone Mode', () => {
const sysadmin = getAdminAccount();
const date1 = Date.UTC(2020, 0, 5, 4, 30); // Jan 5, 2020 04:30
const date2 = Date.UTC(2020, 0, 5, 12, 30); // Jan 5, 2020 12:30
const date3 = Date.UTC(2020, 0, 5, 20, 30); // Jan 5, 2020 20:30
const date4 = Date.UTC(2020, 0, 6, 0, 30); // Jan 6, 2020 00:30
const timezoneLocal = {type: 'Canonical', actualValue: moment.tz.guess(), expectedValue: moment.tz.guess()};
const timezoneCanonical = {type: 'Canonical', actualValue: 'Asia/Hong_Kong', expectedValue: 'Asia/Hong_Kong'};
const timezoneUTC = {type: 'Default', actualValue: 'UTC', expectedValue: 'UTC'};
const timezoneInvalid = {type: 'Invalid', actualValue: 'NZ-Chat', expectedValue: 'UTC'};
const timeFormat = 'h:mm A';
const utcFormattedTimes = [
moment(date1).tz(timezoneUTC.expectedValue).format(timeFormat),
moment(date2).tz(timezoneUTC.expectedValue).format(timeFormat),
moment(date3).tz(timezoneUTC.expectedValue).format(timeFormat),
moment(date4).tz(timezoneUTC.expectedValue).format(timeFormat),
];
before(() => {
// # Enable Timezone
cy.apiUpdateConfig({
DisplaySettings: {
ExperimentalTimezone: true,
},
});
// # Reset timezone
resetTimezone();
// # Create and visit new channel
cy.apiInitSetup({loginAfter: true}).then(({team, channel}) => {
cy.visit(`/${team.name}/channels/${channel.name}`);
// # Post messages from the past
[date1, date2, date3, date4].forEach((createAt, index) => {
cy.postMessageAs({sender: sysadmin, message: `Hello from ${index}`, channelId: channel.id, createAt});
});
// # Post messages from now
cy.postMessage('Hello from now');
// # Reload to re-arrange posts
cy.reload();
});
});
after(() => {
// # Reset timezone
resetTimezone();
});
describe('MM-T301 Change timezone automatically', () => {
const automaticTestCases = [
{
timezone: timezoneLocal,
localTimes: [
{postIndex: 0, formattedTime: moment(date1).tz(timezoneLocal.expectedValue).format(timeFormat)},
{postIndex: 1, formattedTime: moment(date2).tz(timezoneLocal.expectedValue).format(timeFormat)},
{postIndex: 2, formattedTime: moment(date3).tz(timezoneLocal.expectedValue).format(timeFormat)},
{postIndex: 3, formattedTime: moment(date4).tz(timezoneLocal.expectedValue).format(timeFormat)},
],
},
];
automaticTestCases.forEach((testCase) => {
describe('Type: ' + testCase.timezone.type + ', Actual: ' + testCase.timezone.actualValue + ', Expected: ' + testCase.timezone.expectedValue, () => {
before(() => {
// # Set timezone display to automatic
setTimezoneDisplayToAutomatic(testCase.timezone);
});
testCase.localTimes.forEach((localTime) => {
it('Post: ' + localTime.postIndex + ', UTC: ' + utcFormattedTimes[localTime.postIndex] + ', New: ' + localTime.formattedTime, () => {
// * Verify local time is timezone formatted
verifyLocalTimeIsTimezoneFormatted(localTime);
});
});
});
});
});
describe('MM-T301 Change timezone manually', () => {
const manualTestCases = [
{
timezone: timezoneCanonical,
localTimes: [
{postIndex: 0, formattedTime: moment(date1).tz(timezoneCanonical.expectedValue).format(timeFormat)},
{postIndex: 1, formattedTime: moment(date2).tz(timezoneCanonical.expectedValue).format(timeFormat)},
{postIndex: 2, formattedTime: moment(date3).tz(timezoneCanonical.expectedValue).format(timeFormat)},
{postIndex: 3, formattedTime: moment(date4).tz(timezoneCanonical.expectedValue).format(timeFormat)},
],
},
{
timezone: timezoneUTC,
localTimes: [
{postIndex: 0, formattedTime: moment(date1).tz(timezoneUTC.expectedValue).format(timeFormat)},
{postIndex: 1, formattedTime: moment(date2).tz(timezoneUTC.expectedValue).format(timeFormat)},
{postIndex: 2, formattedTime: moment(date3).tz(timezoneUTC.expectedValue).format(timeFormat)},
{postIndex: 3, formattedTime: moment(date4).tz(timezoneUTC.expectedValue).format(timeFormat)},
],
},
{
timezone: timezoneInvalid,
localTimes: [
{postIndex: 0, formattedTime: moment(date1).tz(timezoneInvalid.expectedValue).format(timeFormat)},
{postIndex: 1, formattedTime: moment(date2).tz(timezoneInvalid.expectedValue).format(timeFormat)},
{postIndex: 2, formattedTime: moment(date3).tz(timezoneInvalid.expectedValue).format(timeFormat)},
{postIndex: 3, formattedTime: moment(date4).tz(timezoneInvalid.expectedValue).format(timeFormat)},
],
},
];
manualTestCases.forEach((testCase) => {
describe('Type: ' + testCase.timezone.type + ', Actual: ' + testCase.timezone.actualValue + ', Expected: ' + testCase.timezone.expectedValue, () => {
before(() => {
// # Set timezone display to manual
setTimezoneDisplayToManual(testCase.timezone);
});
testCase.localTimes.forEach((localTime) => {
it('Post: ' + localTime.postIndex + ', UTC: ' + utcFormattedTimes[localTime.postIndex] + ', New: ' + localTime.formattedTime, () => {
// * Verify local time is timezone formatted
verifyLocalTimeIsTimezoneFormatted(localTime);
});
});
});
});
});
});
function resetTimezone() {
cy.apiPatchMe({
locale: 'en',
timezone: {automaticTimezone: '', manualTimezone: 'UTC', useAutomaticTimezone: 'false'},
});
}
function navigateToTimezoneDisplaySettings() {
// # Go to Account Settings
cy.toAccountSettingsModal();
// # Click the display tab
cy.get('#displayButton').should('be.visible').click();
// # Click "Edit" to the right of "Timezone"
cy.get('#timezoneEdit').should('be.visible').click();
// # Scroll a bit to show the "Save" button
cy.get('.section-max').should('be.visible').scrollIntoView();
}
function setTimezoneDisplayTo(isAutomatic, timezone) {
const actualTimezoneValue = timezone.actualValue;
const expectedTimezoneValue = timezone.expectedValue;
// # Navigate to Timezone Display Settings
navigateToTimezoneDisplaySettings();
cy.get('.setting-list-item').within(() => {
// # Uncheck the automatic timezone checkbox and verify unchecked
cy.get('#automaticTimezoneInput').should('be.visible').uncheck().should('be.not.checked');
// * Verify Change timezone exists
cy.findByText('Change timezone').should('exist');
if (isAutomatic) {
// # Check automatic timezone checkbox and verify checked
cy.get('#automaticTimezoneInput').check().should('be.checked');
// * Verify timezone text is visible
cy.get('.section-describe').should('be.visible').invoke('text').then((timezoneDesc) => {
expect(expectedTimezoneValue.replace('_', ' ')).to.contain(timezoneDesc);
});
// * Verify Change timezone does not exist
cy.findByText('Change timezone').should('not.exist');
} else {
// # Manually type new timezone
cy.get('input[type="search"]').should('be.visible').clear().type(actualTimezoneValue);
// # Click on suggestion if exists
if (timezone.type === 'Invalid') {
cy.get('#suggestionList').should('not.exist');
} else if (actualTimezoneValue) {
cy.get('#suggestionList').findByText(expectedTimezoneValue).should('exist').click();
}
}
});
// # Click Save button
cy.get('#saveSetting').should('be.visible').click();
// * Verify timezone description is correct
cy.get('#timezoneDesc').should('be.visible').invoke('text').then((timezoneDesc) => {
expect(expectedTimezoneValue.replace('_', ' ')).to.contain(timezoneDesc);
});
// # Close Account Settings modal
cy.get('#accountSettingsHeader > .close').should('be.visible').click();
}
function setTimezoneDisplayToAutomatic(timezone) {
setTimezoneDisplayTo(true, timezone);
}
function setTimezoneDisplayToManual(timezone) {
setTimezoneDisplayTo(false, timezone);
}
function verifyLocalTimeIsTimezoneFormatted(localTime) {
// * Verify that the local time of each post is in timezone format
cy.findAllByTestId('postView').eq(localTime.postIndex).find('time', {timeout: TIMEOUTS.HALF_SEC}).should('have.text', localTime.formattedTime);
}
......@@ -4039,6 +4039,15 @@
"combined-stream": "^1.0.6",
"mime-types": "^2.1.12"
}
},
"moment-timezone": {
"version": "0.5.26",
"resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.26.tgz",
"integrity": "sha512-sFP4cgEKTCymBBKgoxZjYzlSovC20Y6J7y3nanDc5RoBIXKlZhoYwBoZGe3flwU6A372AcRwScH8KiwV6zjy1g==",
"dev": true,
"requires": {
"moment": ">= 2.9.0"
}
}
}
},
......@@ -4717,9 +4726,9 @@
"dev": true
},
"moment-timezone": {
"version": "0.5.26",
"resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.26.tgz",
"integrity": "sha512-sFP4cgEKTCymBBKgoxZjYzlSovC20Y6J7y3nanDc5RoBIXKlZhoYwBoZGe3flwU6A372AcRwScH8KiwV6zjy1g==",
"version": "0.5.31",
"resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.31.tgz",
"integrity": "sha512-+GgHNg8xRhMXfEbv81iDtrVeTcWt0kWmTEY1XQK14dICTXnWJnT0dxdlPspwqF3keKMVPXwayEsk1DI0AA/jdA==",
"dev": true,
"requires": {
"moment": ">= 2.9.0"
......
......@@ -27,6 +27,7 @@
"mochawesome": "6.1.1",
"mochawesome-merge": "4.1.0",
"mochawesome-report-generator": "5.1.0",
"moment-timezone": "0.5.31",
"mysql": "2.18.1",
"path": "0.12.7",
"pg": "8.2.1",
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment