Skip to content

Commit

Permalink
test(Livechat): More Livechat Tests (#31995)
Browse files Browse the repository at this point in the history
  • Loading branch information
MartinSchoeler authored Mar 21, 2024
1 parent f39f61b commit c8b11da
Show file tree
Hide file tree
Showing 7 changed files with 319 additions and 26 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
import { faker } from '@faker-js/faker';

import { IS_EE } from '../config/constants';
import { createAuxContext } from '../fixtures/createAuxContext';
import { Users } from '../fixtures/userStates';
import { HomeOmnichannel, OmnichannelLiveChat } from '../page-objects';
import { createAgent } from '../utils/omnichannel/agents';
import { addAgentToDepartment, createDepartment } from '../utils/omnichannel/departments';
import { test, expect } from '../utils/test';

const firstUser = {
name: `${faker.person.firstName()} ${faker.string.uuid()}}`,
email: faker.internet.email(),
};

test.use({ storageState: Users.user1.state });

test.describe('OC - Livechat - Department Flow', () => {
// Needs Departments to test this, so needs an EE license for multiple deps
test.skip(!IS_EE, 'Enterprise Only');

let poLiveChat: OmnichannelLiveChat;
let poHomeOmnichannelAgent1: HomeOmnichannel;
let poHomeOmnichannelAgent2: HomeOmnichannel;
let departments: Awaited<ReturnType<typeof createDepartment>>[];
let departmentA: Awaited<ReturnType<typeof createDepartment>>['data'];
let departmentB: Awaited<ReturnType<typeof createDepartment>>['data'];
let agents: Awaited<ReturnType<typeof createDepartment>>[];
let agent1: Awaited<ReturnType<typeof createAgent>>['data'];
let agent2: Awaited<ReturnType<typeof createAgent>>['data'];

test.beforeAll(async ({ api }) => {
// Assign agents & departments
agents = await Promise.all([createAgent(api, 'user1'), createAgent(api, 'user2')]);
[agent1, agent2] = agents.map(({ data }) => data);
departments = await Promise.all([
createDepartment(api, { showOnRegistration: true }),
createDepartment(api, { showOnRegistration: true }),
]);
[departmentA, departmentB] = departments.map(({ data }) => data);
await addAgentToDepartment(api, { department: departmentA, agentId: agent1._id });
await addAgentToDepartment(api, { department: departmentB, agentId: agent2._id });
});

test.beforeEach(async ({ page, api, browser }) => {
// Create Pages
const { page: agent1Page } = await createAuxContext(browser, Users.user1, '/', true);
poHomeOmnichannelAgent1 = new HomeOmnichannel(agent1Page);
const { page: agent2Page } = await createAuxContext(browser, Users.user2, '/', true);
poHomeOmnichannelAgent2 = new HomeOmnichannel(agent2Page);

poLiveChat = new OmnichannelLiveChat(page, api);
await poLiveChat.page.goto('/livechat');
});

test.afterEach(async ({ page }) => {
await poHomeOmnichannelAgent1.page?.close();
await poHomeOmnichannelAgent2.page?.close();
await page.close();
});

test.afterAll(async ({ api }) => {
await expect((await api.post('/settings/Omnichannel_enable_department_removal', { value: true })).status()).toBe(200);
await Promise.all([...agents.map((agent) => agent.delete())]);
await Promise.all([...departments.map((department) => department.delete())]);
await expect((await api.post('/settings/Omnichannel_enable_department_removal', { value: false })).status()).toBe(200);
});

test('OC - Livechat - Chat with Department', async () => {
await test.step('expect start Chat with department', async () => {
await poLiveChat.openAnyLiveChat();
await poLiveChat.sendMessage(firstUser, false, departmentA.name);
await expect(poLiveChat.onlineAgentMessage).toBeVisible();
await poLiveChat.onlineAgentMessage.fill('this_a_test_message_from_user');
await poLiveChat.btnSendMessageToOnlineAgent.click();
await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_user"')).toBeVisible();
});

await test.step('expect message to be received by department', async () => {
await poHomeOmnichannelAgent1.sidenav.openChat(firstUser.name);
await expect(poHomeOmnichannelAgent1.content.lastUserMessage).toBeVisible();
await expect(poHomeOmnichannelAgent1.content.lastUserMessage).toContainText('this_a_test_message_from_user');
});

await test.step('expect message to be sent by department', async () => {
await poHomeOmnichannelAgent1.content.sendMessage('this_a_test_message_from_agent');
await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_agent"')).toBeVisible();
});
});

test('OC - Livechat - Change Department', async () => {
await test.step('expect start Chat with department', async () => {
await poLiveChat.openAnyLiveChat();
await poLiveChat.sendMessage(firstUser, false, departmentA.name);
await expect(poLiveChat.onlineAgentMessage).toBeVisible();
await poLiveChat.onlineAgentMessage.fill('this_a_test_message_from_user');
await poLiveChat.btnSendMessageToOnlineAgent.click();
await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_user"')).toBeVisible();
});

await test.step('expect to change department', async () => {
await poLiveChat.changeDepartment(departmentB.name);

// Expect keep chat history
await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_user"')).toBeVisible();

// Expect user to have changed
await expect(await poLiveChat.headerTitle.textContent()).toEqual(agent2.username);
});

await test.step('expect message to be received by department', async () => {
await poHomeOmnichannelAgent2.sidenav.openChat(firstUser.name);
await expect(poHomeOmnichannelAgent2.content.lastUserMessage).toBeVisible();
await expect(poHomeOmnichannelAgent2.content.lastUserMessage).toContainText('this_a_test_message_from_user');
});

await test.step('expect message to be sent by department', async () => {
await poHomeOmnichannelAgent2.content.sendMessage('this_a_test_message_from_agent');
await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_agent"')).toBeVisible();
});
});
});
119 changes: 114 additions & 5 deletions apps/meteor/tests/e2e/omnichannel/omnichannel-livechat.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { faker } from '@faker-js/faker';
import { createAuxContext } from '../fixtures/createAuxContext';
import { Users } from '../fixtures/userStates';
import { HomeOmnichannel, OmnichannelLiveChat } from '../page-objects';
import { createAgent } from '../utils/omnichannel/agents';
import { test, expect } from '../utils/test';

const firstUser = {
Expand Down Expand Up @@ -47,10 +48,10 @@ test.describe.serial('OC - Livechat', () => {
test('OC - Livechat - Send message to online agent', async () => {
await test.step('expect message to be sent by livechat', async () => {
await poLiveChat.page.reload();
await poLiveChat.openLiveChat();
await poLiveChat.openAnyLiveChat();
await poLiveChat.sendMessage(firstUser, false);

await poLiveChat.onlineAgentMessage.type('this_a_test_message_from_user');
await poLiveChat.onlineAgentMessage.fill('this_a_test_message_from_user');
await poLiveChat.btnSendMessageToOnlineAgent.click();

await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_user"')).toBeVisible();
Expand All @@ -72,7 +73,7 @@ test.describe.serial('OC - Livechat', () => {
});

await test.step('expect when user minimizes the livechat screen, the composer should be hidden', async () => {
await poLiveChat.openLiveChat();
await poLiveChat.openAnyLiveChat();
await expect(poLiveChat.page.locator('[contenteditable="true"]')).not.toBeVisible();
});

Expand Down Expand Up @@ -126,10 +127,10 @@ test.describe.serial('OC - Livechat - Resub after close room', () => {
});

test('OC - Livechat - Resub after close room', async () => {
await test.step('expect livechat conversation to be opened again', async () => {
await test.step('expect livechat conversation to be opened again, different guest', async () => {
await poLiveChat.startNewChat();
await poLiveChat.sendMessage(secondUser, false);
await poLiveChat.onlineAgentMessage.type('this_a_test_message_from_user');
await poLiveChat.onlineAgentMessage.fill('this_a_test_message_from_user');
await poLiveChat.btnSendMessageToOnlineAgent.click();
await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_user"')).toBeVisible();
});
Expand All @@ -147,6 +148,114 @@ test.describe.serial('OC - Livechat - Resub after close room', () => {
});
});

test.describe('OC - Livechat - Resume chat after closing', () => {
let poLiveChat: OmnichannelLiveChat;
let poHomeOmnichannel: HomeOmnichannel;

test.beforeAll(async ({ api }) => {
const statusCode = (await api.post('/livechat/users/agent', { username: 'user1' })).status();
await expect(statusCode).toBe(200);
});

test.beforeAll(async ({ browser, api }) => {
const { page: omniPage } = await createAuxContext(browser, Users.user1, '/', true);
poHomeOmnichannel = new HomeOmnichannel(omniPage);

const { page: livechatPage } = await createAuxContext(browser, Users.user1, '/livechat', false);
poLiveChat = new OmnichannelLiveChat(livechatPage, api);

await poLiveChat.sendMessageAndCloseChat(firstUser);
});

test.afterAll(async ({ api }) => {
await api.delete('/livechat/users/agent/user1');
await poLiveChat.page?.close();
});

test('OC - Livechat - Resume chat after closing', async () => {
await test.step('expect livechat conversation to be opened again', async () => {
await poLiveChat.startNewChat();
await expect(poLiveChat.onlineAgentMessage).toBeVisible();
await poLiveChat.onlineAgentMessage.fill('this_a_test_message_from_user');
await poLiveChat.btnSendMessageToOnlineAgent.click();
await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_user"')).toBeVisible();
});

await test.step('expect message to be received by agent', async () => {
await poHomeOmnichannel.sidenav.openChat(firstUser.name);
await expect(poHomeOmnichannel.content.lastUserMessage).toBeVisible();
await expect(poHomeOmnichannel.content.lastUserMessage).toContainText('this_a_test_message_from_user');
});

await test.step('expect message to be sent by agent', async () => {
await poHomeOmnichannel.content.sendMessage('this_a_test_message_from_agent');
await expect(poLiveChat.page.locator('div >> text="this_a_test_message_from_agent"')).toBeVisible();
});
});
});

test.describe('OC - Livechat - Close chat using widget', () => {
let poLiveChat: OmnichannelLiveChat;
let poHomeOmnichannel: HomeOmnichannel;
let agent: Awaited<ReturnType<typeof createAgent>>;

test.beforeAll(async ({ browser, api }) => {
agent = await createAgent(api, 'user1');

const { page } = await createAuxContext(browser, Users.user1, '/');
poHomeOmnichannel = new HomeOmnichannel(page);
});

test.beforeEach(async ({ page, api }) => {
poLiveChat = new OmnichannelLiveChat(page, api);

await poLiveChat.page.goto('/livechat');
});

test.afterAll(async () => {
await poHomeOmnichannel.page?.close();
await agent.delete();
});

test('OC - Livechat - Close Chat', async () => {
await poLiveChat.openAnyLiveChat();
await poLiveChat.sendMessage(firstUser, false);
await poLiveChat.onlineAgentMessage.fill('this_a_test_message_from_user');
await poLiveChat.btnSendMessageToOnlineAgent.click();

await test.step('expect to close a livechat conversation', async () => {
await expect(poLiveChat.btnOptions).toBeVisible();
await poLiveChat.btnOptions.click();

await expect(poLiveChat.btnCloseChat).toBeVisible();
await poLiveChat.btnCloseChat.click();

await poLiveChat.btnCloseChatConfirm.click();

await expect(poLiveChat.btnNewChat).toBeVisible();
});
});

test('OC - Livechat - Close Chat twice', async () => {
await poLiveChat.sendMessageAndCloseChat(firstUser);
await poLiveChat.startNewChat();
await poLiveChat.onlineAgentMessage.fill('this_a_test_message_from_user');
await poLiveChat.btnSendMessageToOnlineAgent.click();

await test.step('expect to close a livechat conversation a second time', async () => {
await expect(poLiveChat.btnOptions).toBeVisible();
await poLiveChat.btnOptions.click();

await expect(poLiveChat.btnCloseChat).toBeVisible();
await poLiveChat.btnCloseChat.click();

await poLiveChat.btnCloseChatConfirm.click();

await expect(poLiveChat.btnNewChat).toBeVisible();
});
});
});

test.describe('OC - Livechat - Livechat_Display_Offline_Form', () => {
let poLiveChat: OmnichannelLiveChat;
const message = 'This form is not available';
Expand Down
2 changes: 1 addition & 1 deletion apps/meteor/tests/e2e/page-objects/home-omnichannel.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import { OmnichannelTranscript } from './omnichannel-transcript';
import { OmnichannelTriggers } from './omnichannel-triggers';

export class HomeOmnichannel {
private readonly page: Page;
readonly page: Page;

readonly content: HomeOmnichannelContent;

Expand Down
40 changes: 36 additions & 4 deletions apps/meteor/tests/e2e/page-objects/omnichannel-livechat.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,10 @@ export class OmnichannelLiveChat {
return this.page.locator(`button >> text="Finish this chat"`);
}

get btnChangeDepartment(): Locator {
return this.page.locator(`button >> text="Change department"`);
}

get btnCloseChatConfirm(): Locator {
return this.page.locator(`button >> text="Yes"`);
}
Expand All @@ -40,11 +44,25 @@ export class OmnichannelLiveChat {
get btnChatNow(): Locator {
return this.page.locator('[type="button"] >> text="Chat now"');
}

get headerTitle(): Locator {
return this.page.locator('[data-qa="header-title"]');
}

txtChatMessage(message: string): Locator {
return this.page.locator(`text="${message}"`);
}

async changeDepartment (department: string): Promise<void> {
await this.btnOptions.click();
await this.btnChangeDepartment.click();
await this.selectDepartment.waitFor({ state: 'visible' });
await this.selectDepartment.selectOption({ label: department });
await this.btnSendMessage('Start chat').click();
await this.btnYes.click();
await this.btnOk.click();
}

async closeChat(): Promise<void> {
await this.btnOptions.click();
await this.btnCloseChat.click();
Expand Down Expand Up @@ -80,6 +98,10 @@ export class OmnichannelLiveChat {
return this.page.locator('[name="email"]');
}

get selectDepartment(): Locator {
return this.page.locator('[name="department"]');
}

get textAreaMessage(): Locator {
return this.page.locator('[name="message"]');
}
Expand All @@ -92,6 +114,10 @@ export class OmnichannelLiveChat {
return this.page.locator('role=button[name="OK"]');
}

get btnYes(): Locator {
return this.page.locator('role=button[name="Yes"]');
}

get onlineAgentMessage(): Locator {
return this.page.locator('[contenteditable="true"]');
}
Expand All @@ -104,13 +130,19 @@ export class OmnichannelLiveChat {
return this.page.locator('div.message-text__WwYco p');
}

public async sendMessage(liveChatUser: { name: string; email: string }, isOffline = true): Promise<void> {
public async sendMessage(liveChatUser: { name: string; email: string }, isOffline = true, department?: string): Promise<void> {
const buttonLabel = isOffline ? 'Send' : 'Start chat';
await this.inputName.type(liveChatUser.name);
await this.inputEmail.type(liveChatUser.email);
await this.inputName.fill(liveChatUser.name);
await this.inputEmail.fill(liveChatUser.email);

if (department) {
await this.selectDepartment.selectOption({ label: department });
}

if (isOffline) {
await this.textAreaMessage.type('any_message');
}

await this.btnSendMessage(buttonLabel).click();
await this.page.waitForSelector('[data-qa="livechat-composer"]');
}
Expand All @@ -119,7 +151,7 @@ export class OmnichannelLiveChat {
liveChatUser: { name: string; email: string },
message = 'this_a_test_message_from_user',
): Promise<void> {
await this.openLiveChat();
await this.openAnyLiveChat();
await this.sendMessage(liveChatUser, false);
await this.onlineAgentMessage.type(message);
await this.btnSendMessageToOnlineAgent.click();
Expand Down
Loading

0 comments on commit c8b11da

Please sign in to comment.