From fec14102eb8c1a8022ad54050d202672738f899e Mon Sep 17 00:00:00 2001 From: Jennifer Q <66472237+latin-panda@users.noreply.github.com> Date: Thu, 7 Dec 2023 16:08:50 +0700 Subject: [PATCH] feat(#8660) - add link in conversation to navigate to sender's contact page (#8717) --- ...c.js => messages-sender-data.wdio-spec.js} | 18 ++++++- .../default/sms/messages.wdio.page.js | 7 +++ .../components/sender/sender.component.html | 14 +++--- .../ts/components/sender/sender.component.ts | 13 ++++- .../ts/components/sender.component.spec.ts | 50 +++++++++++++++++-- 5 files changed, 90 insertions(+), 12 deletions(-) rename tests/e2e/default/sms/{messages-breadcrumbs.wdio-spec.js => messages-sender-data.wdio-spec.js} (79%) diff --git a/tests/e2e/default/sms/messages-breadcrumbs.wdio-spec.js b/tests/e2e/default/sms/messages-sender-data.wdio-spec.js similarity index 79% rename from tests/e2e/default/sms/messages-breadcrumbs.wdio-spec.js rename to tests/e2e/default/sms/messages-sender-data.wdio-spec.js index 988d9561960..7182669c193 100644 --- a/tests/e2e/default/sms/messages-breadcrumbs.wdio-spec.js +++ b/tests/e2e/default/sms/messages-sender-data.wdio-spec.js @@ -5,8 +5,9 @@ const userFactory = require('@factories/cht/users/users'); const placeFactory = require('@factories/cht/contacts/place'); const personFactory = require('@factories/cht/contacts/person'); const messagesPage = require('@page-objects/default/sms/messages.wdio.page'); +const contactsPage = require('@page-objects/default/contacts/contacts.wdio.page'); -describe('Message tab breadcrumbs', () => { +describe('Message Tab - Sender Data', () => { const places = placeFactory.generateHierarchy(); const clinic = places.get('clinic'); const health_center = places.get('health_center'); @@ -84,4 +85,19 @@ describe('Message tab breadcrumbs', () => { expect(lineage).to.equal(expectedLineage); }); + it('should display conversation with link and navigate to contact', async () => { + await loginPage.login(offlineUser); + await commonElements.waitForPageLoaded(); + await commonElements.goToMessages(); + + await messagesPage.openMessage(patient._id); + const header = await messagesPage.getMessageHeader(); + expect(header.name).to.equal(patient.name); + expect(header.phone).to.equal(patient.phone); + + await messagesPage.navigateFromConversationToContact(); + const title = await contactsPage.getContactInfoName(); + expect(title).to.equal(patient.name); + }); + }); diff --git a/tests/page-objects/default/sms/messages.wdio.page.js b/tests/page-objects/default/sms/messages.wdio.page.js index 83457876598..bf0f0fbda1b 100644 --- a/tests/page-objects/default/sms/messages.wdio.page.js +++ b/tests/page-objects/default/sms/messages.wdio.page.js @@ -45,6 +45,12 @@ const getMessageHeader = async () => { }; }; +const navigateFromConversationToContact = async () => { + await $(`${MESSAGE_HEADER} a.name`).waitForClickable(); + await $(`${MESSAGE_HEADER} a.name`).click(); + await commonPage.waitForPageLoaded(); +}; + const getMessageContent = async (index = 1) => { const sms = await $(`${MESSAGE_CONTENT} li:nth-child(${index})`); await sms.waitForDisplayed(); @@ -140,5 +146,6 @@ module.exports = { sendReply, replyAddRecipients, getAmountOfMessagesByPhone, + navigateFromConversationToContact, getMessagesModalDetails, }; diff --git a/webapp/src/ts/components/sender/sender.component.html b/webapp/src/ts/components/sender/sender.component.html index b3fd49d6dec..449777069ba 100644 --- a/webapp/src/ts/components/sender/sender.component.html +++ b/webapp/src/ts/components/sender/sender.component.html @@ -1,15 +1,17 @@
- + [translateParams]="{ senderName: getName() || ( 'messages.unknown.sender' | translate ) }"> messages.sent.by - - {{ message.doc?.name || message.contact?.name || (!message.form && message.name) || message.from || message.sent_by || ('messages.unknown.sender' | translate) }} - + + {{ getName() }} + + {{ getName() || ( 'messages.unknown.sender' | translate ) }} + + {{ message.doc?.phone || message.contact?.phone || message.phone }} diff --git a/webapp/src/ts/components/sender/sender.component.ts b/webapp/src/ts/components/sender/sender.component.ts index 93d5fc06336..ce2162c4dba 100644 --- a/webapp/src/ts/components/sender/sender.component.ts +++ b/webapp/src/ts/components/sender/sender.component.ts @@ -10,5 +10,16 @@ export class SenderComponent { @Input() sentBy; @Input() hideLineage; - constructor() { } + getName() { + return this.message.doc?.name + || this.message.contact?.name + || (!this.message.form && this.message.name) + || this.message.from + || this.message.sent_by + || this.message.doc?.from; + } + + getId() { + return this.message.contact?._id || this.message.doc?._id; + } } diff --git a/webapp/tests/karma/ts/components/sender.component.spec.ts b/webapp/tests/karma/ts/components/sender.component.spec.ts index 757eb1df073..2249f4b1d78 100644 --- a/webapp/tests/karma/ts/components/sender.component.spec.ts +++ b/webapp/tests/karma/ts/components/sender.component.spec.ts @@ -1,4 +1,5 @@ import { TestBed } from '@angular/core/testing'; +import { RouterModule } from '@angular/router'; import { expect } from 'chai'; import { By } from '@angular/platform-browser'; import { TranslateFakeLoader, TranslateLoader, TranslateModule } from '@ngx-translate/core'; @@ -18,6 +19,7 @@ describe('sender directive', function() { imports: [ TranslateModule.forRoot({ loader: { provide: TranslateLoader, useClass: TranslateFakeLoader } }), PipesModule, + RouterModule.forRoot([]), ], declarations: [ SenderComponent, @@ -44,7 +46,7 @@ describe('sender directive', function() { fixture.detectChanges(); await fixture.whenStable(); - expect(getElement('div .name').innerText).to.equal('+123'); + expect(getElement('div span.name').innerText).to.equal('+123'); }); it('should render sender when message has sent by', async () => { @@ -55,7 +57,7 @@ describe('sender directive', function() { fixture.detectChanges(); await fixture.whenStable(); - expect(getElement('div .name').innerText).to.equal('+789'); + expect(getElement('div span.name').innerText).to.equal('+789'); }); it('should render sender when message has contact', async () => { @@ -80,10 +82,50 @@ describe('sender directive', function() { fixture.detectChanges(); await fixture.whenStable(); - expect(getElement('div .name').innerText).to.equal('Clark '); - expect(getElement('div .phone').innerText).to.equal('+123'); + expect(getElement('div span.name').innerText.trim()).to.equal('Clark'); + expect(getElement('div .phone').innerText.trim()).to.equal('+123'); expect(getElement('div .position .lineage li:nth-child(1)').innerText).to.equal('Clarks House'); expect(getElement('div .position .lineage li:nth-child(2)').innerText).to.equal('Smallville'); expect(getElement('div .position .lineage li:nth-child(3)').innerText).to.equal('Metropolis'); }); + + it('should render sender as a link when message has a contact with id', async () => { + fixture.componentInstance.message = { + sent_by: '+789', + from: '+123', + contact: { + _id: 'clark-123', + name: 'Clark', + phone: '+123', + parent: { + name: 'Clarks House', + parent: { name: 'Smallville', parent: { name: 'Metropolis' } }, + }, + }, + }; + + fixture.detectChanges(); + await fixture.whenStable(); + + expect(getElement('div a.name').innerText.trim()).to.equal('Clark'); + expect(getElement('div .phone').innerText.trim()).to.equal('+123'); + expect(getElement('div .position .lineage li:nth-child(1)').innerText).to.equal('Clarks House'); + expect(getElement('div .position .lineage li:nth-child(2)').innerText).to.equal('Smallville'); + expect(getElement('div .position .lineage li:nth-child(3)').innerText).to.equal('Metropolis'); + }); + + it('should render sender as a link when message has a doc with id', async () => { + fixture.componentInstance.message = { + sent_by: '+789', + from: '+123', + doc: { _id: 'jane-123', name: 'Jane', phone: '+123' }, + contact: null, + }; + + fixture.detectChanges(); + await fixture.whenStable(); + + expect(getElement('div a.name').innerText.trim()).to.equal('Jane'); + expect(getElement('div .phone').innerText.trim()).to.equal('+123'); + }); });