test: improve e2ee encryption tests to use page objects

apps/meteor/tests/e2e/e2e-encryption/e2ee-key-reset.spec.ts

@@ -26,7 +26,6 @@ test.describe('E2EE Key Reset', () => {
 		await api.post('/settings/E2E_Allow_Unencrypted_Messages', { value: true });
 		await api.post('/settings/E2E_Enabled_Default_DirectRooms', { value: false });
 		await api.post('/settings/E2E_Enabled_Default_PrivateRooms', { value: false });
-		await api.post('/im.delete', { username: 'user2' });
 	});
 
 	test.beforeEach(async ({ browser, page }) => {

apps/meteor/tests/e2e/e2e-encryption/e2ee-legacy-format.spec.ts

@@ -4,6 +4,7 @@ import type { APIRequestContext } from '@playwright/test';
 import { BASE_API_URL } from '../config/constants';
 import { Users } from '../fixtures/userStates';
 import { HomeChannel } from '../page-objects';
+import { EncryptedRoomPage } from '../page-objects/encrypted-room';
 import { preserveSettings } from '../utils/preserveSettings';
 import { test, expect } from '../utils/test';
 
@@ -34,6 +35,7 @@ const sendEncryptedMessage = async (request: APIRequestContext, rid: string, enc
 
 test.describe('E2EE Legacy Format', () => {
 	let poHomeChannel: HomeChannel;
+	let encryptedRoomPage: EncryptedRoomPage;
 
 	test.use({ storageState: Users.userE2EE.state });
 
@@ -42,11 +44,11 @@ test.describe('E2EE Legacy Format', () => {
 		await api.post('/settings/E2E_Allow_Unencrypted_Messages', { value: true });
 		await api.post('/settings/E2E_Enabled_Default_DirectRooms', { value: false });
 		await api.post('/settings/E2E_Enabled_Default_PrivateRooms', { value: false });
-		await api.post('/im.delete', { username: 'user2' });
 	});
 
 	test.beforeEach(async ({ page }) => {
 		poHomeChannel = new HomeChannel(page);
+		encryptedRoomPage = new EncryptedRoomPage(page);
 		await page.goto('/home');
 	});
 
@@ -83,6 +85,6 @@ test.describe('E2EE Legacy Format', () => {
 		await sendEncryptedMessage(request, rid, kid + encryptedMessage);
 
 		await expect(poHomeChannel.content.lastUserMessageBody).toHaveText('world');
-		await expect(poHomeChannel.content.lastUserMessage.locator('.rcx-icon--name-key')).toBeVisible();
+		await expect(encryptedRoomPage.lastMessage.encryptedIcon).toBeVisible();
 	});
 });

apps/meteor/tests/e2e/e2e-encryption/e2ee-server-settings.spec.ts

@@ -3,6 +3,7 @@ import { faker } from '@faker-js/faker';
 import { IS_EE } from '../config/constants';
 import { Users } from '../fixtures/userStates';
 import { HomeChannel } from '../page-objects';
+import { EncryptedRoomPage } from '../page-objects/encrypted-room';
 import { preserveSettings } from '../utils/preserveSettings';
 import { test, expect } from '../utils/test';
 
@@ -17,6 +18,7 @@ preserveSettings(settingsList);
 
 test.describe('E2EE Server Settings', () => {
 	let poHomeChannel: HomeChannel;
+	let encryptedRoomPage: EncryptedRoomPage;
 
 	test.use({ storageState: Users.userE2EE.state });
 
@@ -30,6 +32,7 @@ test.describe('E2EE Server Settings', () => {
 
 	test.beforeEach(async ({ page }) => {
 		poHomeChannel = new HomeChannel(page);
+		encryptedRoomPage = new EncryptedRoomPage(page);
 		await page.goto('/home');
 	});
 
@@ -46,11 +49,11 @@ test.describe('E2EE Server Settings', () => {
 		await poHomeChannel.content.sendMessage('This is an encrypted message.');
 
 		await expect(poHomeChannel.content.lastUserMessageBody).toHaveText('This is an encrypted message.');
-		await expect(poHomeChannel.content.lastUserMessage.locator('.rcx-icon--name-key')).toBeVisible();
+		await expect(encryptedRoomPage.lastMessage.encryptedIcon).toBeVisible();
 
-		await page.locator('[name="msg"]').type('/');
+		await poHomeChannel.content.inputMessage.pressSequentially('/');
 		await expect(page.locator('#popup-item-contextualbar')).not.toHaveClass(/disabled/);
-		await page.locator('[name="msg"]').clear();
+		await poHomeChannel.content.inputMessage.clear();
 
 		await poHomeChannel.content.dispatchSlashCommand('/contextualbar');
 		await expect(poHomeChannel.btnContextualbarClose).toBeVisible();
@@ -62,9 +65,11 @@ test.describe('E2EE Server Settings', () => {
 	test.describe('un-encrypted messages not allowed in e2ee rooms', () => {
 		test.skip(!IS_EE, 'Premium Only');
 		let poHomeChannel: HomeChannel;
+		let encryptedRoomPage: EncryptedRoomPage;
 
 		test.beforeEach(async ({ page }) => {
 			poHomeChannel = new HomeChannel(page);
+			encryptedRoomPage = new EncryptedRoomPage(page);
 			await page.goto('/home');
 		});
 
@@ -88,9 +93,9 @@ test.describe('E2EE Server Settings', () => {
 			await poHomeChannel.content.sendMessage('This is an encrypted message.');
 
 			await expect(poHomeChannel.content.lastUserMessageBody).toHaveText('This is an encrypted message.');
-			await expect(poHomeChannel.content.lastUserMessage.locator('.rcx-icon--name-key')).toBeVisible();
+			await expect(encryptedRoomPage.lastMessage.encryptedIcon).toBeVisible();
 
-			await page.locator('[name="msg"]').pressSequentially('/');
+			await poHomeChannel.content.inputMessage.pressSequentially('/');
 			await expect(page.locator('#popup-item-contextualbar')).toHaveClass(/disabled/);
 		});
 	});

apps/meteor/tests/e2e/page-objects/fragments/home-content.ts

@@ -102,6 +102,14 @@ export class HomeContent {
 		return this.mainMessageList.locator('[role="listitem"][aria-roledescription="message"][data-sequential="false"]').last();
 	}
 
+	getUserMention(username: string): Locator {
+		return this.page.locator('[title="Mentions user"]', { hasText: username });
+	}
+
+	getChannelMention(channelName: string): Locator {
+		return this.page.locator('[title="Mentions channel"]', { hasText: channelName });
+	}
+
 	get encryptedRoomHeaderIcon(): Locator {
 		return this.page.locator('.rcx-room-header i.rcx-icon--name-key');
 	}

apps/meteor/tests/e2e/page-objects/fragments/index.ts

@@ -6,6 +6,8 @@ export * from './sidepanel';
 export * from './modals';
 export * from './toast-messages';
 export * from './menu';
+export * from './pinned-messages-tab';
+export * from './starred-messages-tab';
 export * from './table';
 export * from './toolbar';
 export * from './composer';

apps/meteor/tests/e2e/page-objects/fragments/message.ts

@@ -14,4 +14,14 @@ export class Message {
 	get encryptedIcon() {
 		return this.root.locator('.rcx-icon--name-key');
 	}
+
+	get moreButton() {
+		return this.root.getByRole('button', { name: 'More' });
+	}
+
+	async openMenu(): Promise<void> {
+		await this.root.hover();
+		await this.moreButton.waitFor();
+		await this.moreButton.click();
+	}
 }

apps/meteor/tests/e2e/page-objects/fragments/pinned-messages-tab.ts

@@ -0,0 +1,30 @@
+import type { Locator, Page } from '@playwright/test';
+
+import { Message } from './message';
+import { RoomToolbar } from './toolbar';
+import { expect } from '../../utils/test';
+
+export class PinnedMessagesTab {
+	readonly root: Locator;
+
+	private readonly roomToolbar: RoomToolbar;
+
+	constructor(page: Page) {
+		this.root = page.getByRole('dialog', { name: 'Pinned Messages' });
+		this.roomToolbar = new RoomToolbar(page);
+	}
+
+	get lastMessage(): Message {
+		return new Message(this.root.locator('[data-qa-type="message"]').last());
+	}
+
+	async openTab(): Promise<void> {
+		await this.roomToolbar.openMoreOptions();
+		await this.roomToolbar.menuItemPinnedMessages.click();
+		await expect(this.root).toBeVisible();
+	}
+
+	async openLastMessageMenu(): Promise<void> {
+		await this.lastMessage.openMenu();
+	}
+}

apps/meteor/tests/e2e/page-objects/fragments/starred-messages-tab.ts

@@ -0,0 +1,30 @@
+import type { Locator, Page } from '@playwright/test';
+
+import { Message } from './message';
+import { RoomToolbar } from './toolbar';
+import { expect } from '../../utils/test';
+
+export class StarredMessagesTab {
+	readonly root: Locator;
+
+	private readonly roomToolbar: RoomToolbar;
+
+	constructor(page: Page) {
+		this.root = page.getByRole('dialog', { name: 'Starred Messages' });
+		this.roomToolbar = new RoomToolbar(page);
+	}
+
+	get lastMessage(): Message {
+		return new Message(this.root.locator('[data-qa-type="message"]').last());
+	}
+
+	async openTab(): Promise<void> {
+		await this.roomToolbar.openMoreOptions();
+		await this.roomToolbar.menuItemStarredMessages.click();
+		await expect(this.root).toBeVisible();
+	}
+
+	async openLastMessageMenu(): Promise<void> {
+		await this.lastMessage.openMenu();
+	}
+}