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

e2e-tests/playwright/specs/functional/channels/mentions/preview_mention_popover.spec.ts

@@ -0,0 +1,60 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import {expect, setWysiwygUserPreference, test} from '@mattermost/playwright-lib';
+
+/**
+ * @objective Clicking a user at-mention in the composer preview opens the profile popover
+ * and does not post the draft.
+ *
+ * @precondition Two users on the same team. The markdown composer preview is available
+ * (WYSIWYG editor preference is off).
+ */
+test(
+    'MM-67123 clicking a user mention in composer preview opens the profile popover',
+    {tag: '@mentions'},
+    async ({pw}) => {
+        // # Create two users on the same team and disable the WYSIWYG editor so preview is available
+        const {adminClient, user, userClient, team} = await pw.initSetup();
+        await setWysiwygUserPreference(userClient, user.id, false);
+
+        const mentionedUser = await adminClient.createUser(await pw.random.user('mentioned'), '', '');
+        await adminClient.addToTeam(team.id, mentionedUser.id);
+        const townSquare = await adminClient.getChannelByName(team.id, 'town-square');
+        await adminClient.addToChannel(mentionedUser.id, townSquare.id);
+
+        const {channelsPage} = await pw.testBrowser.login(user);
+        await channelsPage.goto(team.name, 'town-square');
+        await channelsPage.toBeVisible();
+
+        const unique = `preview-mention-${pw.random.id()}`;
+        const {postCreate} = channelsPage.centerView;
+
+        // # Type a draft that mentions the other user via autocomplete so the mention resolves
+        await postCreate.writeMessage(`@${mentionedUser.username}`);
+        await expect(postCreate.suggestionList).toBeVisible();
+        await postCreate.suggestionOptions.first().click();
+        await postCreate.input.pressSequentially(` ${unique}`);
+        const draft = await postCreate.getInputValue();
+
+        // # Show the composer markdown preview
+        await postCreate.togglePreview();
+        await expect(postCreate.previewArea).toBeVisible();
+        await expect(postCreate.previewArea).toContainText(`@${mentionedUser.username}`);
+        await expect(postCreate.previewArea).toContainText(unique);
+
+        // # Click the rendered mention in the preview
+        await postCreate.clickMentionInPreview();
+
+        // * The mentioned user's profile popover opens
+        await expect(channelsPage.userProfilePopover.container).toBeVisible();
+        await expect(channelsPage.userProfilePopover.container).toContainText(`@${mentionedUser.username}`);
+
+        // * The draft remains in the composer and is not posted
+        await expect(postCreate.input).toHaveValue(draft);
+        await expect(postCreate.previewArea).toContainText(unique);
+
+        const lastPost = await channelsPage.getLastPost();
+        await expect(lastPost.container).not.toContainText(unique);
+    },
+);