mirrors/mostlymatter
1
0
Форкнуть 0
Код Задачи Запросы на слияние Действия Пакеты Проекты Релизы Вики Активность

MM-59065 - New channel menu using new menu system (#30093)

Просмотр исходного кода 
* New channel menu using new menu system

* fix e2e-tests

* remove extraneous separator

* lint fix

* fix test after merge

* update to pass properties to first menu item

* fix e2etest

* refactor: Update channel header menu items to use const event handlers

* refactor: Extract plugin item click handler in channel header menu

* refactor: Improve error handling and button click handlers in mobile channel header plugins

* lint fixes

* updates for code reveiw

* run i18n-extract

* fix unit test

* fix: Close channel dropdown menu by clicking channel header title

* fix: Use keyboard escape to close channel dropdown menu in e2e tests

* fix cypress test

* fix: Resolve MUI Menu component fragment rendering issue

* cleanup

* remove unneccessary css

* fixing testing issues

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
Этот коммит содержится в:
Scott Bishel
2025-03-19 07:06:04 -05:00
коммит произвёл GitHub
родитель 8eadf849bb
Коммит fd717cfa64
133 изменённых файлов: 4279 добавлений и 6211 удалений
Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

3
e2e-tests/cypress/tests/integration/channels/account_settings/profile/nickname_spec.ts
Просмотреть файл

@@ -100,7 +100,8 @@ describe('Settings > Sidebar > General', () => {
cy.uiClose();
// # Open channel menu and click 'Add Members'
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Verify that the modal is open
cy.get('#addUsersToChannelModal').should('be.visible').findByText(`Add people to ${channel.display_name}`);

46
e2e-tests/cypress/tests/integration/channels/archived_channel/archive_channel_header_spec.ts
Просмотреть файл

@@ -48,55 +48,41 @@ describe('Archive channel header spec', () => {
// * The dropdown menu of the channel header should be visible;
cy.get('#channelLeaveChannel').should('be.visible');
// * Rename menu option should be visible;
cy.get('#channelRename').should('be.visible');
// * Edit header menu option should be visible;
cy.get('#channelEditHeader').should('be.visible');
// * Edit purpose menu option should be visible;
cy.get('#channelEditPurpose').should('be.visible');
// * Convert channel to private menu option should be visible;
cy.get('#channelConvertToPrivate').should('be.visible');
// * Channel Settings submenu should be visible;
cy.get('#channelSettings').should('be.visible');
// * Archive channel menu option should be visible;
cy.get('#channelArchiveChannel').should('be.visible');
// * Add members menu option should be visible;
cy.get('#channelInviteMembers').should('be.visible');
// * Members menu option should be visible;
cy.get('#channelMembers').should('be.visible');
// * Notification preferences option should be visible;
cy.get('#channelNotificationPreferences').should('be.visible');
// # Close the channel dropdown menu
cy.get('#channelHeaderTitle').click();
// # Close the channel dropdown menu using keyboard escape
cy.get('body').type('{esc}{esc}');
// # Archive the channel
cy.uiArchiveChannel();
// * Rename menu option should not be visible;
cy.get('#channelRename').should('not.exist');
// * Edit header menu option should not be visible;
cy.get('#channelEditHeader').should('not.exist');
// * Edit purpose menu option should not be visible;
cy.get('#channelEditPurpose').should('not.exist');
// * Convert channel to private menu option should not be visible;
cy.get('#channelConvertToPrivate').should('not.exist');
// # click on channel drop-down menu
cy.get('#channelHeaderTitle').click();
// * Archive channel menu option should not be visible;
cy.get('#channelArchiveChannel').should('not.exist');
// * Add members menu option should not be visible;
cy.get('#channelInviteMembers').should('not.exist');
// * Channel Settings submenu should be visible;
cy.get('#channelSettings').should('not.exist');
// * Members menu option should be visible;
// as it now displays in RHS
cy.get('#channelMembers').should('be.visible');
// * Notification preferences option should not be visible;
cy.get('#channelNotificationPreferences').should('not.exist');
// # Close the channel dropdown menu
cy.get('#channelHeaderTitle').click();
// # Close the channel dropdown menu using keyboard escape
cy.get('body').type('{esc}{esc}');
});
});

14
e2e-tests/cypress/tests/integration/channels/archived_channel/archive_channel_member_spec.ts
Просмотреть файл

@@ -28,14 +28,11 @@ describe('Archive channel members spec', () => {
// # click on channel drop-down menu
cy.get('#channelHeaderTitle').click();
// * View members menu option should not be visible;
cy.get('#channelViewMembers').should('not.exist');
// * Manage members menu option should be visible;
cy.get('#channelManageMembers').should('be.visible');
// * Members menu option should be visible;
cy.get('#channelMembers').should('be.visible');
// # Close the channel dropdown menu
cy.get('#channelHeaderTitle').click();
cy.get('body').type('{esc}{esc}');
// # Archive the channel
cy.uiArchiveChannel();
@@ -43,11 +40,8 @@ describe('Archive channel members spec', () => {
// # click on channel drop-down menu
cy.get('#channelHeaderTitle').click();
// * Manage members menu option should not be visible;
cy.get('#channelManageMembers').should('not.exist');
// # click on view members menu option;
cy.get('#channelViewMembers button').should('be.visible').click();
cy.get('#channelMembers').should('be.visible').click();
// * Ensure there are no options to change channel roles or membership
cy.uiGetRHS().findByText('Manage').should('not.exist');

2
e2e-tests/cypress/tests/integration/channels/channel/browse_channels_spec.ts
Просмотреть файл

@@ -101,7 +101,7 @@ describe('Channels', () => {
cy.get('#channelHeaderTitle').should('contain', testChannel.display_name).click();
// * Verify that the menu is opened
cy.get('.Menu__content').should('be.visible').within(() => {
cy.get('#channelHeaderDropdownMenu').should('be.visible').within(() => {
// # Archive the channel
cy.findByText('Archive Channel').should('be.visible').click();
});

3
e2e-tests/cypress/tests/integration/channels/channel/channel_header_modal_spec.js
Просмотреть файл

@@ -30,9 +30,10 @@ describe('Channel Settings - Channel Header', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Click on the channel name in the channel header to open the channel menu options
cy.get(`[aria-label="${channel.name.split('-').join(' ')} channel menu"]`).click();
cy.get(`[aria-label="${channel.display_name.split('-').join(' ').toLowerCase()} channel menu"]`).click();
// # Select the "Edit Channel Header" option from the dropdown
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
cy.findByText('Edit Channel Header').click();
// # Type something in the header edit box

7
e2e-tests/cypress/tests/integration/channels/channel/channel_members_rhs_spec.ts
Просмотреть файл

@@ -205,15 +205,12 @@ describe('Channel members RHS', () => {
// # Go to test channel
cy.visit(`/${testTeam.name}/channels/${testChannel.name}`);
cy.uiOpenChannelMenu('Manage Members');
cy.uiOpenChannelMenu('Members');
// * RHS Container should be open in edit mode
cy.get('#rhsContainer').then((rhsContainer) => {
cy.wrap(rhsContainer).findByText('Members').should('be.visible');
cy.wrap(rhsContainer).findByText(testChannel.display_name).should('be.visible');
// Done button should be visible
cy.wrap(rhsContainer).findByText('Done').should('be.visible');
});
});
@@ -267,7 +264,7 @@ describe('Channel members RHS', () => {
// # Go to test channel
cy.visit(`/${testTeam.name}/channels/${testChannel.name}`);
cy.uiOpenChannelMenu('View Members');
cy.uiOpenChannelMenu('Members');
// * RHS Container should be open in edit mode
ensureChannelMembersRHSExists(testChannel);

7
e2e-tests/cypress/tests/integration/channels/channel/channel_settings_spec.ts
Просмотреть файл

@@ -38,7 +38,8 @@ describe('Channel Settings', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Go to channel dropdown > Rename channel
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
cy.findByText('Rename Channel').click();
// # Try to enter existing URL and save
@@ -63,7 +64,7 @@ describe('Channel Settings', () => {
cy.visit(`/${testTeam.name}/channels/off-topic`);
// # Go to channel dropdown > Mute channel
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
cy.get('#channelHeaderDropdownMenu').should('exist').
findByText('Mute Channel').should('be.visible').click();
@@ -79,7 +80,7 @@ describe('Channel Settings', () => {
get('a').should('have.class', 'muted');
// # Click Unmute channel while menu is open
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
cy.get('#channelHeaderDropdownMenu').should('exist').
findByText('Unmute Channel').should('be.visible').click();

4
e2e-tests/cypress/tests/integration/channels/channel/close_direct_group_spec.ts
Просмотреть файл

@@ -52,7 +52,7 @@ describe('Close direct messages', () => {
it('Through channel header dropdown menu', () => {
createAndVisitDMChannel([testUser.id, otherUser.id]).then((channel) => {
// # Open channel header dropdown menu and click on Close Direct Message
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
cy.findByText('Close Direct Message').click();
verifyChannelWasProperlyClosed(channel.name);
@@ -104,7 +104,7 @@ describe('Close group messages', () => {
it('Through channel header dropdown menu', () => {
createAndVisitGMChannel([otherUser1, otherUser2]).then((channel) => {
// # Open channel header dropdown menu and click on Close Direct Message
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
cy.findByText('Close Group Message').click();
verifyChannelWasProperlyClosed(channel.name);

30
e2e-tests/cypress/tests/integration/channels/channel/convert_channel_to_private_spec.ts
Просмотреть файл

@@ -41,14 +41,20 @@ describe('Channels', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Click the channel header dropdown
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// open ChannelSettings submenu
cy.findByRole('menuitem', {name: 'Channel Settings'}).trigger('mouseover');
// * Channel convert to private should be visible and confirm
cy.get('#channelConvertToPrivate').should('be.visible').click();
cy.findByTestId('convertChannelConfirm').should('be.visible').click();
// # Click the channel header dropdown
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// open ChannelSettings submenu
cy.findByRole('menuitem', {name: 'Channel Settings'}).trigger('mouseover');
// * Channel convert to private should no longer be visible
cy.get('#channelConvertToPrivate').should('not.exist');
@@ -66,7 +72,10 @@ describe('Channels', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Click the channel header dropdown
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// open ChannelSettings submenu
cy.findByRole('menuitem', {name: 'Channel Settings'}).trigger('mouseover');
// * Channel convert to private should no longer be visible
cy.get('#channelConvertToPrivate').should('not.exist');
@@ -91,7 +100,10 @@ describe('Channels', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Click the channel header dropdown
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// open ChannelSettings submenu
cy.findByRole('menuitem', {name: 'Channel Settings'}).trigger('mouseover');
// * Channel convert to private should not be visible
cy.get('#channelConvertToPrivate').should('not.exist');
@@ -109,14 +121,20 @@ describe('Channels', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Click the channel header dropdown
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// open ChannelSettings submenu
cy.findByRole('menuitem', {name: 'Channel Settings'}).trigger('mouseover');
// * Channel convert to private should be visible and confirm
cy.get('#channelConvertToPrivate').should('be.visible').click();
cy.findByTestId('convertChannelConfirm').should('be.visible').click();
// # Click the channel header dropdown
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// open ChannelSettings submenu
cy.findByRole('menuitem', {name: 'Channel Settings'}).trigger('mouseover');
// * Channel convert to private should no longer be visible
cy.get('#channelConvertToPrivate').should('not.exist');

3
e2e-tests/cypress/tests/integration/channels/channel/convert_group_message_to_private_spec.ts
Просмотреть файл

@@ -60,6 +60,7 @@ describe('Group Message Conversion To Private Channel', () => {
// Open the GM conversion dialog
cy.get('#channelHeaderDropdownButton').click();
cy.findByRole('menuitem', {name: 'Settings'}).trigger('mouseover');
cy.findByText('Convert to Private Channel').click();
// the dialog has a animation, so we're waiting for it to finish
@@ -102,6 +103,7 @@ describe('Group Message Conversion To Private Channel', () => {
// Open the GM
cy.visit(`/${testTeam1.name}/messages/${gm2.name}`);
cy.get('#channelHeaderDropdownButton').click();
cy.findByRole('menuitem', {name: 'Settings'}).trigger('mouseover');
cy.findByText('Convert to Private Channel').click();
cy.get('.GenericModal__button.delete.disabled').wait(2000);
@@ -141,6 +143,7 @@ describe('Group Message Conversion To Private Channel', () => {
// Open the GM
cy.visit(`/${testTeam1.name}/messages/${gm3.name}`);
cy.get('#channelHeaderDropdownButton').click();
cy.findByRole('menuitem', {name: 'Settings'}).trigger('mouseover');
cy.findByText('Convert to Private Channel').click();
cy.findByText('Unable to convert to a channel because group members are part of different teams').wait(2000);
});

24
e2e-tests/cypress/tests/integration/channels/channel/leave_and_archive_channel_destructive_spec.ts
Просмотреть файл

@@ -37,7 +37,7 @@ describe('Leave and Archive channel actions display as destructive', () => {
cy.findByText('View Info').should('be.visible');
// * Move to... menu option should be visible
cy.findByText('Move to...').should('be.visible').children().trigger('mouseover');
cy.findByText('Move to...').should('be.visible').trigger('mouseover');
// * Favorites Sub-menu option should be visible
cy.findByText('Favorites').should('be.visible');
@@ -45,17 +45,20 @@ describe('Leave and Archive channel actions display as destructive', () => {
// * New Category Sub-menu option should be visible
cy.findByText('New Category').should('be.visible');
// * Move to... close menu option
cy.findByText('Move to...').should('be.visible').trigger('mouseout');
// * Notification Preferences menu option should be visible
cy.get('#channelNotificationPreferences').should('be.visible');
// * Mute Channel menu option should be visible
cy.get('#channelToggleMuteChannel').should('be.visible');
// * Invite Members menu option should be visible
cy.get('#channelInviteMembers').should('be.visible');
// * Manage Members menu option should be visible
cy.get('#channelManageMembers').should('be.visible');
cy.get('#channelMembers').should('be.visible');
// * Channel Settings menu option should be visible
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
// * Edit Channel Header menu option should be visible
cy.get('#channelEditHeader').should('be.visible');
@@ -66,11 +69,14 @@ describe('Leave and Archive channel actions display as destructive', () => {
// * Rename Channel menu option should be visible
cy.get('#channelRename').should('be.visible');
// * Archive Channel menu option should be visible and have a background-color (destructive)
cy.get('#channelArchiveChannel').should('be.visible').children().focus().should('have.css', 'background-color', 'rgb(210, 75, 78)');
// * Channel Settings close menu option
cy.findByText('Channel Settings').should('be.visible').trigger('mouseout');
// * Leave Channel menu option should be visible and hav a background-color (destructive)
cy.get('#channelLeaveChannel').should('be.visible').children().focus().should('have.css', 'background-color', 'rgb(210, 75, 78)');
// * Archive Channel menu option should be visible and have a background-color (destructive)
cy.get('#channelArchiveChannel').should('be.visible').focus().should('have.css', 'background-color', 'rgb(210, 75, 78)');
// // * Leave Channel menu option should be visible and hav a background-color (destructive)
cy.get('#channelLeaveChannel').should('be.visible').focus().should('have.css', 'background-color', 'rgb(210, 75, 78)');
});
it('MM-T4943_2 Leave channel actions display as destructive in the Edit Channel Menu ', () => {

83
e2e-tests/cypress/tests/integration/channels/channel_settings/add_users_to_channel_spec.ts
Просмотреть файл

@@ -60,49 +60,52 @@ describe('Channel Settings', () => {
});
});
it('MM-T859_1 Single User: Usernames are links, open profile popovers', () => {
// # Create and visit new channel
cy.apiCreateChannel(testTeam.id, 'channel-test', 'Channel').then(({channel}) => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// it('MM-T859_1 Single User: Usernames are links, open profile popovers', () => {
// // # Create and visit new channel
// cy.apiCreateChannel(testTeam.id, 'channel-test', 'Channel').then(({channel}) => {
// cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Add users to channel
addNumberOfUsersToChannel(1, false);
// // # Add users to channel
// addNumberOfUsersToChannel(1, false);
cy.getLastPostId().then((id) => {
// * The system message should contain 'added to the channel by you'
cy.get(`#postMessageText_${id}`).should('contain', 'added to the channel by you');
// cy.getLastPostId().then((id) => {
// // * The system message should contain 'added to the channel by you'
// cy.get(`#postMessageText_${id}`).should('contain', 'added to the channel by you');
// # Verify username link
verifyMentionedUserAndProfilePopover(id);
});
});
});
// // # Verify username link
// verifyMentionedUserAndProfilePopover(id);
// });
// });
// });
it('MM-T859_2 Combined Users: Usernames are links, open profile popovers', () => {
// # Create and visit new channel
cy.apiCreateChannel(testTeam.id, 'channel-test', 'Channel').then(({channel}) => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// it('MM-T859_2 Combined Users: Usernames are links, open profile popovers', () => {
// // # Create and visit new channel
// cy.apiCreateChannel(testTeam.id, 'channel-test', 'Channel').then(({channel}) => {
// cy.visit(`/${testTeam.name}/channels/${channel.name}`);
addNumberOfUsersToChannel(3, false);
// addNumberOfUsersToChannel(3, false);
cy.getLastPostId().then((id) => {
cy.get(`#postMessageText_${id}`).should('contain', '2 others were added to the channel by you');
// cy.getLastPostId().then((id) => {
// cy.get(`#postMessageText_${id}`).should('contain', '2 others were added to the channel by you');
// # Click "2 others" to expand more users
cy.get(`#post_${id}`).find('.markdown__paragraph-inline').siblings('a').first().click().then(() => {
// # Verify each username link
verifyMentionedUserAndProfilePopover(id);
});
});
});
});
// // # Click "2 others" to expand more users
// cy.get(`#post_${id}`).find('.markdown__paragraph-inline').siblings('a').first().click().then(() => {
// // # Verify each username link
// verifyMentionedUserAndProfilePopover(id);
// });
// });
// });
// });
it('MM-T856_1 Add existing users to public channel from drop-down > Add Members', () => {
// # Visit the add users channel
cy.visit(`/${testTeam.name}/channels/${addedUsersChannel.name}`);
// # Open channel menu and click 'Add Members'
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Assert that modal appears
cy.get('#addUsersToChannelModal').should('be.visible');
// # Type into the input box to search for a user
@@ -160,7 +163,10 @@ describe('Channel Settings', () => {
cy.visit(`/${testTeam.name}/channels/off-topic`);
// # Open channel menu and click 'Add Members'
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Assert that modal appears
cy.get('#addUsersToChannelModal').should('be.visible');
// # Type into the input box to search for already added user
@@ -182,7 +188,8 @@ describe('Channel Settings', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Open channel menu and click 'Add Members'
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Assert that modal appears
cy.get('#addUsersToChannelModal').should('be.visible');
@@ -230,7 +237,8 @@ describe('Channel Settings', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Open channel menu and click 'Add Members'
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Assert that modal appears
cy.get('#addUsersToChannelModal').should('be.visible');
@@ -275,7 +283,8 @@ describe('Channel Settings', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Open channel menu and click 'Add Members'
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Assert that modal appears
cy.get('#addUsersToChannelModal').should('be.visible');
@@ -324,7 +333,8 @@ describe('Channel Settings', () => {
cy.visit(`/${testTeam.name}/channels/${channel.name}`);
// # Open channel menu and click 'Add Members'
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Assert that modal appears
cy.get('#addUsersToChannelModal').should('be.visible');
@@ -369,7 +379,8 @@ function verifyMentionedUserAndProfilePopover(postId: string) {
function addNumberOfUsersToChannel(num = 1, allowExisting = false) {
// # Open channel menu and click 'Add Members'
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
cy.get('#addUsersToChannelModal').should('be.visible');
// * Assert that modal appears

15
e2e-tests/cypress/tests/integration/channels/channel_settings/channel_name_validations_spec.ts
Просмотреть файл

@@ -35,7 +35,10 @@ describe('Channel routing', () => {
cy.uiCreateChannel({name: 'Test__Channel'});
// # Click on channel menu and press rename channel
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// * Channel Settings menu option should be visible
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
cy.findByText('Rename Channel').click();
// # Assert if the rename modal present
@@ -97,7 +100,10 @@ describe('Channel routing', () => {
// # In a test channel, click the "v" to the right of the channel name in the header
cy.findByText(`${testChannel.display_name}`).click();
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// * Channel Settings menu option should be visible
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
// # Select "Rename Channel"
cy.findByText('Rename Channel').click();
@@ -113,7 +119,10 @@ describe('Channel routing', () => {
cy.get('#channelHeaderTitle').contains(`${firstWord} ${secondWord}`);
// # In a test channel, click the "v" to the right of the channel name in the header
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// * Channel Settings menu option should be visible
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
// # Select "Rename Channel"
cy.findByText('Rename Channel').click();

4
e2e-tests/cypress/tests/integration/channels/enterprise/accessibility/accessibility_modals_dialogs_1_spec.ts
Просмотреть файл

@@ -71,7 +71,7 @@ describe('Verify Accessibility Support in Modals & Dialogs', () => {
cy.visit(`/${testTeam.name}/channels/off-topic`);
// # Open Channel Members Dialog
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
cy.findByText('Manage Members').click().wait(TIMEOUTS.FIVE_SEC);
// * Verify the accessibility support in Manage Members Dialog
@@ -118,7 +118,7 @@ function verifyMainMenuModal(menuItem: string, modalName?: string) {
}
function verifyChannelMenuModal(menuItem: string, modalName?: string) {
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
verifyModal(menuItem, modalName);
}

4
e2e-tests/cypress/tests/integration/channels/enterprise/accessibility/accessibility_modals_dialogs_spec.ts
Просмотреть файл

@@ -149,8 +149,8 @@ describe('Verify Accessibility Support in Modals & Dialogs', () => {
cy.visit(`/${testTeam.name}/channels/${testChannel.name}`);
// # Open Add Members Dialog
cy.get('#channelHeaderDropdownIcon').click();
cy.findByText('Add Members').click();
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Verify the accessibility support in Add people Dialog
cy.findAllByRole('dialog').eq(0).within(() => {

4
e2e-tests/cypress/tests/integration/channels/enterprise/guest_accounts/guest_identification_ui_spec.ts
Просмотреть файл

@@ -59,8 +59,8 @@ describe('Verify Guest User Identification in different screens', () => {
it('MM-T1370 Verify Guest Badge in Channel Members dropdown and dialog', () => {
// # Open Channel Members RHS
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelManageMembers').click().wait(TIMEOUTS.HALF_SEC);
cy.get('#channelHeaderTitle').click();
cy.get('#channelMembers').click().wait(TIMEOUTS.HALF_SEC);
cy.uiGetRHS().findByTestId(`memberline-${guestUser.id}`).within(($el) => {
cy.wrap($el).get('.Tag').should('be.visible').should('have.text', 'GUEST');
});

27
e2e-tests/cypress/tests/integration/channels/enterprise/permissions/team_permissions_spec.ts
Просмотреть файл

@@ -118,16 +118,10 @@ describe('Team Permissions', () => {
cy.uiOpenChannelMenu().wait(TIMEOUTS.HALF_SEC);
// * Verify dropdown opens
cy.get('#channelHeaderDropdownMenu .Menu__content.dropdown-menu').should('be.visible');
// * Verify `Add Members` menu item is not present
cy.get('#channelAddMembers').should('not.exist');
// * Verify `Manage Members` menu item is not present
cy.get('#channelManageMembers').should('not.exist');
cy.get('#channelHeaderDropdownMenu').should('be.visible');
// * Verify `View Members` menu item is visible
cy.get('#channelViewMembers').should('be.visible');
cy.get('#channelMembers').should('be.visible');
// # Close channel header menu
cy.get('body').type('{esc}');
@@ -166,10 +160,11 @@ describe('Team Permissions', () => {
cy.uiOpenChannelMenu().wait(TIMEOUTS.HALF_SEC);
// * Verify dropdown opens
cy.get('#channelHeaderDropdownMenu .Menu__content.dropdown-menu').should('be.visible');
cy.get('#channelHeaderDropdownMenu').should('be.visible');
// # Click on `Invite Members`
cy.get('#channelInviteMembers').should('be.visible').click().wait(TIMEOUTS.HALF_SEC);
// # Click on `Members`
cy.get('#channelMembers').should('be.visible').click().wait(TIMEOUTS.HALF_SEC);
cy.uiGetButton('Add').click();
// # Search and select otherUser
cy.get('#selectItems input').typeWithForce(otherUser.username).wait(TIMEOUTS.HALF_SEC);
@@ -182,10 +177,11 @@ describe('Team Permissions', () => {
cy.uiOpenChannelMenu().wait(TIMEOUTS.HALF_SEC);
// * Verify dropdown opens
cy.get('#channelHeaderDropdownMenu .Menu__content.dropdown-menu').should('be.visible');
cy.get('#channelHeaderDropdownMenu').should('be.visible');
// # Click on `Manage Members`
cy.get('#channelManageMembers').should('be.visible').click().wait(TIMEOUTS.HALF_SEC);
// # Click on `Members`
cy.get('#channelMembers').should('be.visible').click().wait(TIMEOUTS.HALF_SEC);
cy.uiGetButton('Manage').click();
// # Click on `Member`
cy.uiGetRHS().findByTestId(`memberline-${otherUser.id}`).within(() => {
@@ -210,7 +206,8 @@ describe('Team Permissions', () => {
cy.uiOpenChannelMenu().wait(TIMEOUTS.HALF_SEC);
// * Verify dropdown opens
cy.get('#channelHeaderDropdownMenu .Menu__content.dropdown-menu').should('be.visible');
cy.get('#channelHeaderDropdownMenu').should('be.visible');
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
// * Verify `Edit Channel Header` menu item is visible
cy.get('#channelEditHeader').should('be.visible');

2
e2e-tests/cypress/tests/integration/channels/enterprise/system_console/about/edition_and_license_spec.js
Просмотреть файл

@@ -125,7 +125,7 @@ function verifyRenamePrivateChannel(teamName, privateChannelName, testUsers) {
cy.visit(`/${teamName}/channels/${privateChannelName}`);
// * Click the dropdown menu and verify if the rename option is visible or not
cy.get('#channelHeaderDropdownIcon', {timeout: TIMEOUTS.TWO_MIN}).should('be.visible').click();
cy.get('#channelHeaderTitle', {timeout: TIMEOUTS.TWO_MIN}).should('be.visible').click();
cy.get('#channelRename').should(canRename ? 'be.visible' : 'not.exist');
}
}

12
e2e-tests/cypress/tests/integration/channels/keyboard_shortcuts/ctrl_cmd_shift_slash/not_open_emoji_picker_spec.js
Просмотреть файл

@@ -115,8 +115,13 @@ describe('Keyboard shortcut CTRL/CMD+Shift+\\ for adding reaction to last messag
verifyEmojiPickerNotOpen();
['Edit Channel Header', 'Rename Channel'].forEach((modal) => {
// # Open the modal and do keyboard shortcut
cy.uiOpenChannelMenu(modal);
// # Click on the channel name in the channel header to open the channel menu options
cy.get('#channelHeaderTitle').click();
// # Select the "Edit Channel Header" option from the dropdown
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
cy.findByText(modal).click();
doReactToLastMessageShortcut();
// * Verify emoji picker is not open
@@ -135,6 +140,9 @@ describe('Keyboard shortcut CTRL/CMD+Shift+\\ for adding reaction to last messag
// # Verify emoji picker is not open
cy.get('#emojiPicker').should('not.exist');
// close channel Menu
pressEscapeKey();
// * Open the main menu dropdown and do keyboard shortcut
cy.uiOpenTeamMenu();
doReactToLastMessageShortcut();

2
e2e-tests/cypress/tests/integration/channels/mark_as_unread/archive_channel_mark_as_unread_spec.js
Просмотреть файл

@@ -61,7 +61,7 @@ describe('Channels', () => {
cy.get('#channelHeaderTitle').should('contain', testChannel.display_name).click();
// * Verify that the menu is opened
cy.get('.Menu__content').should('be.visible').within(() => {
cy.get('#channelHeaderDropdownMenu').should('be.visible').within(() => {
// # Archive the channel
cy.findByText('Archive Channel').should('be.visible').click();
});

8
e2e-tests/cypress/tests/integration/channels/messaging/direct_message_spec.js
Просмотреть файл

@@ -170,14 +170,14 @@ describe('Direct Message', () => {
// # Visit the DM channel
cy.visit(`/${testTeam.name}/messages/@${otherUser.username}`);
// # Open channel menu and click Mute Conversation
cy.uiOpenChannelMenu('Mute Conversation');
// # Open channel menu and click Mute
cy.uiOpenChannelMenu('Mute');
// * Assert that channel appears as muted on the LHS
cy.uiGetLhsSection('DIRECT MESSAGES').find('.muted').first().should('contain', otherUser.username);
// # Open channel menu and click Unmute Conversation
cy.uiOpenChannelMenu('Unmute Conversation');
// # Open channel menu and click Unmute
cy.uiOpenChannelMenu('Unmute');
// * Assert that channel does not appear as muted on the LHS
cy.uiGetLhsSection('DIRECT MESSAGES').find('.muted').should('not.exist');

3
e2e-tests/cypress/tests/integration/channels/messaging/focus_move_spec.js
Просмотреть файл

@@ -142,7 +142,8 @@ function verifyFocusInAddChannelMemberModal() {
cy.get('#channelLeaveChannel').should('be.visible');
// # Click 'Add Members'
cy.get('#channelInviteMembers').click();
cy.get('#channelMembers').click();
cy.uiGetButton('Add').click();
// * Assert that modal appears
cy.get('#addUsersToChannelModal').should('be.visible');

16
e2e-tests/cypress/tests/integration/channels/messaging/header_spec.js
Просмотреть файл

@@ -30,16 +30,16 @@ describe('Header', () => {
it('MM-T88 An ellipsis indicates the channel header is too long - public or private channel Quote icon displays at beginning of channel header', () => {
// * Verify with short channel header
updateAndVerifyChannelHeader('>', 'newheader');
updateAndVerifyChannelHeader(false, '>', 'newheader');
// * Verify with long channel header
updateAndVerifyChannelHeader('>', 'newheader'.repeat(20));
updateAndVerifyChannelHeader(false, '>', 'newheader'.repeat(20));
});
it('MM-T881_1 - Header: Markdown quote', () => {
// # Update channel header text
const header = 'This is a quote in the header';
updateAndVerifyChannelHeader('>', header);
updateAndVerifyChannelHeader(false, '>', header);
});
it('MM-T89 An ellipsis indicates the channel header is too long - DM', () => {
@@ -56,7 +56,7 @@ describe('Header', () => {
// # Update DM channel header
const header = `quote ${'newheader'.repeat(15)}`;
updateAndVerifyChannelHeader('>', header);
updateAndVerifyChannelHeader(true, '>', header);
// # Hover on channel header
cy.get('#channelHeaderDescription .header-description__text').trigger('mouseenter');
@@ -70,9 +70,13 @@ describe('Header', () => {
});
});
function updateAndVerifyChannelHeader(prefix, header) {
function updateAndVerifyChannelHeader(isDM, prefix, header) {
// # Update channel header
cy.updateChannelHeader(prefix + header);
if (isDM) {
cy.updateDMGMChannelHeader(prefix + header);
} else {
cy.updateChannelHeader(prefix + header);
}
// * Should render blockquote if it starts with ">"
if (prefix === '>') {

2
e2e-tests/cypress/tests/integration/channels/multi_team_and_dm/close_gm_via_menu_spec.js
Просмотреть файл

@@ -44,7 +44,7 @@ describe('Multi-user group messages', () => {
cy.get('#saveItems').click();
// # Click channel dropdown icon to open menu
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// # Click 'close' item
cy.findByText('Close Group Message').should('be.visible').click();

4
e2e-tests/cypress/tests/integration/channels/multi_team_and_dm/gm_add_user_spec.js
Просмотреть файл

@@ -108,7 +108,8 @@ describe('Multi-user group messages', () => {
cy.postMessage('messages');
// # Open channel menu and click Add Members
cy.uiOpenChannelMenu('Add Members');
cy.uiOpenChannelMenu('Members');
cy.uiGetButton('Add').click();
// * Verify message says: "This will start a new conversation. If you're adding a lot of people, consider creating a private channel instead."
cy.get('#moreDmModal').should('be.visible');
@@ -139,7 +140,6 @@ describe('Multi-user group messages', () => {
cy.contains('p.channel-intro__text', 'This is the start of your group message history with');
// * New user is added to the GM
cy.get('.member-rhs__trigger').click();
cy.uiGetRHS().contains(testUser.username).should('be.visible');
// * Other users are still there

6
e2e-tests/cypress/tests/integration/channels/multi_team_and_dm/gm_header_spec.js
Просмотреть файл

@@ -136,8 +136,10 @@ describe('Multi-user group header', () => {
});
function editHeader(header) {
// # Click edit conversation header
cy.uiOpenChannelMenu('Edit Conversation Header');
// # Click edit header
cy.uiOpenChannelMenu('');
cy.findByRole('menuitem', {name: 'Settings'}).trigger('mouseover');
cy.findByText('Edit Header').click();
// * Verify the modal open to add header
cy.get('#editChannelHeaderModalLabel').should('be.visible').wait(TIMEOUTS.ONE_SEC);

5
e2e-tests/cypress/tests/integration/channels/multi_team_and_dm/max_gm_members_spec.js
Просмотреть файл

@@ -62,10 +62,11 @@ describe('Multi-user group messages', () => {
and('have.css', 'text-overflow', 'ellipsis');
// # From the group message's window, click on the user list's dropdown
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
// # From the dropdown menu, click on "Add members"
cy.get('#channelAddMembers').click();
cy.get('#channelMembers').click();
cy.uiGetButton('Add').click();
// # Try to add one more user from the group message's list
addUsersToGMViaModal(1);

2
e2e-tests/cypress/tests/integration/channels/system_console/user_management/users_deactivation_spec.js
Просмотреть файл

@@ -72,7 +72,7 @@ describe('System Console > User Management > Deactivation', () => {
cy.sendDirectMessageToUser(other, MESSAGES.SMALL);
// # Close DM
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
cy.findByText('Close Direct Message').click();
// # Deactivate the user

24
e2e-tests/cypress/tests/integration/playbooks/channels/general_actions_spec.js
Просмотреть файл

@@ -56,6 +56,9 @@ describe('channels > general actions', {testIsolation: true}, () => {
// # Open Channel Header and the Channel Actions modal
cy.get('#channelHeaderTitle').click();
// * More actions menu option should be visible
cy.findByText('More actions').should('be.visible').trigger('mouseover');
cy.findByText('Channel Actions').click();
// # Enable the categorization action and set the name
@@ -87,6 +90,9 @@ describe('channels > general actions', {testIsolation: true}, () => {
// # Open Channel Header and the Channel Actions modal
cy.get('#channelHeaderTitle').click();
// * More actions menu option should be visible
cy.findByText('More actions').should('be.visible').trigger('mouseover');
cy.findByText('Channel Actions').click();
// # Toggle on and set the welcome message
@@ -136,6 +142,9 @@ describe('channels > general actions', {testIsolation: true}, () => {
// # Open Channel Header and the Channel Actions modal
cy.get('#channelHeaderTitle').click();
// * More actions menu option should be visible
cy.findByText('More actions').should('be.visible').trigger('mouseover');
cy.findByText('Channel Actions').click();
// # Set a keyword, enable the playbook trigger,
@@ -196,6 +205,9 @@ describe('channels > general actions', {testIsolation: true}, () => {
// # Open Channel Header and the Channel Actions modal
cy.get('#channelHeaderTitle').click();
// * More actions menu option should be visible
cy.findByText('More actions').should('be.visible').trigger('mouseover');
cy.findByText('Channel Actions').click();
// # Set a keyword, enable the playbook trigger,
@@ -272,6 +284,9 @@ describe('channels > general actions', {testIsolation: true}, () => {
// # Open Channel Header and the Channel Actions modal
cy.get('#channelHeaderTitle').click();
// * More actions menu option should be visible
cy.findByText('More actions').should('be.visible').trigger('mouseover');
cy.findByText('Channel Actions').click();
// # Set a keyword, enable the playbook trigger,
@@ -311,6 +326,9 @@ describe('channels > general actions', {testIsolation: true}, () => {
// # Open Channel Header and the Channel Actions modal
cy.get('#channelHeaderTitle').click();
// * More actions menu option should be visible
cy.findByText('More actions').should('be.visible').trigger('mouseover');
cy.findByText('Channel Actions').click();
// * Verify the toggles are disabled
@@ -333,6 +351,9 @@ describe('channels > general actions', {testIsolation: true}, () => {
// # Open Channel Header and the Channel Actions modal
cy.get('#channelHeaderTitle').click();
// * More actions menu option should be visible
cy.findByText('More actions').should('be.visible').trigger('mouseover');
cy.findByText('Channel Actions').click();
// # Enable the categorization action and set the name
@@ -353,6 +374,9 @@ describe('channels > general actions', {testIsolation: true}, () => {
// # Open Channel Header and the Channel Actions modal
cy.get('#channelHeaderTitle').click();
// * More actions menu option should be visible
cy.findByText('More actions').should('be.visible').trigger('mouseover');
cy.findByText('Channel Actions').click();
// * Verify that the categorization action is disabled

1
e2e-tests/cypress/tests/integration/playbooks/channels/run_spec.js
Просмотреть файл

@@ -104,6 +104,7 @@ describe('channels > run', {testIsolation: true}, () => {
// # Open the channel header
cy.get('#channelHeaderTitle').click();
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
// * Verify the ability to edit the channel header exists
cy.get('#channelEditHeader').should('exist');

16
e2e-tests/cypress/tests/support/ui/channel.js
Просмотреть файл

@@ -43,8 +43,9 @@ Cypress.Commands.add('uiCreateChannel', ({
Cypress.Commands.add('uiAddUsersToCurrentChannel', (usernameList) => {
if (usernameList.length) {
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelAddMembers').click();
cy.get('#channelHeaderTitle').click();
cy.get('#channelMembers').click();
cy.uiGetButton('Add').click();
cy.get('#addUsersToChannelModal').should('be.visible');
usernameList.forEach((username) => {
cy.get('#selectItems input').typeWithForce(`@${username}{enter}`);
@@ -56,8 +57,9 @@ Cypress.Commands.add('uiAddUsersToCurrentChannel', (usernameList) => {
Cypress.Commands.add('uiInviteUsersToCurrentChannel', (usernameList) => {
if (usernameList.length) {
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelInviteMembers').click();
cy.get('#channelHeaderTitle').click();
cy.get('#channelMembers').click();
cy.uiGetButton('Add').click();
cy.get('#addUsersToChannelModal').should('be.visible');
usernameList.forEach((username) => {
cy.get('#selectItems input').typeWithForce(`@${username}{enter}`);
@@ -68,19 +70,19 @@ Cypress.Commands.add('uiInviteUsersToCurrentChannel', (usernameList) => {
});
Cypress.Commands.add('uiArchiveChannel', () => {
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
cy.get('#channelArchiveChannel').click();
return cy.get('#deleteChannelModalDeleteButton').click();
});
Cypress.Commands.add('uiUnarchiveChannel', () => {
cy.get('#channelHeaderDropdownIcon').should('be.visible').click();
cy.get('#channelHeaderTitle').should('be.visible').click();
cy.get('#channelUnarchiveChannel').should('be.visible').click();
return cy.get('#unarchiveChannelModalDeleteButton').should('be.visible').click();
});
Cypress.Commands.add('uiLeaveChannel', (isPrivate = false) => {
cy.get('#channelHeaderDropdownIcon').click();
cy.get('#channelHeaderTitle').click();
if (isPrivate) {
cy.get('#channelLeaveChannel').click();

1
e2e-tests/cypress/tests/support/ui/channel_header.js
Просмотреть файл

@@ -32,7 +32,6 @@ Cypress.Commands.add('uiGetChannelFileButton', () => {
Cypress.Commands.add('uiGetChannelMenu', (options = {exist: true}) => {
if (options.exist) {
return cy.get('#channelHeaderDropdownMenu').
find('.dropdown-menu').
should('be.visible');
}

36
e2e-tests/cypress/tests/support/ui_commands.ts
Просмотреть файл

@@ -462,13 +462,15 @@ function getCurrentChannelId(): ChainableT<string> {
Cypress.Commands.add('getCurrentChannelId', getCurrentChannelId);
function updateChannelHeader(text: string) {
cy.get('#channelHeaderDropdownIcon').
cy.get('#channelHeaderTitle').
should('be.visible').
click();
cy.get('.Menu__content').
should('be.visible').
find('#channelEditHeader').
click();
cy.get('#channelHeaderDropdownMenu').
should('be.visible');
// * Channel Settings menu option should be visible
cy.findByText('Channel Settings').should('be.visible').trigger('mouseover');
cy.findByText('Edit Channel Header').click();
cy.get('#edit_textbox').
clear().
type(text).
@@ -478,6 +480,24 @@ function updateChannelHeader(text: string) {
Cypress.Commands.add('updateChannelHeader', updateChannelHeader);
function updateDMGMChannelHeader(text: string) {
cy.get('#channelHeaderTitle').
should('be.visible').
click();
cy.get('#channelHeaderDropdownMenu').
should('be.visible');
// * Channel Settings menu option should be visible
cy.findByText('Edit Header').click();
cy.get('#edit_textbox').
clear().
type(text).
type('{enter}').
wait(TIMEOUTS.HALF_SEC);
}
Cypress.Commands.add('updateDMGMChannelHeader', updateDMGMChannelHeader);
function checkRunLDAPSync(): ChainableT<any> {
return cy.apiGetLDAPSync().then((response) => {
const jobs = response.body;
@@ -787,6 +807,12 @@ declare global {
*/
updateChannelHeader(text: string): ChainableT<void>;
/**
* Update DM or GM channel header
* @param {String} text - Text to set the header to
*/
updateDMGMChannelHeader(text: string): ChainableT<void>;
/**
* Navigate to system console-PluginManagement from profile settings
*/