chore: migrate flaky cypress test to playwright (#35468)

Co-authored-by: Mattermost Build <build@mattermost.com>
2026-08-26 21:27:40 -05:00 · 2026-03-06 13:48:00 +08:00
parent c513d04e7e
commit cbe7669851
4 changed files with 81 additions and 82 deletions
@@ -1,81 +0,0 @@
-// 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 @team_settings
-
-import * as TIMEOUTS from '../../../fixtures/timeouts';
-
-describe('Teams Settings', () => {
-    let testTeam;
-
-    before(() => {
-        // # Update config
-        cy.apiUpdateConfig({EmailSettings: {RequireEmailVerification: false}});
-
-        cy.apiInitSetup().then(({team}) => {
-            testTeam = team;
-
-            cy.visit(`/${testTeam.name}/channels/town-square`);
-        });
-    });
-
-    it('MM-T391 Remove team icon', () => {
-        // # Open team settings dialog
-        openTeamSettingsDialog();
-
-        // # Upload a file on center view
-        cy.findByTestId('uploadPicture').attachFile('mattermost-icon.png');
-
-        // * Save
-        cy.uiSave();
-
-        // * Verify team icon
-        cy.get('#teamIconImage').should('be.visible');
-        cy.get('#teamIconInitial').should('not.exist');
-
-        cy.wait(TIMEOUTS.QUARTER_SEC);
-
-        // # Close the team settings dialog
-        cy.uiClose();
-
-        // # Open the team settings dialog
-        openTeamSettingsDialog();
-
-        // # Click on 'Remove Image' button to remove the image
-        cy.findByTestId('removeImageButton').should('be.visible').click();
-
-        // # Close the modal
-        cy.uiClose();
-
-        // # Open the team settings dialog
-        openTeamSettingsDialog();
-
-        // * After removing the team icon initial team holder is visible but not team icon holder
-        cy.get('#teamIconImage').should('not.exist');
-        cy.get('#teamIconInitial').should('be.visible');
-    });
-});
-
-function openTeamSettingsDialog() {
-    // # Open team menu and click 'Team Settings'
-    cy.uiOpenTeamMenu('Team settings');
-
-    // * Verify the team settings dialog is open
-    cy.get('#teamSettingsModal').should('be.visible');
-    cy.get('.modal-title').should('be.visible').and('contain', 'Team Settings');
-
-    cy.get('.team-picture-section').within(() => {
-        // * Verify the edit icon is visible
-        cy.get('.icon-pencil-outline').should('be.visible');
-
-        // # Click on edit button
-        cy.get('.icon-pencil-outline').click();
-    });
-}
@@ -0,0 +1,14 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import fs from 'fs';
+import path from 'path';
+
+const availableAssets = fs.readdirSync(__dirname).filter((file) => !file.endsWith('.ts'));
+
+export function getAsset(filename: string): string {
+    if (!availableAssets.includes(filename)) {
+        throw new Error(`Asset "${filename}" not found. Available: ${availableAssets.join(', ')}`);
+    }
+    return path.join(__dirname, filename);
+}
@@ -0,0 +1,63 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import {getAsset} from '@/asset';
+import {ChannelsPage, expect, test} from '@mattermost/playwright-lib';
+
+/**
+ * MM-T391: Remove team icon
+ * @objective Verify team icon can be uploaded, removed, and removal persists after reopening the modal
+ */
+test('MM-T391 Remove team icon', async ({pw}) => {
+    // # Set up admin user and login
+    const {adminUser, adminClient, team} = await pw.initSetup();
+    const {page} = await pw.testBrowser.login(adminUser);
+    const channelsPage = new ChannelsPage(page);
+
+    // # Navigate to team
+    await channelsPage.goto(team.name);
+
+    // # Open Team Settings Modal
+    let teamSettings = await channelsPage.openTeamSettings();
+    const infoSettings = teamSettings.infoSettings;
+
+    // # Upload team icon via UI
+    await infoSettings.uploadIcon(getAsset('mattermost-icon_128x128.png'));
+
+    // # Save changes
+    await teamSettings.save();
+    await teamSettings.verifySavedMessage();
+
+    // * Verify icon was set via API
+    const teamWithIcon = await adminClient.getTeam(team.id);
+    expect(teamWithIcon.last_team_icon_update).toBeGreaterThan(0);
+
+    // # Close modal and wait for it to disappear
+    await teamSettings.close();
+    await expect(teamSettings.container).not.toBeVisible();
+
+    // # Reopen Team Settings Modal
+    teamSettings = await channelsPage.openTeamSettings();
+
+    // * Verify team icon image is visible and initial is not
+    await expect(infoSettings.teamIconImage).toBeVisible();
+    await expect(infoSettings.teamIconInitial).not.toBeVisible();
+
+    // # Click remove icon
+    await infoSettings.removeIcon();
+
+    // * Verify icon was removed via API
+    const teamAfterRemove = await adminClient.getTeam(team.id);
+    expect(teamAfterRemove.last_team_icon_update || 0).toBe(0);
+
+    // # Close modal and wait for it to disappear
+    await teamSettings.close();
+    await expect(teamSettings.container).not.toBeVisible();
+
+    // # Reopen Team Settings Modal to confirm removal persisted
+    teamSettings = await channelsPage.openTeamSettings();
+
+    // * Verify icon was removed - initial is shown, image is not
+    await expect(infoSettings.teamIconInitial).toBeVisible();
+    await expect(infoSettings.teamIconImage).not.toBeVisible();
+});
@@ -14,7 +14,10 @@
        "strictNullChecks": true,
        "skipLibCheck": true,
        "noEmit": true,
-        "baseUrl": "."
+        "baseUrl": ".",
+        "paths": {
+            "@/asset": ["./asset"]
+        }
    },
    "include": ["./**/*"],
    "exclude": ["node_modules", "playwright-report", "lib"]