Skip to content

test: Reorg flextabs locators #38533

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
dionisio-bot merged 24 commits into from
Apr 7, 2026
Merged

test: Reorg flextabs locators #38533

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
19fb422
chore: reorg flextabs
dougfabris Feb 24, 2026
97af390
test: fix tests
dougfabris Feb 6, 2026
40dc556
chore: refactor RoomInfoFlexTab to use MenuMore instead of Listbox
dougfabris Feb 9, 2026
a94e22c
chore: refactor flextabs to improve structure and functionality
dougfabris Feb 9, 2026
68f87a8
chore: update prune-messages flex tab to use label locators and modal…
dougfabris Feb 9, 2026
dba8410
chore: refactor feature preview tests to utilize HomeDiscussion page …
dougfabris Feb 9, 2026
80ae5d8
chore: refactor HomeChannel and HomeTeam to improve tabs structure an…
dougfabris Feb 24, 2026
e614e54
chore: update E2EE encryption test to use menu item for disabling enc…
dougfabris Feb 9, 2026
b3d85e4
chore: refactor RoomToolbar to utilize MenuOptions for menu item retr…
dougfabris Feb 9, 2026
78e1e10
chore: refactor EditRoomFlexTab to simplify checkbox locators and add…
dougfabris Feb 9, 2026
1ce9e3d
chore: fix dialog name in NotificationPreferencesFlexTab constructor
dougfabris Feb 9, 2026
c96e38f
refactor: update InfoPanelField component to use Box props and simpli…
dougfabris Feb 23, 2026
c79fd68
test: update disableEncryption method to use menuItemDisabledE2EEncry…
dougfabris Feb 23, 2026
e8d30d5
refactor: rename menu item accessors for E2E encryption in toolbar an…
dougfabris Feb 24, 2026
7cc04bb
test: reduce e2ee tests flakiness
dougfabris Feb 24, 2026
7aee286
Merge branch 'develop' into test/reorg-flextabs
dougfabris Mar 23, 2026
2f2c8dd
Merge branch 'develop' into test/reorg-flextabs
dougfabris Apr 2, 2026
41d060d
fix(tests): re-skip profile update test due to intermittencies
dougfabris Apr 2, 2026
d0a986c
refactor(tests): remove unnecessary waitForIt calls in E2EE tests
dougfabris Apr 3, 2026
fad7b5a
refactor: consolidate modal imports and remove unused ConfirmDeleteRo…
dougfabris Apr 5, 2026
a4bb9ac
test: update avatar prefix checks to use toHaveAttribute for improved…
dougfabris Apr 5, 2026
0d17a52
fix: update Locator import to use '@playwright/test' for consistency
dougfabris Apr 5, 2026
d94d810
refactor: rename userName getter to username for consistency
dougfabris Apr 7, 2026
e093616
refactor: simplify constructor parameters for RoomInfoFlexTab and its…
dougfabris Apr 7, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 10 additions & 4 deletions apps/meteor/client/components/UserInfo/UserInfo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import {
} from '@rocket.chat/ui-client';
import type { TranslationKey } from '@rocket.chat/ui-contexts';
import type { ReactElement, ReactNode } from 'react';
import { memo } from 'react';
import { memo, useId } from 'react';
import { useTranslation } from 'react-i18next';

