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>
Этот коммит содержится в:
коммит произвёл
GitHub
родитель
8eadf849bb
Коммит
fd717cfa64
@@ -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();
|
||||
});
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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();
|
||||
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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');
|
||||
|
||||
@@ -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);
|
||||
});
|
||||
|
||||
@@ -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 ', () => {
|
||||
|
||||
Ссылка в новой задаче
Block a user