snapshot of https://github.com/mattermost/mattermost.git (master, 2026-09-16; blobs > 131072B omitted)

e2e-tests/cypress/tests/integration/channels/plugins/demo_plugin/webhook_spec.js

@@ -0,0 +1,206 @@
+// 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: @channels @plugin @not_cloud
+
+import * as TIMEOUTS from '@/fixtures/timeouts';
+import {demoPlugin} from '@/utils/plugins';
+
+describe('Demo plugin - Webhook events', () => {
+    let team1;
+    let team2;
+    let testUser;
+    let admin;
+    let testChannel;
+
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+
+        // # Set plugin settings
+        const newSettings = {
+            PluginSettings: {
+                Enable: true,
+            },
+            ServiceSettings: {
+                EnableGifPicker: true,
+            },
+            FileSettings: {
+                EnablePublicLink: true,
+            },
+        };
+        cy.apiUpdateConfig(newSettings);
+
+        cy.apiInitSetup().then(({team, user}) => {
+            admin = user;
+            team1 = team;
+
+            // # Create team before installing demo plugin
+            cy.apiCreateTeam('team', 'Team').then(({team: anotherTeam}) => {
+                team2 = anotherTeam;
+            });
+
+            // # Install demo plugin by file
+            cy.apiUploadAndEnablePlugin(demoPlugin);
+
+            // # Enable webhook events
+            cy.visit(`/${team1.name}/channels/off-topic`);
+            cy.postMessage('/demo_plugin true ').wait(TIMEOUTS.TWO_SEC);
+
+            // * Verify that hooks are enabled
+            cy.getLastPost().contains('enabled', {matchCase: false});
+
+            // # Create channel
+            cy.apiCreateChannel(team.id, 'my_test_channel', 'my_test_channel').then(({channel}) => {
+                testChannel = channel.name;
+            });
+
+            // # Join the demo channel
+            cy.visit(`/${team1.name}/channels/demo_plugin`);
+
+            // # Create another user
+            cy.apiCreateUser().then(({user: otherUser}) => {
+                testUser = otherUser;
+                cy.apiAddUserToTeam(team.id, testUser.id);
+
+                // # Login another user
+                cy.apiLogin(testUser);
+
+                // # Join the demo channel
+                cy.visit(`/${team1.name}/channels/demo_plugin`);
+            });
+        });
+    });
+
+    it('MM-T2408_1 - User posts a message Webhook event', () => {
+        // # Post message
+        cy.visit(`/${team1.name}/channels/off-topic`);
+        cy.postMessage('MM-T2408_1');
+
+        // * Verify message is posted in the demo channel
+        cy.visit(`/${team1.name}/channels/demo_plugin`);
+        cy.findAllByTestId('postView').should('contain', `MessageHasBeenPosted: @${testUser.username}, ~Town Square`);
+    });
+
+    it('MM-T2408_2 - User joined a channel Webhook event', () => {
+        // # Join channel
+        cy.visit(`/${team1.name}/channels/${testChannel}`).wait(TIMEOUTS.ONE_SEC);
+        cy.postMessage('MM-T2408_2');
+
+        // * Verify message is posted in the demo channel
+        cy.visit(`/${team1.name}/channels/demo_plugin`);
+        cy.findAllByTestId('postView').should('contain', `UserHasJoinedChannel: @${testUser.username}, ~my_test_channel`);
+    });
+
+    it('MM-T2408_3 - ​User left a channel Webhook event', () => {
+        // # Leave channel
+        cy.visit(`/${team1.name}/channels/${testChannel}`);
+        cy.uiLeaveChannel(false);
+
+        // * Verify message is posted in the demo plugin channel
+        cy.visit(`/${team1.name}/channels/demo_plugin`);
+        cy.findAllByTestId('postView').should('contain', `UserHasLeftChannel: @${testUser.username}, ~my_test_channel`);
+    });
+
+    it('MM-T2408_4 - User edited a message Webhook event', () => {
+        // # Post message
+        cy.visit(`/${team1.name}/channels/off-topic`);
+        cy.postMessage('MM-T2408_4');
+
+        // # Get last post ID
+        cy.getLastPostId().then((postID) => {
+            // # click dot menu button
+            cy.clickPostDotMenu();
+
+            // # click edit post
+            cy.get(`#edit_post_${postID}`).click();
+
+            // # Edit message and finish by hitting `enter`
+            cy.get('#edit_textbox').
+                should('be.visible').
+                and('be.focused').
+                wait(TIMEOUTS.HALF_SEC).
+                type('MM-T2408_4 edited').
+                type('{enter}');
+
+            // # Open demo plugin channel
+            cy.visit(`/${team1.name}/channels/demo_plugin`);
+
+            // * Verify event posted in the channel
+            cy.findAllByTestId('postView').should('contain', `MessageHasBeenUpdated: @${testUser.username}, ~Off-Topic`);
+        });
+    });
+
+    it('MM-T2408_5 - User adds a reaction to a message Webhook event', () => {
+        // # Post message
+        cy.visit(`/${team1.name}/channels/off-topic`);
+        cy.postMessage('MM-T2408_5');
+
+        cy.getLastPostId().then((postId) => {
+            // # Click the add reaction icon
+            cy.clickPostReactionIcon(postId);
+
+            // # Choose "slightly_frowning_face" emoji
+            cy.clickEmojiInEmojiPicker('slightly_frowning_face');
+
+            cy.visit(`/${team1.name}/channels/demo_plugin`);
+
+            // * Verify event posted in the channel
+            cy.findAllByTestId('postView').should('contain', `ReactionHasBeenAdded: @${testUser.username}, `).and('contain', ':slightly_frowning_face:');
+        });
+    });
+
+    it('MM-T2408_6 - ​User joined the team Webhook event', () => {
+        // # Add user to the team
+        cy.apiAdminLogin(admin);
+        cy.apiAddUserToTeam(team2.id, testUser.id);
+
+        // # Open demo plugin channel
+        cy.visit(`/${team2.name}/channels/demo_plugin`);
+
+        // * Verify event is posted in the channel
+        cy.findAllByTestId('postView').should('contain', `UserHasJoinedTeam: @${testUser.username}`);
+    });
+
+    it('MM-T2408_7 - ​User left a team Webhook event', () => {
+        // # Delete user from team
+        cy.apiDeleteUserFromTeam(team2.id, testUser.id);
+
+        // # Open demo plugin channel
+        cy.visit(`/${team2.name}/channels/demo_plugin`);
+
+        // * Verify event is posted in the channel
+        cy.findAllByTestId('postView').should('contain', `UserHasLeftTeam: @${testUser.username}`);
+    });
+
+    it('MM-T2408_8 - ​User user login Webhook event', () => {
+        // # Login
+        cy.apiLogin(testUser);
+
+        // # Open demo plugin channel
+        cy.visit(`/${team1.name}/channels/demo_plugin`);
+
+        // * Verify event is posted in the channel
+        cy.findAllByTestId('postView').should('contain', `User @${testUser.username} has logged in`);
+    });
+
+    it('MM-T2408_9 - ​User user created Webhook event', () => {
+        // # Login
+        cy.apiAdminLogin(admin);
+
+        // # Create another user
+        cy.apiCreateUser().then(({user: otherUser}) => {
+            // # Open demo plugin channel
+            cy.visit(`/${team1.name}/channels/demo_plugin`);
+
+            // * Verify event is posted in the channel
+            cy.findAllByTestId('postView').should('contain', `User_ID @${otherUser.id} has been created in`);
+        });
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/helpers.js

@@ -0,0 +1,21 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import * as TIMEOUTS from '@/fixtures/timeouts';
+
+export function waitForAlertMessage(pluginId, message) {
+    const checkFn = () => {
+        cy.log(`Waiting for ${message}`);
+        return cy.findByTestId(pluginId).scrollIntoView().then((pluginEl) => {
+            return pluginEl[0].innerText.includes(message);
+        });
+    };
+
+    const options = {
+        timeout: TIMEOUTS.TWO_MIN,
+        interval: TIMEOUTS.FIVE_SEC,
+        errorMsg: `Expected "${message}" to be in plugin status but not found.`,
+    };
+
+    return cy.waitUntil(checkFn, options);
+}

e2e-tests/cypress/tests/integration/channels/plugins/link_tooltip_spec.js

@@ -0,0 +1,58 @@
+// 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: @channels @not_cloud @plugin
+
+import {demoPlugin} from '@/utils';
+
+describe('Link tooltips', () => {
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+
+        // # Set plugin settings
+        const newSettings = {
+            PluginSettings: {
+                Enable: true,
+            },
+            ServiceSettings: {
+                EnableGifPicker: true,
+            },
+            FileSettings: {
+                EnablePublicLink: true,
+            },
+        };
+
+        cy.apiUpdateConfig(newSettings);
+
+        // # Enable the demo-plugin
+        cy.apiUploadAndEnablePlugin(demoPlugin);
+
+        // # Open a channel and post www.test.com
+        cy.apiInitSetup({loginAfter: true}).then(({team, channel}) => {
+            cy.visit(`/${team.name}/channels/${channel.name}`);
+        });
+    });
+
+    it('MM-T3422 fade in and out with an animation', () => {
+        const url = 'www.test.com';
+        cy.postMessage(url);
+        cy.uiWaitUntilMessagePostedIncludes(url);
+
+        // # Hover over the plugin link
+        cy.getLastPost().findByText(url).should('exist').focus();
+
+        // * Check tooltip has appeared
+        cy.findByText('This is a custom tooltip from the Demo Plugin').should('be.visible');
+
+        // # Close the tooltip
+        cy.get('body').type('{esc}');
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/marketplace/disabled_remote_marketplace_spec.js

@@ -0,0 +1,71 @@
+// 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: @channels @not_cloud @plugin_marketplace @plugin @plugins_uninstall
+
+import {githubPlugin} from '@/utils/plugins';
+
+describe('Plugin Marketplace', () => {
+    let townsquareLink;
+
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+        cy.apiUninstallAllPlugins();
+
+        cy.apiInitSetup().then(({team}) => {
+            townsquareLink = `/${team.name}/channels/town-square`;
+        });
+    });
+
+    beforeEach(() => {
+        // # Enable Plugin Marketplace
+        // # Disable Plugin Remote Marketplace
+        // # Disable Automatic Prepackaged Plugins to make sure no plugins are loaded
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: true,
+                EnableMarketplace: true,
+                EnableRemoteMarketplace: false,
+                AutomaticPrepackagedPlugins: false,
+            },
+        });
+
+        // # Visit town-square channel
+        cy.visit(townsquareLink);
+
+        // # Open up marketplace
+        cy.uiOpenProductMenu('Marketplace');
+    });
+
+    it('not display any plugins and no error bar', () => {
+        // * Verify no plugins should be visible
+        cy.get('#marketplaceTabs-pane-allListing').findByText('There are no plugins available at this time.');
+
+        // * Verify no error bar should be visible
+        cy.get('#error_bar').should('not.exist');
+    });
+
+    it('MM-T1979 display installed plugins', () => {
+        // # Install one plugin
+        cy.apiInstallPluginFromUrl(githubPlugin.url);
+
+        // # Scroll to GitHub plugin
+        cy.get('#marketplace-plugin-github').scrollIntoView().should('be.visible');
+
+        // * Verify the installed plugin shows up in "Installed" tab
+        cy.uiCloseAnnouncementBar().then(() => {
+            cy.get('#marketplaceTabs-tab-installed').scrollIntoView().should('be.visible').click();
+            cy.get('#marketplaceTabs-pane-installed').find('.more-modal__row').should('have.length', 1);
+        });
+
+        // * Verify no error bar should be visible
+        cy.get('#error_bar').should('not.exist');
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/marketplace/helpers.js

@@ -0,0 +1,14 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+export function verifyPluginMarketplaceVisibility(shouldBeVisible) {
+    cy.uiOpenProductMenu().within(() => {
+        if (shouldBeVisible) {
+            // * Verify Marketplace button should exist
+            cy.findByText('App Marketplace').should('exist');
+        } else {
+            // * Verify Marketplace button should not exist
+            cy.findByText('App Marketplace').should('not.exist');
+        }
+    });
+}

e2e-tests/cypress/tests/integration/channels/plugins/marketplace/invalid_marketplace_url_spec.js

@@ -0,0 +1,86 @@
+// 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: @channels @not_cloud @plugin_marketplace @plugin @plugins_uninstall
+
+import {githubPlugin} from '@/utils/plugins';
+
+describe('Plugin Marketplace', () => {
+    let townsquareLink;
+
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+
+        cy.apiInitSetup().then(({team}) => {
+            townsquareLink = `/${team.name}/channels/town-square`;
+        });
+    });
+
+    beforeEach(() => {
+        // # Login as sysadmin
+        cy.apiAdminLogin();
+
+        // # Enable Plugin Marketplace and Remote Marketplace
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: true,
+                EnableMarketplace: true,
+                EnableRemoteMarketplace: true,
+                MarketplaceURL: 'example.com',
+            },
+        });
+
+        // # Cleanup installed plugins
+        cy.apiUninstallAllPlugins();
+
+        // # Visit the Town Square channel
+        cy.visit(townsquareLink);
+
+        // # Open up marketplace
+        cy.uiOpenProductMenu('Marketplace');
+    });
+
+    it('render an error bar', () => {
+        // * Verify should be an error connecting to the marketplace server
+        cy.get('#error_bar').contains('Error connecting to the marketplace server');
+    });
+
+    it('show an error bar on failing to filter', () => {
+        // # Enable Plugin Marketplace
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: true,
+                EnableMarketplace: true,
+                MarketplaceURL: 'example.com',
+            },
+        });
+
+        // # Filter to jira plugin only
+        cy.get('#searchMarketplaceTextbox').typeWithForce('jira');
+
+        // * Verify should be an error connecting to the marketplace server
+        cy.get('#error_bar').contains('Error connecting to the marketplace server');
+    });
+
+    it('display installed plugins and error bar', () => {
+        // # Install one plugin
+        cy.apiInstallPluginFromUrl(githubPlugin.url, true);
+
+        // # Scroll to GitHub plugin
+        cy.get('#marketplace-plugin-github').scrollIntoView().should('be.visible');
+
+        // * Verify the installed plugin shows up in "Installed" tab
+        cy.get('#marketplaceTabs-tab-installed').scrollIntoView().should('be.visible').click();
+        cy.get('#marketplaceTabs-pane-installed').find('.more-modal__row').should('have.length', 1);
+
+        // * Verify should be an error connecting to the marketplace server
+        cy.get('#error_bar').contains('Error connecting to the marketplace server');
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/marketplace/not_render_in_main_menu_spec.js

@@ -0,0 +1,84 @@
+// 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: @channels @plugin_marketplace @not_cloud
+
+import {verifyPluginMarketplaceVisibility} from './helpers';
+
+describe('Plugin Marketplace', () => {
+    let townsquareLink;
+    let regularUser;
+
+    before(() => {
+        cy.apiInitSetup().then(({team, user}) => {
+            regularUser = user;
+            townsquareLink = `/${team.name}/channels/town-square`;
+        });
+    });
+
+    beforeEach(() => {
+        // # Login as sysadmin
+        cy.apiAdminLogin();
+    });
+
+    it('MM-T1952 Plugin Marketplace is not available to normal users', () => {
+        // # Enable Plugin Marketplace
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: true,
+                EnableMarketplace: true,
+                MarketplaceURL: 'https://api.integrations.mattermost.com',
+            },
+        });
+
+        // # Login as non admin user
+        cy.apiLogin(regularUser);
+        cy.visit(townsquareLink);
+
+        // * Verify Plugin Marketplace does not exist
+        verifyPluginMarketplaceVisibility(false);
+    });
+
+    it('MM-T1957 Marketplace is not available when "Enable Marketplace" is set to false', () => {
+        // # Enable Plugins
+        // # Disable Plugin Marketplace
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: true,
+                EnableMarketplace: false,
+                MarketplaceURL: 'https://api.integrations.mattermost.com',
+            },
+        });
+
+        // # Visit town-square channel
+        cy.visit(townsquareLink);
+
+        // * Verify Plugin Marketplace does not exist
+        verifyPluginMarketplaceVisibility(false);
+    });
+
+    it('MM-T1959 Marketplace is not available when "Enable Plugins" is false', () => {
+        // # Disable Plugins
+        // # Enable Plugin Marketplace
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: false,
+                EnableMarketplace: true,
+                MarketplaceURL: 'https://api.integrations.mattermost.com',
+            },
+        });
+
+        // # Visit town-square channel
+        cy.visit(townsquareLink);
+
+        // * Verify Plugin Marketplace does not exist
+        verifyPluginMarketplaceVisibility(false);
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/marketplace/render_in_main_menu_spec.js