import { useTimeAgo } from '../../hooks/useTimeAgo';
Expand Down Expand Up @@ -84,6 +84,8 @@ const UserInfo = ({
const userDisplayName = useUserDisplayName({ name, username });
const userCustomFields = useUserCustomFields(customFields);

const usernameId = useId();

return (
<ContextualbarScrollableContent p={24} {...props}>
<InfoPanel>
Expand Down Expand Up @@ -128,9 +130,13 @@ const UserInfo = ({
)}

{username && username !== name && (
<InfoPanelField>
<InfoPanelLabel>{t('Username')}</InfoPanelLabel>
<InfoPanelText data-qa='UserInfoUserName'>{username}</InfoPanelText>
<InfoPanelField is='dl'>
<InfoPanelLabel is='dt' id={usernameId}>
{t('Username')}
</InfoPanelLabel>
<InfoPanelText is='dd' aria-labelledby={usernameId}>
{username}
</InfoPanelText>
</InfoPanelField>
)}

Expand Down
60 changes: 32 additions & 28 deletions apps/meteor/client/components/UserInfo/__snapshots__/UserInfo.spec.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -164,21 +164,22 @@ exports[`renders Default without crashing 1`] = `
</span>
</div>
</div>
<div
<dl
class="rcx-box rcx-box--full rcx-css-1jagyun"
>
<div
<dt
class="rcx-box rcx-box--full rcx-css-1n8o8rn"
id=":r1:"
>
Username
</div>
<div
</dt>
<dd
aria-labelledby=":r1:"
class="rcx-box rcx-box--full rcx-css-6hwe8l rcx-css-faoni4"
data-qa="UserInfoUserName"
>
guilherme.gazzo
</div>
</div>
</dd>
</dl>
<div
class="rcx-box rcx-box--full rcx-css-1jagyun"
>
Expand Down Expand Up @@ -467,21 +468,22 @@ exports[`renders InvitedUser without crashing 1`] = `
</span>
</div>
</div>
<div
<dl
class="rcx-box rcx-box--full rcx-css-1jagyun"
>
<div
<dt
class="rcx-box rcx-box--full rcx-css-1n8o8rn"
id=":r3:"
>
Username
</div>
<div
</dt>
<dd
aria-labelledby=":r3:"
class="rcx-box rcx-box--full rcx-css-6hwe8l rcx-css-faoni4"
data-qa="UserInfoUserName"
>
guilherme.gazzo
</div>
</div>
</dd>
</dl>
<div
class="rcx-box rcx-box--full rcx-css-1jagyun"
>
Expand Down Expand Up @@ -784,21 +786,22 @@ exports[`renders WithABACAttributes without crashing 1`] = `
</span>
</div>
</div>
<div
<dl
class="rcx-box rcx-box--full rcx-css-1jagyun"
>
<div
<dt
class="rcx-box rcx-box--full rcx-css-1n8o8rn"
id=":r5:"
>
Username
</div>
<div
</dt>
<dd
aria-labelledby=":r5:"
class="rcx-box rcx-box--full rcx-css-6hwe8l rcx-css-faoni4"
data-qa="UserInfoUserName"
>
guilherme.gazzo
</div>
</div>
</dd>
</dl>
<div
class="rcx-box rcx-box--full rcx-css-1jagyun"
>
Expand Down Expand Up @@ -1147,21 +1150,22 @@ exports[`renders WithVoiceCallExtension without crashing 1`] = `
</span>
</div>
</div>
<div
<dl
class="rcx-box rcx-box--full rcx-css-1jagyun"
>
<div
<dt
class="rcx-box rcx-box--full rcx-css-1n8o8rn"
id=":r7:"
>
Username
</div>
<div
</dt>
<dd
aria-labelledby=":r7:"
class="rcx-box rcx-box--full rcx-css-6hwe8l rcx-css-faoni4"
data-qa="UserInfoUserName"
>
guilherme.gazzo
</div>
</div>
</dd>
</dl>
<div
class="rcx-box rcx-box--full rcx-css-1jagyun"
>
Expand Down
6 changes: 5 additions & 1 deletion apps/meteor/client/views/teams/contextualBar/channels/AddExistingModal/AddExistingModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ type AddExistingModalProps = {
reload?: () => void;
};

// TODO: Use GenericModal instead of Modal
const AddExistingModal = ({ teamId, onClose, reload }: AddExistingModalProps) => {
const { t } = useTranslation();
const dispatchToastMessage = useToastMessageDispatch();
Expand Down Expand Up @@ -61,7 +62,10 @@ const AddExistingModal = ({ teamId, onClose, reload }: AddExistingModalProps) =>
);

return (
<Modal wrapperFunction={(props) => <Box is='form' onSubmit={handleSubmit(handleAddChannels)} {...props} />}>
<Modal
aria-label={t('Team_Add_existing_channels')}
wrapperFunction={(props) => <Box is='form' onSubmit={handleSubmit(handleAddChannels)} {...props} />}
>
<ModalHeader>
<ModalTitle>{t('Team_Add_existing_channels')}</ModalTitle>
<ModalClose onClick={onClose} />
Expand Down
4 changes: 2 additions & 2 deletions apps/meteor/tests/e2e/account-profile.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,9 +37,9 @@ test.describe.serial('settings-account-profile', () => {
await expect(poHomeChannel.content.lastUserMessageNotSequential).toContainText(newUsername);

await poHomeChannel.content.lastUserMessageNotSequential.locator('figure').click();
await poHomeChannel.content.linkUserCard.click();
await poHomeChannel.userCard.openUserInfo();

await expect(poHomeChannel.tabs.userInfoUsername).toHaveText(newUsername);
await expect(poHomeChannel.tabs.userInfo.username).toHaveText(newUsername);
});

test.describe('Avatar', () => {
Expand Down
4 changes: 2 additions & 2 deletions apps/meteor/tests/e2e/avatar-settings.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,12 +86,12 @@ test.describe('avatar-settings', () => {
testAvatars(poHomeChannel, channelName, avatarUrl);

test('expect message avatar to have provider prefix', async () => {
expect(poHomeChannel.content.lastUserMessage.locator('img').getAttribute('src')).toBe(avatarUrl);
await expect(poHomeChannel.content.lastUserMessage.locator('img')).toHaveAttribute('src', avatarUrl);
});

test('expect user card avatar to have provider prefix', async () => {
await poHomeChannel.content.lastUserMessage.locator('.rcx-message-header__name-container').click();
expect(poHomeChannel.content.userCard.locator('img').getAttribute('src')).toBe(avatarUrl);
await expect(poHomeChannel.userCard.imgUserCard).toHaveAttribute('src', avatarUrl);
});
});
});
Expand Down
38 changes: 19 additions & 19 deletions apps/meteor/tests/e2e/channel-management.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,48 +62,48 @@ test.describe.serial('channel-management', () => {
await poHomeChannel.navbar.openChat(targetChannel);
await poHomeChannel.roomToolbar.openRoomInfo();
await poHomeChannel.tabs.room.btnEdit.click();
await poHomeChannel.tabs.room.inputTopic.fill('hello-topic-edited');
await poHomeChannel.tabs.room.btnSave.click();
await poHomeChannel.tabs.editRoom.inputTopic.fill('hello-topic-edited');
await poHomeChannel.tabs.editRoom.btnSave.click();

await poHomeChannel.toastMessage.dismissToast();
await poHomeChannel.roomToolbar.openRoomInfo();

await expect(poHomeChannel.tabs.room.panelChannelInfo).toContainText('hello-topic-edited');
await expect(poHomeChannel.tabs.room.root).toContainText('hello-topic-edited');
await expect(poHomeChannel.content.getSystemMessageByText('changed room topic to hello-topic-edited')).toBeVisible();
});

test('should edit announcement of targetChannel', async () => {
await poHomeChannel.navbar.openChat(targetChannel);
await poHomeChannel.roomToolbar.openRoomInfo();
await poHomeChannel.tabs.room.btnEdit.click();
await poHomeChannel.tabs.room.inputAnnouncement.fill('hello-announcement-edited');
await poHomeChannel.tabs.room.btnSave.click();
await poHomeChannel.tabs.editRoom.inputAnnouncement.fill('hello-announcement-edited');
await poHomeChannel.tabs.editRoom.btnSave.click();

await poHomeChannel.toastMessage.dismissToast();
await poHomeChannel.roomToolbar.openRoomInfo();
await expect(poHomeChannel.tabs.room.panelChannelInfo).toContainText('hello-announcement-edited');
await expect(poHomeChannel.tabs.room.root).toContainText('hello-announcement-edited');
await expect(poHomeChannel.content.getSystemMessageByText('changed room announcement to: hello-announcement-edited')).toBeVisible();
});

test('should edit description of targetChannel', async () => {
await poHomeChannel.navbar.openChat(targetChannel);
await poHomeChannel.roomToolbar.openRoomInfo();
await poHomeChannel.tabs.room.btnEdit.click();
await poHomeChannel.tabs.room.inputDescription.fill('hello-description-edited');
await poHomeChannel.tabs.room.btnSave.click();
await poHomeChannel.tabs.editRoom.inputDescription.fill('hello-description-edited');
await poHomeChannel.tabs.editRoom.btnSave.click();

await poHomeChannel.toastMessage.dismissToast();
await poHomeChannel.roomToolbar.openRoomInfo();
await expect(poHomeChannel.tabs.room.panelChannelInfo).toContainText('hello-description-edited');
await expect(poHomeChannel.tabs.room.root).toContainText('hello-description-edited');
await expect(poHomeChannel.content.getSystemMessageByText('changed room description to: hello-description-edited')).toBeVisible();
});

test('should edit name of targetChannel', async ({ page }) => {
await poHomeChannel.navbar.openChat(targetChannel);
await poHomeChannel.roomToolbar.openRoomInfo();
await poHomeChannel.tabs.room.btnEdit.click();
await poHomeChannel.tabs.room.inputName.fill(`NAME-EDITED-${targetChannel}`);
await poHomeChannel.tabs.room.btnSave.click();
await poHomeChannel.tabs.editRoom.inputName.fill(`NAME-EDITED-${targetChannel}`);
await poHomeChannel.tabs.editRoom.btnSave.click();

targetChannel = `NAME-EDITED-${targetChannel}`;
await expect(page.getByRole('main').getByRole('heading', { name: targetChannel })).toBeVisible();
Expand All @@ -117,8 +117,8 @@ test.describe.serial('channel-management', () => {
await poHomeChannel.navbar.openChat(targetChannel);
await poHomeChannel.roomToolbar.openRoomInfo();
await poHomeChannel.tabs.room.btnEdit.click();
await poHomeChannel.tabs.room.inputName.fill(hugeName);
await poHomeChannel.tabs.room.btnSave.click();
await poHomeChannel.tabs.editRoom.inputName.fill(hugeName);
await poHomeChannel.tabs.editRoom.btnSave.click();
targetChannel = hugeName;

await page.setViewportSize({ width: 640, height: 460 });
Expand Down Expand Up @@ -166,8 +166,8 @@ test.describe.serial('channel-management', () => {

test('should edit notification preferences of targetChannel', async () => {
await poHomeChannel.navbar.openChat(targetChannel);
await poHomeChannel.tabs.kebab.click({ force: true });
await poHomeChannel.tabs.btnNotificationPreferences.click({ force: true });
await poHomeChannel.roomToolbar.openMoreOptions();
await poHomeChannel.roomToolbar.menuItemNotificationsPreferences.click();
await poHomeChannel.tabs.notificationPreferences.updateAllNotificationPreferences();
await poHomeChannel.tabs.notificationPreferences.btnSave.click();

Expand Down Expand Up @@ -256,8 +256,8 @@ test.describe.serial('channel-management', () => {
await poHomeChannel.tabs.members.showAllUsers();
await poHomeChannel.tabs.members.ignoreUser('user1');

await poHomeChannel.tabs.members.openMoreActions();
await expect(poHomeChannel.tabs.members.getMenuItemAction('Unignore')).toBeVisible();
await poHomeChannel.tabs.members.userInfo.openMoreActions();
await expect(poHomeChannel.tabs.members.userInfo.menu.getMenuItem('Unignore')).toBeVisible();
await page.keyboard.press('Escape');

const user1Channel = new HomeChannel(user1Page);
Expand Down Expand Up @@ -296,8 +296,8 @@ test.describe.serial('channel-management', () => {
await poHomeChannel.tabs.members.showAllUsers();
await poHomeChannel.tabs.members.unignoreUser('user1');

await poHomeChannel.tabs.members.openMoreActions();
await expect(poHomeChannel.tabs.members.getMenuItemAction('Ignore')).toBeVisible();
await poHomeChannel.tabs.members.userInfo.openMoreActions();
await expect(poHomeChannel.tabs.members.userInfo.menu.getMenuItem('Ignore')).toBeVisible();
await page.keyboard.press('Escape');

await user1Channel.content.sendMessage('message after being unignored');
Expand Down
35 changes: 16 additions & 19 deletions apps/meteor/tests/e2e/e2e-encryption/e2ee-encrypted-channels.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,10 +51,8 @@ test.describe('E2EE Encrypted Channels', () => {
await expect(poHomeChannel.content.lastUserMessage.locator('.rcx-icon--name-key')).toBeVisible();
await toastMessages.dismissToast();

await poHomeChannel.tabs.kebab.click({ force: true });

await expect(poHomeChannel.tabs.btnDisableE2E).toBeVisible();
await poHomeChannel.tabs.btnDisableE2E.click({ force: true });
await poHomeChannel.roomToolbar.openMoreOptions();
await poHomeChannel.roomToolbar.menuItemDisableE2EEncryption.click();
await expect(page.getByRole('dialog', { name: 'Disable encryption' })).toBeVisible();
await page.getByRole('button', { name: 'Disable encryption' }).click();
await poHomeChannel.toastMessage.dismissToast();
Expand All @@ -65,9 +63,9 @@ test.describe('E2EE Encrypted Channels', () => {
await expect(poHomeChannel.content.lastUserMessageBody).toHaveText('hello world not encrypted');
await expect(poHomeChannel.content.lastUserMessage.locator('.rcx-icon--name-key')).not.toBeVisible();

await poHomeChannel.tabs.kebab.click({ force: true });
await expect(poHomeChannel.tabs.btnEnableE2E).toBeVisible();
await poHomeChannel.tabs.btnEnableE2E.click({ force: true });
await poHomeChannel.roomToolbar.openMoreOptions();
await expect(poHomeChannel.roomToolbar.menuItemEnableE2EEncryption).toBeVisible();
await poHomeChannel.roomToolbar.menuItemEnableE2EEncryption.click();
await expect(page.getByRole('dialog', { name: 'Enable encryption' })).toBeVisible();
await page.getByRole('button', { name: 'Enable encryption' }).click();
await poHomeChannel.toastMessage.dismissToast();
Expand Down Expand Up @@ -142,12 +140,12 @@ test.describe('E2EE Encrypted Channels', () => {
await poHomeChannel.toastMessage.waitForDisplay();
await poHomeChannel.toastMessage.dismissToast();

await poHomeChannel.tabs.kebab.click();
await poHomeChannel.roomToolbar.openMoreOptions();
// TODO(@jessicaschelly/@dougfabris): fix this flaky behavior
if (!(await poHomeChannel.tabs.btnEnableE2E.isVisible())) {
await poHomeChannel.tabs.kebab.click();
if (!(await poHomeChannel.roomToolbar.menuItemEnableE2EEncryption.isVisible())) {
await poHomeChannel.roomToolbar.openMoreOptions();
}
await poHomeChannel.tabs.btnEnableE2E.click();
await poHomeChannel.roomToolbar.menuItemEnableE2EEncryption.click();
await expect(page.getByRole('dialog', { name: 'Enable encryption' })).toBeVisible();
await page.getByRole('button', { name: 'Enable encryption' }).click();
await page.waitForTimeout(1000);
Expand Down Expand Up @@ -243,9 +241,9 @@ test.describe('E2EE Encrypted Channels', () => {
await poHomeChannel.content.sendMessage('second unencrypted message');

// Encrypt channel
await poHomeChannel.tabs.kebab.click({ force: true });
await expect(poHomeChannel.tabs.btnEnableE2E).toBeVisible();
await poHomeChannel.tabs.btnEnableE2E.click({ force: true });
await poHomeChannel.roomToolbar.openMoreOptions();
await expect(poHomeChannel.roomToolbar.menuItemEnableE2EEncryption).toBeVisible();
await poHomeChannel.roomToolbar.menuItemEnableE2EEncryption.click();
await expect(page.getByRole('dialog', { name: 'Enable encryption' })).toBeVisible();
await page.getByRole('button', { name: 'Enable encryption' }).click();
await page.waitForTimeout(1000);
Expand Down Expand Up @@ -301,8 +299,8 @@ test.describe('E2EE Encrypted Channels', () => {
await poHomeChannel.toastMessage.waitForDisplay();
await poHomeChannel.toastMessage.dismissToast();

await poHomeChannel.tabs.kebab.click();
await poHomeChannel.tabs.btnPinnedMessagesList.click();
await poHomeChannel.roomToolbar.openMoreOptions();
await poHomeChannel.roomToolbar.menuItemPinnedMessages.click();

await expect(page.getByRole('dialog', { name: 'Pinned Messages' })).toBeVisible();

Expand All @@ -317,9 +315,8 @@ test.describe('E2EE Encrypted Channels', () => {
await expect(page.locator('role=menuitem[name="Copy link"]')).toHaveClass(/disabled/);

await poHomeChannel.btnContextualbarClose.click();

await poHomeChannel.tabs.kebab.click();
await poHomeChannel.tabs.btnStarredMessageList.click();
await poHomeChannel.roomToolbar.openMoreOptions();
await poHomeChannel.roomToolbar.menuItemStarredMessages.click();

const lastStarredMessage = page
.getByRole('dialog', { name: 'Starred Messages' })
Expand Down
Loading
Loading