diff --git a/.yarnrc.yml b/.yarnrc.yml index 155880f91223..d5cd2a9e7967 100644 --- a/.yarnrc.yml +++ b/.yarnrc.yml @@ -13,5 +13,3 @@ plugins: spec: '@yarnpkg/plugin-typescript' yarnPath: .yarn/releases/yarn-3.2.0.cjs - -checksumBehavior: 'update' diff --git a/apps/meteor/client/views/omnichannel/departments/DepartmentsAgentsTable.js b/apps/meteor/client/views/omnichannel/departments/DepartmentsAgentsTable.js index f62fd6931838..09cef271a255 100644 --- a/apps/meteor/client/views/omnichannel/departments/DepartmentsAgentsTable.js +++ b/apps/meteor/client/views/omnichannel/departments/DepartmentsAgentsTable.js @@ -16,7 +16,7 @@ function DepartmentsAgentsTable({ agents, setAgentListFinal, setAgentsAdded, set return ( <> - + diff --git a/apps/meteor/client/views/omnichannel/departments/EditDepartment.js b/apps/meteor/client/views/omnichannel/departments/EditDepartment.js index e1f3826c13da..f14f849ce062 100644 --- a/apps/meteor/client/views/omnichannel/departments/EditDepartment.js +++ b/apps/meteor/client/views/omnichannel/departments/EditDepartment.js @@ -280,7 +280,7 @@ function EditDepartment({ data, id, title, reload, allowedToForwardData }) { - + {t('Enabled')} @@ -290,17 +290,30 @@ function EditDepartment({ data, id, title, reload, allowedToForwardData }) { {t('Name')}* - + {t('Description')} - + - + {t('Show_on_registration_page')} @@ -311,6 +324,7 @@ function EditDepartment({ data, id, title, reload, allowedToForwardData }) { {t('Email')}* - + {t('Show_on_offline_page')} @@ -332,6 +346,7 @@ function EditDepartment({ data, id, title, reload, allowedToForwardData }) { {t('Livechat_DepartmentOfflineMessageToChannel')} )} - + {t('Request_tag_before_closing_chat')} - + @@ -415,7 +435,13 @@ function EditDepartment({ data, id, title, reload, allowedToForwardData }) { {t('Conversation_closing_tags')}* - + diff --git a/apps/meteor/tests/e2e/omnichannel-departaments.spec.ts b/apps/meteor/tests/e2e/omnichannel-departaments.spec.ts new file mode 100644 index 000000000000..697a06ee9bd1 --- /dev/null +++ b/apps/meteor/tests/e2e/omnichannel-departaments.spec.ts @@ -0,0 +1,73 @@ +import { test, Page, expect } from '@playwright/test'; + +import LoginPage from './utils/pageobjects/LoginPage'; +import SideNav from './utils/pageobjects/SideNav'; +import Departments from './utils/pageobjects/Departments'; +import { adminLogin } from './utils/mocks/userAndPasswordMock'; + +test.describe('[Department]', () => { + let loginPage: LoginPage; + let sideNav: SideNav; + let departments: Departments; + let page: Page; + test.beforeAll(async ({ browser }) => { + page = await browser.newPage(); + const basePath = '/'; + + await page.goto(basePath); + loginPage = new LoginPage(page); + sideNav = new SideNav(page); + departments = new Departments(page); + + await loginPage.login(adminLogin); + await sideNav.sidebarUserMenu().click(); + await sideNav.omnichannel().click(); + }); + + test.describe('[Render]', async () => { + test.beforeEach(async () => { + await departments.departmentsLink.click(); + await departments.btnNewDepartment.click(); + }); + test('expect show all inputs', async () => { + await departments.getAddScreen(); + }); + }); + test.describe('[Actions]', async () => { + test.beforeEach(async () => { + await departments.departmentsLink.click(); + }); + test.describe('[Create and Edit]', async () => { + test.afterEach(async () => { + await departments.toastSuccess.click(); + }); + + test('expect new department is created', async () => { + await departments.btnNewDepartment.click(); + await departments.doAddDepartments(); + await expect(departments.departmentAdded).toBeVisible(); + }); + + test('expect department is edited', async () => { + await departments.departmentAdded.click(); + await departments.doEditDepartments(); + await expect(departments.departmentAdded).toHaveText('any_name_edit'); + }); + }); + test.describe('[Delete department]', () => { + test.beforeEach(async () => { + await departments.btnTableDeleteDepartment.click(); + }); + test('expect dont show dialog on cancel delete department', async () => { + await departments.btnModalCancelDeleteDepartment.click(); + await expect(departments.modalDepartment).not.toBeVisible(); + await expect(departments.departmentAdded).toBeVisible(); + }); + test('expect delete departments', async () => { + await departments.btnModalDeleteDepartment.click(); + await expect(departments.modalDepartment).not.toBeVisible(); + await expect(departments.departmentAdded).not.toBeVisible(); + }); + }); + }); +}); diff --git a/apps/meteor/tests/e2e/utils/pageobjects/Administration.ts b/apps/meteor/tests/e2e/utils/pageobjects/Administration.ts index d61ba6c522b8..3df941244c7a 100644 --- a/apps/meteor/tests/e2e/utils/pageobjects/Administration.ts +++ b/apps/meteor/tests/e2e/utils/pageobjects/Administration.ts @@ -675,10 +675,6 @@ export default class Administration extends BasePage { return this.getPage().locator('.section:nth-of-type(2) .rc-button.rc-button--nude'); } - public toastSuccess(): Locator { - return this.getPage().locator('.toast-success'); - } - public modalCancel(): Locator { return this.getPage().locator('//button[text()="Cancel"]'); } diff --git a/apps/meteor/tests/e2e/utils/pageobjects/BasePage.ts b/apps/meteor/tests/e2e/utils/pageobjects/BasePage.ts index 6b2f85211cf1..d920c3fcc5cd 100644 --- a/apps/meteor/tests/e2e/utils/pageobjects/BasePage.ts +++ b/apps/meteor/tests/e2e/utils/pageobjects/BasePage.ts @@ -1,4 +1,4 @@ -import { Page } from '@playwright/test'; +import { Page, Locator } from '@playwright/test'; class BasePage { private page: Page; @@ -22,5 +22,9 @@ class BasePage { public async keyboardPress(key: string): Promise { await this.getPage().keyboard.press(key); } + + get toastSuccess(): Locator { + return this.getPage().locator('#toast-container'); + } } export default BasePage; diff --git a/apps/meteor/tests/e2e/utils/pageobjects/Departments.ts b/apps/meteor/tests/e2e/utils/pageobjects/Departments.ts new file mode 100644 index 000000000000..09b6af0c147c --- /dev/null +++ b/apps/meteor/tests/e2e/utils/pageobjects/Departments.ts @@ -0,0 +1,130 @@ +import { Locator, expect } from '@playwright/test'; + +import BasePage from './BasePage'; + +export default class Departments extends BasePage { + get departmentsLink(): Locator { + return this.getPage().locator('a[href="omnichannel/departments"]'); + } + + get btnNewDepartment(): Locator { + return this.getPage().locator('button.rcx-button >> text="New"'); + } + + get btnSaveDepartment(): Locator { + return this.getPage().locator('button.rcx-button--primary.rcx-button >> text="Save"'); + } + + get btnBack(): Locator { + return this.getPage().locator('button.rcx-button >> text="Back"'); + } + + get enabledToggle(): Locator { + // temporary selector + return this.getPage().locator('[data-qa="DepartmentEditToggle-Enabled"] span label'); + } + + get nameInput(): Locator { + return this.getPage().locator('[data-qa="DepartmentEditTextInput-Name"]'); + } + + get descriptionInput(): Locator { + return this.getPage().locator('[data-qa="DepartmentEditTextInput-Description"]'); + } + + get showOnRegistrationPage(): Locator { + return this.getPage().locator('[data-qa="DepartmentEditToggle-ShowOnRegistrationPage"] span label'); + } + + get emailInput(): Locator { + return this.getPage().locator('[data-qa="DepartmentEditTextInput-Email"]'); + } + + get showOnOfflinePageToggle(): Locator { + return this.getPage().locator('[data-qa="DepartmentEditToggle-ShowOnOfflinePage"] span label'); + } + + get selectLiveChatDepartmentOfflineMessageToChannel(): Locator { + return this.getPage().locator('[data-qa="DepartmentSelect-LivechatDepartmentOfflineMessageToChannel"]'); + } + + get requestTagBeforeClosingChatToggle(): Locator { + return this.getPage().locator('[data-qa="DiscussionToggle-RequestTagBeforeCLosingChat"] span label'); + } + + get selectAgentsTable(): Locator { + return this.getPage().locator('[data-qa="DepartmentSelect-AgentsTable"]'); + } + + get btnAddAgent(): Locator { + return this.getPage().locator('button.rcx-button--primary.rcx-button >> text="Add"'); + } + + public virtuosoOptions(option: string): Locator { + return this.getPage().locator(`[data-test-id="virtuoso-scroller"] .rcx-option >> text="${option}"`); + } + + get departmentAdded(): Locator { + return this.getPage().locator('table tr:first-child td:first-child '); + } + + get btnTableDeleteDepartment(): Locator { + return this.getPage().locator('table tr:first-child td:nth-child(6) button'); + } + + get btnModalCancelDeleteDepartment(): Locator { + return this.getPage().locator('#modal-root .rcx-modal .rcx-modal__footer .rcx-button--ghost'); + } + + get btnModalDeleteDepartment(): Locator { + return this.getPage().locator('#modal-root .rcx-modal .rcx-modal__footer .rcx-button--primary-danger'); + } + + get modalDepartment(): Locator { + return this.getPage().locator('#modal-root'); + } + + public async getAddScreen(): Promise { + const textInputs = [this.nameInput, this.descriptionInput, this.emailInput]; + const toggleButtons = [this.enabledToggle, this.showOnOfflinePageToggle, this.requestTagBeforeClosingChatToggle]; + const selects = [this.selectLiveChatDepartmentOfflineMessageToChannel, this.selectAgentsTable]; + const actionsButtons = [this.btnSaveDepartment, this.btnBack, this.btnAddAgent]; + const addScreenSelectors = [...textInputs, ...toggleButtons, ...actionsButtons, ...selects]; + + await Promise.all(addScreenSelectors.map((addScreenSelector) => expect(addScreenSelector).toBeVisible())); + } + + public async doAddAgent(): Promise { + await this.enabledToggle.click(); + await this.nameInput.type('rocket.cat'); + } + + public async doAddDepartments(): Promise { + await this.enabledToggle.click(); + await this.nameInput.type('any_name'); + await this.descriptionInput.type('any_description'); + await this.showOnOfflinePageToggle.click(); + await this.emailInput.type('any_email@mail.com'); + await this.showOnRegistrationPage.click(); + await this.selectLiveChatDepartmentOfflineMessageToChannel.click(); + await this.virtuosoOptions('general').click(); + await this.selectAgentsTable.click(); + await this.btnSaveDepartment.click(); + } + + public async doEditDepartments(): Promise { + await this.enabledToggle.click(); + await this.nameInput.click({ clickCount: 3 }); + await this.keyboardPress('Backspace'); + await this.nameInput.fill('any_name_edit'); + await this.descriptionInput.click({ clickCount: 3 }); + await this.keyboardPress('Backspace'); + await this.descriptionInput.fill('any_description_edited'); + await this.btnSaveDepartment.click(); + } + + public async doBackToPrincipalScreen(): Promise { + await this.departmentAdded.click(); + await this.btnBack.click(); + } +} diff --git a/apps/meteor/tests/e2e/utils/pageobjects/MainContent.ts b/apps/meteor/tests/e2e/utils/pageobjects/MainContent.ts index 5008609aaf8f..be835d133c45 100644 --- a/apps/meteor/tests/e2e/utils/pageobjects/MainContent.ts +++ b/apps/meteor/tests/e2e/utils/pageobjects/MainContent.ts @@ -412,10 +412,6 @@ export default class MainContent extends BasePage { await this.modalDeleteMessageButton().click(); } - public toastSuccess(): Locator { - return this.getPage().locator('.toast-message'); - } - public getQuotedMessage(): Locator { return this.getPage().locator('//li[@data-username="rocketchat.internal.admin.test"][last()]//blockquote//div[2]'); } diff --git a/apps/meteor/tests/e2e/utils/pageobjects/SideNav.ts b/apps/meteor/tests/e2e/utils/pageobjects/SideNav.ts index 52bcb57b974b..5781b67f8ca2 100644 --- a/apps/meteor/tests/e2e/utils/pageobjects/SideNav.ts +++ b/apps/meteor/tests/e2e/utils/pageobjects/SideNav.ts @@ -85,6 +85,10 @@ class SideNav extends BasePage { return this.getPage().locator('//li[@class="rcx-option"]//div[contains(text(), "Administration")]'); } + public omnichannel(): Locator { + return this.getPage().locator('li.rcx-option >> text="Omnichannel"'); + } + public logout(): Locator { return this.getPage().locator('//*[contains(@class, "rcx-option__content") and contains(text(), "Logout")]'); }