@@ -0,0 +1,69 @@
+// 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: @channels @plugin_marketplace @not_cloud
+
+import {verifyPluginMarketplaceVisibility} from './helpers';
+
+import * as TIMEOUTS from '@/fixtures/timeouts';
+
+describe('Plugin Marketplace', () => {
+    let townsquareLink;
+    let pluginManagementPage;
+
+    before(() => {
+        cy.apiInitSetup().then(({team}) => {
+            townsquareLink = `/${team.name}/channels/town-square`;
+            pluginManagementPage = '/admin_console/plugins/plugin_management';
+        });
+    });
+
+    it('MM-T1960 Marketplace is available when "Enable Plugins" is true', () => {
+        // # Disable Plugins
+        // # Enable Plugin Marketplace
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: false,
+                EnableMarketplace: true,
+                MarketplaceURL: 'https://api.integrations.mattermost.com',
+            },
+        });
+        cy.visit(pluginManagementPage);
+
+        cy.wait(TIMEOUTS.HALF_SEC).get('input[data-testid="enablefalse"]').should('be.checked');
+        cy.get('input[data-testid="enabletrue"]').check();
+        cy.get('#saveSetting').click();
+
+        // Verify that the Plugin Marketplace is available
+        cy.visit(townsquareLink);
+        verifyPluginMarketplaceVisibility(true);
+    });
+
+    it('MM-T1958 Marketplace is available when "Enable Marketplace" is set to true', () => {
+        // # Enable Plugins
+        // # Disable Plugin Marketplace
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: true,
+                EnableMarketplace: false,
+                MarketplaceURL: 'https://api.integrations.mattermost.com',
+            },
+        });
+        cy.visit(pluginManagementPage);
+
+        cy.wait(TIMEOUTS.HALF_SEC).get('input[data-testid="enableMarketplacefalse"]').should('be.checked');
+        cy.get('input[data-testid="enableMarketplacetrue"]').check();
+        cy.get('#saveSetting').click();
+
+        // Verify that the Plugin Marketplace is available
+        cy.visit(townsquareLink);
+        verifyPluginMarketplaceVisibility(true);
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/marketplace/ui_spec.js

