MM-63820 chore(e2e): update dependencies and docs (#30807)

* chore(e2e): update dependencies and docs

* update the use of postMessage, expose 8065 on test server and fix flakiness on profile popover

e2e-tests/playwright/lib/package.json

@@ -45,24 +45,24 @@
     "@axe-core/playwright": "4.10.1",
     "@mattermost/client": "file:../../../webapp/platform/client",
     "@mattermost/types": "file:../../../webapp/platform/types",
-    "@percy/cli": "1.30.9",
-    "@percy/playwright": "1.0.7",
+    "@percy/cli": "1.30.10",
+    "@percy/playwright": "1.0.8",
     "async-wait-until": "2.0.27",
     "axe-core": "4.10.3",
     "deepmerge": "4.3.1",
-    "dotenv": "16.4.7",
+    "dotenv": "16.5.0",
     "mime-types": "3.0.1",
     "uuid": "11.1.0"
   },
   "devDependencies": {
     "@rollup/plugin-typescript": "12.1.2",
     "@types/mime-types": "2.1.4",
-    "@types/node": "22.14.0",
-    "@types/react": "19.1.0",
-    "rollup": "4.39.0",
+    "@types/node": "22.14.1",
+    "@types/react": "19.1.2",
+    "rollup": "4.40.0",
     "rollup-plugin-copy": "3.5.0"
   },
   "peerDependencies": {
-    "@playwright/test": "1.51.1"
+    "@playwright/test": "1.52.0"
   }
 }

e2e-tests/playwright/lib/src/global_setup.ts

@@ -94,11 +94,20 @@ async function printClientInfo(client: Client4) {
   - TelemetryId                 = ${config.TelemetryId}
   - ServiceEnvironment          = ${config.ServiceEnvironment}`);
 
-    const {LogSettings, ServiceSettings} = await client.getConfig();
+    const {LogSettings, ServiceSettings, FeatureFlags} = await client.getConfig();
     // eslint-disable-next-line no-console
     console.log(`Notable Server Config:
   - ServiceSettings.EnableSecurityFixAlert  = ${ServiceSettings?.EnableSecurityFixAlert}
   - LogSettings.EnableDiagnostics           = ${LogSettings?.EnableDiagnostics}`);
+
+    // eslint-disable-next-line no-console
+    console.log('Feature Flags:');
+    // eslint-disable-next-line no-console
+    console.log(
+        Object.entries(FeatureFlags)
+            .map(([key, value]) => `  - ${key} = ${value}`)
+            .join('\n'),
+    );
 }
 
 async function printPluginDetails(client: Client4) {

e2e-tests/playwright/lib/src/server/default_config.ts

@@ -277,6 +277,7 @@ const defaultServerConfig: AdminConfig = {
         FileCompress: false,
         FileMaxQueueSize: 1000,
         AdvancedLoggingJSON: {},
+        Certificate: '',
     },
     NotificationLogSettings: {
         EnableConsole: true,
@@ -783,4 +784,8 @@ const defaultServerConfig: AdminConfig = {
         DisableSharedChannelsStatusSync: false,
         MaxPostsPerSync: 50,
     },
+    AccessControlSettings: {
+        EnableAttributeBasedAccessControl: false,
+        EnableChannelScopeAccessControl: false,
+    },
 };

e2e-tests/playwright/lib/src/ui/components/channels/center_view.ts

@@ -50,6 +50,10 @@ export default class ChannelsCenterView {
         await this.postCreate.toBeVisible();
     }
 
+    async postMessage(message: string, files?: string[]) {
+        await this.postCreate.postMessage(message, files);
+    }
+
     /**
      * Click on "See all scheduled messages"
      */

e2e-tests/playwright/lib/src/ui/components/channels/sidebar_right.ts

@@ -45,6 +45,10 @@ export default class ChannelsSidebarRight {
         await expect(this.container).toBeVisible();
     }
 
+    async postMessage(message: string) {
+        await this.postCreate.postMessage(message);
+    }
+
     /**
      * Returns the RHS post by post id
      * @param postId Just the ID without the prefix

e2e-tests/playwright/lib/src/ui/pages/channels.ts

@@ -3,7 +3,7 @@
 
 import {expect, Page} from '@playwright/test';
 
-import {components} from '@/ui/components';
+import {ChannelsPost, components} from '@/ui/components';
 
 export default class ChannelsPage {
     readonly channels = 'Channels';
@@ -89,9 +89,10 @@ export default class ChannelsPage {
     /**
      * `postMessage` posts a message in the current channel
      * @param message Message to post
+     * @param files Files to attach to the message
      */
-    async postMessage(message: string) {
-        await this.centerView.postCreate.postMessage(message);
+    async postMessage(message: string, files?: string[]) {
+        await this.centerView.postMessage(message, files);
     }
 
     async openUserAccountMenu() {
@@ -106,4 +107,16 @@ export default class ChannelsPage {
         await expect(this.profileModal.container).toBeVisible();
         return this.profileModal;
     }
+
+    async openProfilePopover(post: ChannelsPost) {
+        // Find and click the post's user avatar to open the profile popover
+        await post.hover();
+        await post.profileIcon.click();
+
+        // Wait for the profile popover to be visible
+        const popover = this.userProfilePopover;
+        await expect(popover.container).toBeVisible();
+
+        return popover;
+    }
 }