From b2603701f5bc1a98f9714fcee2da6898553c2fa8 Mon Sep 17 00:00:00 2001 From: Janaina Coelho Date: Tue, 12 Sep 2023 16:41:01 -0300 Subject: [PATCH 1/4] test:Add two more tests, create non private and readonly --- .../tests/e2e/page-objects/home-team.ts | 10 ++++++- apps/meteor/tests/e2e/team-management.spec.ts | 26 +++++++++++++++++-- 2 files changed, 33 insertions(+), 3 deletions(-) diff --git a/apps/meteor/tests/e2e/page-objects/home-team.ts b/apps/meteor/tests/e2e/page-objects/home-team.ts index 24e8396979c9..36e0d0df2833 100644 --- a/apps/meteor/tests/e2e/page-objects/home-team.ts +++ b/apps/meteor/tests/e2e/page-objects/home-team.ts @@ -1,6 +1,6 @@ import type { Locator, Page } from '@playwright/test'; -import { HomeContent, HomeSidenav, HomeFlextab } from './fragments'; +import { HomeContent, HomeFlextab, HomeSidenav } from './fragments'; export class HomeTeam { private readonly page: Page; @@ -30,4 +30,12 @@ export class HomeTeam { get btnTeamCreate(): Locator { return this.page.locator('role=dialog >> role=group >> role=button[name=Create]'); } + + get private(): Locator { + return this.page.locator('label > i').first(); + } + + get readonly(): Locator { + return this.page.locator('label > i').nth(1); + } } diff --git a/apps/meteor/tests/e2e/team-management.spec.ts b/apps/meteor/tests/e2e/team-management.spec.ts index ee2220966d8d..9ebecd3f6595 100644 --- a/apps/meteor/tests/e2e/team-management.spec.ts +++ b/apps/meteor/tests/e2e/team-management.spec.ts @@ -3,7 +3,7 @@ import { faker } from '@faker-js/faker'; import { Users } from './fixtures/userStates'; import { HomeTeam } from './page-objects'; import { createTargetChannel } from './utils'; -import { test, expect } from './utils/test'; +import { expect, test } from './utils/test'; test.use({ storageState: Users.admin.state }); @@ -11,6 +11,8 @@ test.describe.serial('teams-management', () => { let poHomeTeam: HomeTeam; let targetChannel: string; const targetTeam = faker.string.uuid(); + const targetTeamNonPrivate = faker.string.uuid(); + const targetTeamReadOnly = faker.string.uuid(); test.beforeAll(async ({ api }) => { targetChannel = await createTargetChannel(api); @@ -22,7 +24,7 @@ test.describe.serial('teams-management', () => { await page.goto('/home'); }); - test('expect create "targetTeam"', async ({ page }) => { + test('expect create "targetTeam" private', async ({ page }) => { await poHomeTeam.sidenav.openNewByLabel('Team'); await poHomeTeam.inputTeamName.type(targetTeam); await poHomeTeam.addMember('user1'); @@ -31,6 +33,26 @@ test.describe.serial('teams-management', () => { await expect(page).toHaveURL(`/group/${targetTeam}`); }); + test('expect create "targetTeamNonPrivate" non private', async ({ page }) => { + await poHomeTeam.sidenav.openNewByLabel('Team'); + await poHomeTeam.inputTeamName.type(targetTeamNonPrivate); + await poHomeTeam.private.click(); + await poHomeTeam.addMember('user1'); + await poHomeTeam.btnTeamCreate.click(); + + await expect(page).toHaveURL(`/channel/${targetTeamNonPrivate}`); + }); + + test('expect create "targetTeamReadOnly" readonly', async ({ page }) => { + await poHomeTeam.sidenav.openNewByLabel('Team'); + await poHomeTeam.inputTeamName.type(targetTeamReadOnly); + await poHomeTeam.readonly.click(); + await poHomeTeam.addMember('user1'); + await poHomeTeam.btnTeamCreate.click(); + + await expect(page).toHaveURL(`/group/${targetTeamReadOnly}`); + }); + test('expect throw validation error if team name already exists', async () => { await poHomeTeam.sidenav.openNewByLabel('Team'); await poHomeTeam.inputTeamName.type(targetTeam); From d961af57edee91ae0e89ada363a1f756180e2e39 Mon Sep 17 00:00:00 2001 From: Janaina Coelho Date: Thu, 14 Sep 2023 09:49:01 -0300 Subject: [PATCH 2/4] test: fix locators --- apps/meteor/tests/e2e/page-objects/home-team.ts | 8 ++++---- apps/meteor/tests/e2e/team-management.spec.ts | 4 ++-- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/meteor/tests/e2e/page-objects/home-team.ts b/apps/meteor/tests/e2e/page-objects/home-team.ts index 36e0d0df2833..81e5ed5ab88a 100644 --- a/apps/meteor/tests/e2e/page-objects/home-team.ts +++ b/apps/meteor/tests/e2e/page-objects/home-team.ts @@ -31,11 +31,11 @@ export class HomeTeam { return this.page.locator('role=dialog >> role=group >> role=button[name=Create]'); } - get private(): Locator { - return this.page.locator('label > i').first(); + get checkboxPrivateChannel(): Locator { + return this.page.locator('input[type=checkbox] + i').nth(0); } - get readonly(): Locator { - return this.page.locator('label > i').nth(1); + get checkboxReadOnly(): Locator { + return this.page.locator('input[type=checkbox] + i').nth(1); } } diff --git a/apps/meteor/tests/e2e/team-management.spec.ts b/apps/meteor/tests/e2e/team-management.spec.ts index 9ebecd3f6595..2a90877078ed 100644 --- a/apps/meteor/tests/e2e/team-management.spec.ts +++ b/apps/meteor/tests/e2e/team-management.spec.ts @@ -36,7 +36,7 @@ test.describe.serial('teams-management', () => { test('expect create "targetTeamNonPrivate" non private', async ({ page }) => { await poHomeTeam.sidenav.openNewByLabel('Team'); await poHomeTeam.inputTeamName.type(targetTeamNonPrivate); - await poHomeTeam.private.click(); + await poHomeTeam.checkboxPrivateChannel.click(); await poHomeTeam.addMember('user1'); await poHomeTeam.btnTeamCreate.click(); @@ -46,7 +46,7 @@ test.describe.serial('teams-management', () => { test('expect create "targetTeamReadOnly" readonly', async ({ page }) => { await poHomeTeam.sidenav.openNewByLabel('Team'); await poHomeTeam.inputTeamName.type(targetTeamReadOnly); - await poHomeTeam.readonly.click(); + await poHomeTeam.checkboxReadOnly.click(); await poHomeTeam.addMember('user1'); await poHomeTeam.btnTeamCreate.click(); From 55bffa93f411338a9f0140ec5e3f656bb5591df3 Mon Sep 17 00:00:00 2001 From: Janaina Coelho Date: Thu, 14 Sep 2023 11:13:35 -0300 Subject: [PATCH 3/4] test: put acessebility for create team modal --- .../header/CreateTeam/CreateTeamModal.tsx | 95 ++++++++++++++----- .../tests/e2e/page-objects/home-team.ts | 8 +- apps/meteor/tests/e2e/team-management.spec.ts | 8 +- 3 files changed, 77 insertions(+), 34 deletions(-) diff --git a/apps/meteor/client/sidebar/header/CreateTeam/CreateTeamModal.tsx b/apps/meteor/client/sidebar/header/CreateTeam/CreateTeamModal.tsx index 1f12c2b59b49..9907aa788894 100644 --- a/apps/meteor/client/sidebar/header/CreateTeam/CreateTeamModal.tsx +++ b/apps/meteor/client/sidebar/header/CreateTeam/CreateTeamModal.tsx @@ -1,15 +1,16 @@ -import { Box, Modal, Button, TextInput, Field, ToggleSwitch, FieldGroup, Icon } from '@rocket.chat/fuselage'; +import { Box, Button, Field, FieldGroup, Icon, Modal, TextInput, ToggleSwitch } from '@rocket.chat/fuselage'; +import { useUniqueId } from '@rocket.chat/fuselage-hooks'; import { - useTranslation, - useSetting, - usePermission, useEndpoint, - useToastMessageDispatch, + usePermission, usePermissionWithScopedRoles, + useSetting, + useToastMessageDispatch, + useTranslation, } from '@rocket.chat/ui-contexts'; import type { ComponentProps, ReactElement } from 'react'; -import React, { memo, useMemo, useEffect } from 'react'; -import { useForm, Controller } from 'react-hook-form'; +import React, { memo, useEffect, useMemo } from 'react'; +import { Controller, useForm } from 'react-hook-form'; import UserAutoCompleteMultiple from '../../../components/UserAutoCompleteMultiple'; import { goToRoomById } from '../../../lib/utils/goToRoomById'; @@ -129,18 +130,35 @@ const CreateTeamModal = ({ onClose }: { onClose: () => void }): ReactElement => } }; + const createTeamFormId = useUniqueId(); + const nameId = useUniqueId(); + const topicId = useUniqueId(); + const privateId = useUniqueId(); + const readOnlyId = useUniqueId(); + const encryptedId = useUniqueId(); + const broadcastId = useUniqueId(); + const addMembersId = useUniqueId(); + return ( - ) => }> + ) => ( + + )} + > - {t('Teams_New_Title')} + {t('Teams_New_Title')} - {t('Teams_New_Name_Label')} + + {t('Teams_New_Name_Label')} + void }): ReactElement => placeholder={t('Team_Name')} addon={} error={errors.name?.message} + aria-describedby={`${nameId}-error`} + aria-required='true' /> - {errors?.name && {errors.name.message}} + {errors?.name && ( + + {errors.name.message} + + )} - + {t('Teams_New_Description_Label')}{' '} ({t('optional')}) - + - {t('Teams_New_Private_Label')} - + {t('Teams_New_Private_Label')} + {isPrivate ? t('Teams_New_Private_Description_Enabled') : t('Teams_New_Private_Description_Disabled')} @@ -176,7 +205,7 @@ const CreateTeamModal = ({ onClose }: { onClose: () => void }): ReactElement => control={control} name='isPrivate' render={({ field: { onChange, value, ref } }): ReactElement => ( - + )} /> @@ -184,8 +213,8 @@ const CreateTeamModal = ({ onClose }: { onClose: () => void }): ReactElement => - {t('Teams_New_Read_only_Label')} - + {t('Teams_New_Read_only_Label')} + {readOnly ? t('Only_authorized_users_can_write_new_messages') : t('Teams_New_Read_only_Description')} @@ -193,7 +222,14 @@ const CreateTeamModal = ({ onClose }: { onClose: () => void }): ReactElement => control={control} name='readOnly' render={({ field: { onChange, value, ref } }): ReactElement => ( - + )} /> @@ -201,8 +237,8 @@ const CreateTeamModal = ({ onClose }: { onClose: () => void }): ReactElement => - {t('Teams_New_Encrypted_Label')} - + {t('Teams_New_Encrypted_Label')} + {isPrivate ? t('Teams_New_Encrypted_Description_Enabled') : t('Teams_New_Encrypted_Description_Disabled')} @@ -210,7 +246,14 @@ const CreateTeamModal = ({ onClose }: { onClose: () => void }): ReactElement => control={control} name='encrypted' render={({ field: { onChange, value, ref } }): ReactElement => ( - + )} /> @@ -218,20 +261,20 @@ const CreateTeamModal = ({ onClose }: { onClose: () => void }): ReactElement => - {t('Teams_New_Broadcast_Label')} - {t('Teams_New_Broadcast_Description')} + {t('Teams_New_Broadcast_Label')} + {t('Teams_New_Broadcast_Description')} ( - + )} /> - + {t('Teams_New_Add_members_Label')}{' '} ({t('optional')}) diff --git a/apps/meteor/tests/e2e/page-objects/home-team.ts b/apps/meteor/tests/e2e/page-objects/home-team.ts index 81e5ed5ab88a..9c890da05db8 100644 --- a/apps/meteor/tests/e2e/page-objects/home-team.ts +++ b/apps/meteor/tests/e2e/page-objects/home-team.ts @@ -31,11 +31,11 @@ export class HomeTeam { return this.page.locator('role=dialog >> role=group >> role=button[name=Create]'); } - get checkboxPrivateChannel(): Locator { - return this.page.locator('input[type=checkbox] + i').nth(0); + get textPrivate(): Locator { + return this.page.locator('role=dialog[name="Create Team"] >> label >> text="Private"'); } - get checkboxReadOnly(): Locator { - return this.page.locator('input[type=checkbox] + i').nth(1); + get textReadOnly(): Locator { + return this.page.locator('role=dialog[name="Create Team"] >> label >> text="Read Only"'); } } diff --git a/apps/meteor/tests/e2e/team-management.spec.ts b/apps/meteor/tests/e2e/team-management.spec.ts index 2a90877078ed..b2626628dd14 100644 --- a/apps/meteor/tests/e2e/team-management.spec.ts +++ b/apps/meteor/tests/e2e/team-management.spec.ts @@ -33,20 +33,20 @@ test.describe.serial('teams-management', () => { await expect(page).toHaveURL(`/group/${targetTeam}`); }); - test('expect create "targetTeamNonPrivate" non private', async ({ page }) => { + test.only('expect create "targetTeamNonPrivate" non private', async ({ page }) => { await poHomeTeam.sidenav.openNewByLabel('Team'); await poHomeTeam.inputTeamName.type(targetTeamNonPrivate); - await poHomeTeam.checkboxPrivateChannel.click(); + await poHomeTeam.textPrivate.click(); await poHomeTeam.addMember('user1'); await poHomeTeam.btnTeamCreate.click(); await expect(page).toHaveURL(`/channel/${targetTeamNonPrivate}`); }); - test('expect create "targetTeamReadOnly" readonly', async ({ page }) => { + test.only('expect create "targetTeamReadOnly" readonly', async ({ page }) => { await poHomeTeam.sidenav.openNewByLabel('Team'); await poHomeTeam.inputTeamName.type(targetTeamReadOnly); - await poHomeTeam.checkboxReadOnly.click(); + await poHomeTeam.textReadOnly.click(); await poHomeTeam.addMember('user1'); await poHomeTeam.btnTeamCreate.click(); From 1853841be721da12afd627fae05cfdab43ff3e9d Mon Sep 17 00:00:00 2001 From: Janaina Coelho Date: Thu, 14 Sep 2023 11:15:04 -0300 Subject: [PATCH 4/4] test: remove only --- apps/meteor/tests/e2e/team-management.spec.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/meteor/tests/e2e/team-management.spec.ts b/apps/meteor/tests/e2e/team-management.spec.ts index b2626628dd14..338f5c5eb0ef 100644 --- a/apps/meteor/tests/e2e/team-management.spec.ts +++ b/apps/meteor/tests/e2e/team-management.spec.ts @@ -33,7 +33,7 @@ test.describe.serial('teams-management', () => { await expect(page).toHaveURL(`/group/${targetTeam}`); }); - test.only('expect create "targetTeamNonPrivate" non private', async ({ page }) => { + test('expect create "targetTeamNonPrivate" non private', async ({ page }) => { await poHomeTeam.sidenav.openNewByLabel('Team'); await poHomeTeam.inputTeamName.type(targetTeamNonPrivate); await poHomeTeam.textPrivate.click(); @@ -43,7 +43,7 @@ test.describe.serial('teams-management', () => { await expect(page).toHaveURL(`/channel/${targetTeamNonPrivate}`); }); - test.only('expect create "targetTeamReadOnly" readonly', async ({ page }) => { + test('expect create "targetTeamReadOnly" readonly', async ({ page }) => { await poHomeTeam.sidenav.openNewByLabel('Team'); await poHomeTeam.inputTeamName.type(targetTeamReadOnly); await poHomeTeam.textReadOnly.click();