@@ -0,0 +1,254 @@
+// 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: @channels @not_cloud @plugin_marketplace @plugin @plugins_uninstall
+
+import * as TIMEOUTS from '@/fixtures/timeouts';
+import {githubPluginOld} from '@/utils/plugins';
+
+describe('Plugin Marketplace', () => {
+    let townsquareLink;
+
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+
+        cy.apiInitSetup().then(({team}) => {
+            townsquareLink = `/${team.name}/channels/town-square`;
+        });
+    });
+
+    beforeEach(() => {
+        // # Enable Plugin Marketplace and Remote Marketplace
+        // # Disable Plugin State Github and Webex
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: true,
+                EnableMarketplace: true,
+                EnableRemoteMarketplace: true,
+                MarketplaceURL: 'https://api.integrations.mattermost.com',
+                PluginStates: {
+                    github: {
+                        Enable: false,
+                    },
+                    'com.mattermost.webex': {
+                        Enable: false,
+                    },
+                },
+            },
+        });
+
+        // # Cleanup installed plugins
+        cy.apiUninstallAllPlugins();
+
+        // # Visit the Town Square channel
+        cy.visit(townsquareLink);
+
+        // # Open up marketplace
+        cy.uiOpenProductMenu('Marketplace');
+
+        // * Verify error bar should not be visible
+        cy.get('#error_bar').should('not.exist');
+
+        // * Verify search should be visible
+        cy.findByPlaceholderText('Search Marketplace').scrollIntoView().should('be.visible');
+
+        // * Verify tabs should be visible
+        cy.get('#marketplaceTabs').should('be.visible');
+
+        // * Verify all plugins tab button should be visible
+        cy.get('#marketplaceTabs-tab-allListing').should('be.visible');
+
+        // * Verify installed plugins tabs button should be visible
+        cy.get('#marketplaceTabs-tab-installed').should('be.visible');
+
+        // * Verify list of all plugins are visible
+        cy.get('#marketplaceTabs-pane-allListing').should('be.visible');
+    });
+
+    // https://mattermost.atlassian.net/browse/MM-54230
+    it('MM-T2001 autofocus on search plugin input box', () => {
+        cy.uiClose();
+
+        // # Open up marketplace
+        cy.uiOpenProductMenu('Marketplace');
+
+        // * Verify search plugins should be focused
+        cy.findByPlaceholderText('Search Marketplace').should('be.focused');
+    });
+
+    // https://mattermost.atlassian.net/browse/MM-54230
+    it('render the list of all plugins by default', () => {
+        // * Verify all plugins tab should be active
+        cy.get('#marketplaceTabs-tab-allListing').should('be.visible').parent().should('have.class', 'active');
+        cy.get('#marketplaceTabs-pane-allListing').should('be.visible');
+
+        // * Verify installed plugins tab should not be active
+        cy.get('#marketplaceTabs-tab-installed').should('be.visible').parent().should('not.have.class', 'active');
+        cy.get('#marketplaceTabs-pane-installed').should('not.exist');
+    });
+
+    // https://mattermost.atlassian.net/browse/MM-54230
+    // this test uses exist, not visible, due to issues with Cypress
+    it('render the list of installed plugins on demand', () => {
+        // # Click on installed plugins tab
+        cy.get('#marketplaceTabs-tab-installed').should('be.visible').click();
+
+        // * Verify all plugins tab should not be active
+        cy.get('#marketplaceTabs-tab-allListing').should('be.visible').parent().should('not.have.class', 'active');
+        cy.get('#marketplaceTabs-pane-allListing').should('not.exist');
+
+        // * Verify installed plugins tab is shown
+        cy.get('#marketplaceTabs-tab-installed').should('be.visible').parent().should('have.class', 'active');
+        cy.get('#marketplaceTabs-pane-installed').should('be.visible');
+    });
+
+    it('should close the modal on demand', () => {
+        // * Verify marketplace is be visible
+        cy.get('#modal_marketplace').should('be.visible');
+
+        // # Close marketplace modal
+        cy.uiClose();
+
+        // * Verify marketplace should not be visible
+        cy.get('#modal_marketplace').should('not.exist');
+    });
+
+    // https://mattermost.atlassian.net/browse/MM-54230
+    it('should filter all on search', () => {
+        // # Load all plugins before searching
+        cy.get('.more-modal__row').should('have.length', 15);
+
+        // # Filter to jira plugin only
+        cy.findByPlaceholderText('Search Marketplace').
+            scrollIntoView().
+            should('be.visible').
+            type('jira');
+
+        // * Verify jira plugin should be visible
+        cy.get('#marketplace-plugin-jira').should('be.visible');
+
+        // * Verify no other plugins should be visible
+        cy.get('#marketplaceTabs-pane-allListing').
+            find('.more-modal__row').
+            should('have.length', 1);
+    });
+
+    // https://mattermost.atlassian.net/browse/MM-54230
+    it('should show an error bar on failing to filter', () => {
+        // # Enable Plugin Marketplace
+        cy.apiUpdateConfig({
+            PluginSettings: {
+                Enable: true,
+                EnableMarketplace: true,
+                MarketplaceURL: 'example.com',
+            },
+        });
+
+        // # Filter to jira plugin only
+        cy.findByPlaceholderText('Search Marketplace').scrollIntoView().should('be.visible').type('jira');
+
+        // * Verify should be an error connecting to the marketplace server
+        cy.get('#error_bar').contains('Error connecting to the marketplace server');
+    });
+
+    it('should install a plugin on demand', () => {
+        // # Uninstall any existing webex plugin
+        cy.apiRemovePluginById('com.mattermost.webex');
+
+        // * Verify webex plugin should be visible
+        cy.findByText('Next').click();
+        cy.get('#marketplace-plugin-com\\.mattermost\\.webex').scrollIntoView().should('be.visible');
+
+        // # Install the webex plugin
+        cy.get('#marketplace-plugin-com\\.mattermost\\.webex').find('.btn.btn-primary').click();
+
+        // * Verify should show "Configure" after installation
+        cy.get('#marketplace-plugin-com\\.mattermost\\.webex').find('.btn.btn-outline', {timeout: TIMEOUTS.ONE_MIN}).scrollIntoView().should('be.visible').and('have.text', 'Configure');
+    });
+
+    // https://mattermost.atlassian.net/browse/MM-54230
+    it('should install a plugin from search results on demand', () => {
+        // # Uninstall any existing webex plugin
+        cy.apiRemovePluginById('com.mattermost.webex');
+
+        // # Filter to webex plugin only
+        cy.findByPlaceholderText('Search Marketplace').scrollIntoView().should('be.visible').type('webex');
+
+        // * Verify no other plugins should be visible
+        cy.get('#marketplaceTabs-pane-allListing').find('.more-modal__row').should('have.length', 1);
+
+        // * Verify webex plugin should be visible
+        cy.get('#marketplace-plugin-com\\.mattermost\\.webex').scrollIntoView().should('be.visible');
+
+        // # Install the webex plugin
+        cy.get('#marketplace-plugin-com\\.mattermost\\.webex').find('.btn.btn-primary').click();
+
+        // * Verify should show "Configure" after installation
+        cy.get('#marketplace-plugin-com\\.mattermost\\.webex').find('.btn.btn-outline', {timeout: TIMEOUTS.ONE_MIN}).scrollIntoView().should('be.visible').and('have.text', 'Configure');
+
+        // * Verify search filter should be maintained
+        cy.get('#marketplaceTabs-pane-allListing').find('.more-modal__row').should('have.length', 1);
+    });
+
+    it('should prompt to update an old GitHub plugin from all plugins', () => {
+        // # Install old version of GitHub plugin
+        cy.apiInstallPluginFromUrl(githubPluginOld.url, true);
+
+        // # Scroll to GitHub plugin
+        cy.get('#marketplace-plugin-github').scrollIntoView().should('be.visible');
+
+        // * Verify github plugin should have update prompt
+        cy.get('#marketplace-plugin-github').find('.update').should('be.visible').and('to.contain', 'Update available');
+
+        // * Verify github plugin should have update link
+        cy.get('#marketplace-plugin-github').find('.update b a').should('be.visible').and('have.text', 'Update');
+
+        // # Update GitHub plugin
+        cy.get('#marketplace-plugin-github .update b a').click();
+
+        // * Verify confirmation modal should be visible
+        cy.get('#confirmModal').should('be.visible');
+
+        // # Confirm update
+        cy.get('#confirmModal').find('.btn.btn-primary').click();
+
+        // * Verify confirmation modal should not be visible
+        cy.get('#confirmModal').should('not.exist');
+
+        // * Verify github plugin update prompt should not be visible
+        cy.get('#marketplace-plugin-github').find('.update').should('not.exist');
+
+        // * Verify should show "Configure" after installation
+        cy.get('#marketplace-plugin-github').find('.btn.btn-outline', {timeout: TIMEOUTS.ONE_MIN}).scrollIntoView().should('be.visible').and('have.text', 'Configure');
+
+        // * Verify github plugin should still be visible
+        cy.get('#marketplace-plugin-github').should('be.visible');
+    });
+
+    // https://mattermost.atlassian.net/browse/MM-54230
+    it('MM-T1986 change tab to "All Plugins" when "Install Plugins" link is clicked', () => {
+        cy.get('#marketplaceTabs').scrollIntoView().should('be.visible').within(() => {
+            // # Switch tab to installed plugin
+            cy.findByRole('tab', {name: /Installed/}).should('be.visible').and('have.attr', 'aria-selected', 'false').click();
+
+            // * Verify installed plugins tab should be active
+            cy.get('#marketplaceTabs-tab-allListing').should('be.visible').parent().should('not.have.class', 'active');
+            cy.get('#marketplaceTabs-tab-installed').should('be.visible').parent().should('have.class', 'active');
+
+            // # Click on Install Plugins should change current tab
+            cy.findByText('Install Plugins').should('be.visible').click();
+
+            // * Verify all plugins tab should be active
+            cy.findByRole('tab', {name: 'All'}).should('be.visible').and('have.attr', 'aria-selected', 'true');
+            cy.get('#marketplaceTabs-tab-allListing').should('be.visible').parent().should('have.class', 'active');
+            cy.get('#marketplaceTabs-tab-installed').should('be.visible').parent().should('not.have.class', 'active');
+        });
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/plugin_buttons_spec.js

@@ -0,0 +1,68 @@
+// 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: @channels @plugin @plugins_uninstall @not_cloud
+
+import * as TIMEOUTS from '@/fixtures/timeouts';
+import {demoPlugin, testPlugin} from '@/utils/plugins';
+
+describe('collapse on 15 plugin buttons', () => {
+    let testTeam;
+
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+
+        // # Login as Admin
+        cy.apiInitSetup().then(({team}) => {
+            testTeam = team;
+        });
+
+        // # Uninstall all plugins
+        cy.apiUninstallAllPlugins();
+    });
+
+    it('MM-T1649 Greater than 15 plugin buttons collapse to one icon in top nav', () => {
+        // # Go to town square
+        cy.visit(`/${testTeam.name}/channels/town-square`);
+
+        // # Upload and enable test plugin with 15 channel header icons
+        cy.apiUploadAndEnablePlugin(testPlugin).then(() => {
+            cy.wait(TIMEOUTS.TWO_SEC);
+
+            // # Get number of channel header icons
+            cy.get('.channel-header__icon').its('length').then((icons) => {
+                // # Upload and enable demo plugin with one additional channel header icon
+                cy.apiUploadAndEnablePlugin(demoPlugin).then(() => {
+                    cy.wait(TIMEOUTS.TWO_SEC);
+
+                    const maxPluginHeaderCount = 15;
+
+                    // * Validate that channel header icons collapsed and number is reduced by 14
+                    cy.get('.channel-header__icon').should('have.length', icons - (maxPluginHeaderCount - 1));
+
+                    // * Validate that plugin count is 16 (15 from test plugin and 1 from demo plugin)
+                    cy.get('#pluginCount').should('have.text', maxPluginHeaderCount + 1);
+
+                    // # click plugin channel header
+                    cy.get('#pluginChannelHeaderButtonDropdown').click();
+
+                    // * Verify dropdown menu exists
+                    cy.get('ul.dropdown-menu.channel-header_plugin-dropdown').should('exist');
+
+                    // * Verify the plugin icons expand out to show individually rather than being collapsed behind one icon
+                    cy.apiDisablePluginById(demoPlugin.id).then(() => {
+                        cy.wait(TIMEOUTS.TWO_SEC);
+                        cy.get('.channel-header__icon').should('have.length', icons);
+                    });
+                });
+            });
+        });
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/plugin_install_spec.js

@@ -0,0 +1,180 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+// <reference path="../support/index.d.ts" />
+
+// ***************************************************************
+// - [#] 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.
+// ***************************************************************
+
+/**
+ * Note: This spec requires "demoPlugin" file at fixtures folder.
+ * See details at "e2e/cypress/tests/utils/plugins.js", download the file
+ * from the given "@url" and save as indicated in the "@filename"
+ * under fixtures folder.
+ */
+
+// Group: @channels @system_console @plugin @not_cloud @timeout_error
+
+import {waitForAlertMessage} from './helpers';
+
+import * as TIMEOUTS from '@/fixtures/timeouts';
+import {demoPlugin} from '@/utils/plugins';
+
+describe('Plugins Management', () => {
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+        cy.apiRemovePluginById(demoPlugin.id);
+    });
+
+    it('MM-T2400 Plugins Management', () => {
+        // Visit the plugin management page
+        cy.visit('/admin_console/plugins/plugin_management');
+
+        const mimeType = 'application/gzip';
+        cy.fixture(demoPlugin.filename, 'binary').
+            then(Cypress.Blob.binaryStringToBlob).
+            then((fileContent) => {
+                cy.get('input[type=file]').attachFile({fileContent, fileName: demoPlugin.filename, mimeType});
+            });
+
+        // * Verify initial disabled state after upload
+        cy.findByTestId(demoPlugin.id, {timeout: TIMEOUTS.FIVE_MIN}).scrollIntoView().should('be.visible').within(() => {
+            cy.findByText('Enable').should('be.visible');
+            cy.findByText('Remove').should('be.visible');
+        });
+
+        verifyStatus(demoPlugin.id, 'This plugin is not enabled.');
+
+        // * Reload browser to make plugin's Settings appear
+        cy.reload();
+
+        cy.findByTestId(demoPlugin.id, {timeout: TIMEOUTS.ONE_MIN}).scrollIntoView().should('be.visible').within(() => {
+            // * Verify disabled state
+            cy.findByText('Enable').should('be.visible');
+            cy.findByText('Remove').should('be.visible');
+            cy.findByText('Settings').should('be.visible');
+        });
+
+        verifyStatus(demoPlugin.id, 'This plugin is not enabled.');
+
+        cy.findByTestId(demoPlugin.id).scrollIntoView().should('be.visible').within(() => {
+            // # Enable plugin
+            cy.findByText('Enable').should('be.visible').click();
+
+            // * Verify enabling state
+            cy.findByText('Enabling...').should('be.visible');
+            cy.findByText('This plugin is starting.').should('be.visible');
+        });
+
+        // * Verify enabled state
+        verifyStatus(demoPlugin.id, 'This plugin is running.');
+
+        cy.findByTestId(demoPlugin.id).scrollIntoView().should('be.visible').within(() => {
+            // # Open the plugin settings page
+            cy.findByText('Settings').should('be.visible').click();
+        });
+
+        // * Verify status is also shown on the plugin settings page
+        cy.findByTestId('plugin-metadata-panel', {timeout: TIMEOUTS.ONE_MIN}).should('be.visible');
+        cy.findByText('Running').should('be.visible');
+
+        // # Return to Plugin Management
+        cy.visit('/admin_console/plugins/plugin_management');
+
+        cy.findByTestId(demoPlugin.id).scrollIntoView().should('be.visible').within(() => {
+            // # Disable plugin
+            cy.findByText('Disable').should('be.visible').click();
+            cy.findByText('This plugin is stopping.').should('be.visible');
+        });
+
+        // * Verify final disabled state
+        verifyStatus(demoPlugin.id, 'This plugin is not enabled.');
+        cy.findByTestId(demoPlugin.id).scrollIntoView().
+            findByText('Enable').should('be.visible');
+    });
+
+    it('MM-T5714 Enable, disable and uninstall a plugin from its settings page', () => {
+        cy.apiRemovePluginById(demoPlugin.id);
+        cy.apiUploadPlugin(demoPlugin.filename);
+        cy.apiEnablePluginById(demoPlugin.id);
+        cy.visit(`/admin_console/plugins/plugin_${demoPlugin.id}`);
+
+        // * Verify the enable toggle reflects the running state
+        cy.findByTestId('plugin-metadata-panel', {timeout: TIMEOUTS.ONE_MIN}).should('be.visible');
+        cy.findByTestId(pluginEnableToggleTestId(demoPlugin.id)).
+            should('have.attr', 'aria-pressed', 'true').
+            and('have.attr', 'aria-label', 'Disable plugin');
+
+        // # Disable the plugin from the settings page
+        cy.findByTestId(pluginEnableToggleTestId(demoPlugin.id)).click();
+
+        // * Verify it disables in place, without needing Save
+        cy.findByTestId('plugin-metadata-status').should('contain.text', 'Not running');
+        cy.findByTestId(pluginEnableToggleTestId(demoPlugin.id)).
+            should('have.attr', 'aria-pressed', 'false').
+            and('have.attr', 'aria-label', 'Enable plugin');
+
+        // # Re-enable the plugin from the settings page
+        cy.findByTestId(pluginEnableToggleTestId(demoPlugin.id)).click();
+        cy.findByTestId('plugin-metadata-status').should('contain.text', 'Running');
+
+        // # Uninstall the plugin from the settings page
+        cy.get(`#plugin-actions-menu-button-${demoPlugin.id}`).click();
+        cy.get(`#plugin-actions-uninstall-${demoPlugin.id}`).click();
+
+        // * Verify the confirmation dialog
+        cy.get('.modal-title').should('contain.text', 'Remove plugin?');
+        cy.get('#confirmModalButton').click();
+
+        // * Verify redirect back to Plugin Management and the plugin is gone
+        cy.url().should('include', '/admin_console/plugins/plugin_management');
+        cy.findByTestId(demoPlugin.id).should('not.exist');
+    });
+
+    it('MM-T5715 Blocks plugin actions on the settings page when there are unsaved changes', () => {
+        cy.apiRemovePluginById(demoPlugin.id);
+        cy.apiUploadPlugin(demoPlugin.filename);
+        cy.apiEnablePluginById(demoPlugin.id);
+        cy.visit(`/admin_console/plugins/plugin_${demoPlugin.id}`);
+
+        // # Dirty a plugin setting without saving
+        cy.findByTestId(pluginSettingInputTestId(demoPlugin.id, 'channelname'), {timeout: TIMEOUTS.ONE_MIN}).
+            clear().
+            type('a_new_channel_name');
+
+        // # Attempt to disable the plugin while unsaved changes exist
+        cy.findByTestId(pluginEnableToggleTestId(demoPlugin.id)).click();
+
+        // * Verify the action is blocked with the expected warning, and the plugin stays enabled
+        cy.findByText('Please save unsaved changes first').should('be.visible');
+        cy.findByTestId(pluginEnableToggleTestId(demoPlugin.id)).should('have.attr', 'aria-pressed', 'true');
+
+        // # Attempt to uninstall the plugin while unsaved changes exist
+        cy.get(`#plugin-actions-menu-button-${demoPlugin.id}`).click();
+        cy.get(`#plugin-actions-uninstall-${demoPlugin.id}`).click();
+
+        // * Verify the action is still blocked: no confirmation dialog shown, plugin still installed
+        cy.get('.modal-title').should('not.exist');
+        cy.findByText('Please save unsaved changes first').should('be.visible');
+
+        cy.apiRemovePluginById(demoPlugin.id);
+    });
+});
+
+function verifyStatus(pluginId, message) {
+    waitForAlertMessage(pluginId, message);
+    cy.findByTestId(pluginId).scrollIntoView().
+        findByText(message).should('be.visible');
+}
+
+function pluginEnableToggleTestId(pluginId) {
+    return `PluginSettings.PluginStates.${pluginId.replace(/\./g, '+')}.Enable-button`;
+}
+
+function pluginSettingInputTestId(pluginId, settingKey) {
+    return `PluginSettings.Plugins.${pluginId.replace(/\./g, '+')}.${settingKey}input`;
+}

e2e-tests/cypress/tests/integration/channels/plugins/plugin_startup_fail_spec.js

@@ -0,0 +1,56 @@
+// 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.
+// ***************************************************************
+
+/**
+ * Note: This spec requires "gitlabPlugin" file at fixtures folder.
+ * See details at "e2e/cypress/tests/utils/plugins.js", download the file
+ * from the given "@url" and save as indicated in the "@filename"
+ * under fixtures folder.
+ */
+
+// Group: @channels @system_console @plugin @not_cloud @timeout_error
+
+import * as TIMEOUTS from '@/fixtures/timeouts';
+import {gitlabPlugin} from '@/utils/plugins';
+
+describe('If plugins fail to start, they can be disabled', () => {
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+        cy.apiRemovePluginById(gitlabPlugin.id);
+
+        // # Visit plugin management in the system console
+        cy.visit('/admin_console/plugins/plugin_management');
+        cy.get('.admin-console__header', {timeout: TIMEOUTS.ONE_MIN}).should('be.visible').and('have.text', 'Plugin Management');
+    });
+
+    it('MM-T2391 If plugins fail to start, they can be disabled', () => {
+        const mimeType = 'application/gzip';
+        cy.fixture(gitlabPlugin.filename, null).
+            then(Cypress.Blob.arrayBufferToBlob).
+            then((fileContent) => {
+                cy.get('input[type=file]').attachFile({fileContent, fileName: gitlabPlugin.filename, mimeType});
+            });
+
+        // # Enable GitLab plugin
+        cy.findByTestId(gitlabPlugin.id, {timeout: TIMEOUTS.FIVE_MIN}).scrollIntoView().should('be.visible').within(() => {
+            // * Verify GitLab Plugin title is shown
+            cy.waitUntil(() => cy.get('strong').scrollIntoView().should('be.visible').then((title) => {
+                return title[0].innerText === 'GitLab';
+            }));
+
+            // # Click on Enable link
+            cy.findByText('Enable').click();
+            cy.findByText('This plugin failed to start. must have a GitLab oauth client id').should('be.visible');
+
+            cy.findByText('Disable').click();
+            cy.findByText('This plugin is not enabled.').should('be.visible');
+        });
+    });
+});

e2e-tests/cypress/tests/integration/channels/plugins/upgrade_spec.js

@@ -0,0 +1,165 @@
+// 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.
+// ***************************************************************
+
+/**
+ * Note: This spec requires "demoPlugin" and "demoPluginOld" files
+ * at fixtures folder.
+ * See details at "e2e/cypress/tests/utils/plugins.js", download the files
+ * from the given "@url" and save as indicated in the "@filename"
+ * under fixtures folder.
+ */
+
+// Group: @channels @system_console @plugin @plugins_uninstall @not_cloud
+
+import {waitForAlertMessage} from './helpers';
+
+import * as TIMEOUTS from '@/fixtures/timeouts';
+import {demoPlugin, demoPluginOld} from '@/utils/plugins';
+
+describe('Plugin remains enabled when upgraded', () => {
+    before(() => {
+        cy.shouldNotRunOnCloudEdition();
+        cy.shouldHavePluginUploadEnabled();
+        cy.apiUninstallAllPlugins();
+
+        // # Visit plugin management in the system console
+        cy.visit('/admin_console/plugins/plugin_management');
+        cy.get('.admin-console__header', {timeout: TIMEOUTS.ONE_MIN}).should('be.visible').and('have.text', 'Plugin Management');
+    });
+
+    it('MM-T40 Plugin remains enabled when upgraded', () => {
+        // # Set plugin settings
+        const newSettings = {
+            ServiceSettings: {
+                EnableGifPicker: true,
+            },
+            FileSettings: {
+                EnablePublicLink: true,
+            },
+        };
+        cy.apiUpdateConfig(newSettings);
+
+        // * Upload Demo plugin from the browser
+        const mimeType = 'application/gzip';
+        cy.fixture(demoPluginOld.filename, 'binary').
+            then(Cypress.Blob.binaryStringToBlob).
+            then((fileContent) => {
+                cy.get('input[type=file]').attachFile({fileContent, fileName: demoPluginOld.filename, mimeType});
+            });
+
+        // * Verify the old demo plugin is installed after selecting the file
+        waitForServerStatus(demoPluginOld.id, demoPluginOld.version, {isInstalled: true});
+
+        // * Verify that the old demo plugin is successfully uploaded
+        cy.findByText(`Successfully uploaded plugin from ${demoPluginOld.filename}`);
+
+        // # Enable demo plugin
+        doTaskOnPlugin(demoPluginOld.id, () => {
+            // * Verify Demo Plugin title is shown
+            cy.waitUntil(() => cy.get('strong').scrollIntoView().should('be.visible').then((title) => {
+                return title[0].innerText === 'Demo Plugin';
+            }));
+
+            // # Click on Enable link
+            cy.findByText('Enable').click();
+        });
+
+        // * Verify older version of demo plugin
+        cy.findByText(new RegExp(`${demoPluginOld.id} - ${demoPluginOld.version}`)).scrollIntoView().should('be.visible');
+
+        cy.findByText('Click or drop plugin bundle to upload').scrollIntoView().should('be.visible');
+
+        // # Upgrade plugin
+        cy.fixture(demoPlugin.filename, 'binary').
+            then(Cypress.Blob.binaryStringToBlob).
+            then((fileContent) => {
+                cy.get('input[type=file]').attachFile({fileContent, fileName: demoPlugin.filename, mimeType});
+            });
+
+        // # Review and confirm overwrite of plugin with same name
+        cy.findByTestId('plugin-upload-overwrite-review').should('be.visible').within(() => {
+            cy.findByText('This upload upgrades the existing plugin.').should('be.visible');
+            cy.findByText(`v${demoPluginOld.version} \u2192 v${demoPlugin.version}`).should('be.visible');
+        });
+        cy.get('#confirmModalButton').should('be.visible').click();
+
+        // * Verify that the latest demo plugin is uploaded and remains active after overwrite
+        waitForServerStatus(demoPlugin.id, demoPlugin.version, {isActive: true});
+
+        // * Verify that the latest demo plugin is successfully uploaded
+        cy.findByText(`Successfully updated plugin from ${demoPlugin.filename}`);
+
+        // * Verify plugin is running
+        waitForAlertMessage(demoPlugin.id, 'This plugin is running.');
+
+        // * Verify latest version of demo plugin
+        cy.findByText(new RegExp(`${demoPlugin.id} - ${demoPlugin.version}`)).scrollIntoView().should('be.visible');
+    });
+
+    it('MM-T39 Disable Plugin on Removal', () => {
+        const {id: pluginId, url: pluginUrl, version} = demoPlugin;
+
+        // # Install demo plugin and enable it
+        cy.apiUploadAndEnablePlugin({url: pluginUrl, id: pluginId});
+        waitForServerStatus(pluginId, version, {isActive: true});
+        cy.findByTestId(pluginId).scrollIntoView().should('be.visible');
+        waitForAlertMessage(pluginId, 'This plugin is running.');
+
+        // # Remove demo plugin
+        cy.apiRemovePluginById(pluginId);
+        waitForServerStatus(pluginId, version, {isInstalled: false});
+        cy.findByTestId(pluginId).should('not.exist');
+
+        // # Install demo plugin again
+        cy.apiInstallPluginFromUrl(demoPlugin.url, true);
+        waitForServerStatus(pluginId, version, {isInstalled: true});
+
+        cy.apiGetPluginStatus(pluginId).then((data) => {
+            // * Confirm demo plugin is uploaded but not active/enabled
+            expect(data.isInstalled).to.be.true;
+            expect(data.isActive).to.be.false;
+        });
+
+        // * Verify demo plugin is installed but disabled
+        cy.findByTestId(pluginId).scrollIntoView().should('be.visible');
+        waitForAlertMessage(pluginId, 'This plugin is not enabled.');
+    });
+});
+
+function doTaskOnPlugin(pluginId, taskCallback) {
+    cy.findByText(/Installed Plugins/).scrollIntoView().should('be.visible');
+    cy.findByTestId(pluginId).scrollIntoView().should('be.visible').within(() => {
+        // # Perform task
+        taskCallback();
+    });
+}
+
+function waitForServerStatus(pluginId, version, state = {}) {
+    const checkFn = () => {
+        cy.log(`Waiting for ${pluginId}`);
+        return cy.apiGetPluginStatus(pluginId, version).then((status) => {
+            if (Object.hasOwn(state, 'isActive')) {
+                return state.isActive === status.isActive;
+            }
+
+            if (Object.hasOwn(state, 'isInstalled')) {
+                return state.isInstalled === status.isInstalled;
+            }
+
+            return false;
+        });
+    };
+
+    const options = {
+        timeout: TIMEOUTS.TWO_MIN,
+        interval: TIMEOUTS.FIVE_SEC,
+    };
+
+    return cy.waitUntil(checkFn, options);
+}