test(HH-558): complete WebChannel sender display regression matrix (#141)

* chore(agent): baseline — uncommitted work from the local directory

* test(HH-558): cover widget sender display matrix

---------

Co-authored-by: Rogee <rogee@ipao.vip>

frontend/app/javascript/widget/components/specs/agentName.spec.js

@@ -1,26 +1,113 @@
+import { mount } from '@vue/test-utils';
+import VueDOMPurifyHTML from 'vue-dompurify-html';
+import visitorPayload from '../../../../../testdata/visitor_ws_payload.json';
 import AgentMessage from '../AgentMessage.vue';
 import UnreadMessage from '../UnreadMessage.vue';
 
 const context = {
-  channelConfig: { websiteName: 'GoChat' },
+  channelConfig: {
+    websiteName: 'GoChat',
+    enabledFeatures: [],
+    avatarUrl: '',
+  },
   useInboxAvatarForBot: false,
   $t: key => key,
 };
 
-describe('widget agent name', () => {
-  it('uses the inbox name when a conversation message has no public sender', () => {
-    expect(
-      AgentMessage.computed.agentName.call({ ...context, message: {} })
-    ).toBe('GoChat');
+window.chatwootWebChannel = context.channelConfig;
+
+const mountAgentMessage = message =>
+  mount(AgentMessage, {
+    props: {
+      message: { ...message, showAvatar: true },
+    },
+    global: {
+      plugins: [VueDOMPurifyHTML],
+      stubs: {
+        AgentMessageBubble: { template: '<div />' },
+        Avatar: { template: '<div />' },
+        FileBubble: { template: '<div />' },
+        ImageBubble: { template: '<div />' },
+        MessageReplyButton: { template: '<div />' },
+        ReplyToChip: { template: '<div />' },
+        UserMessage: { template: '<div />' },
+        VideoBubble: { template: '<div />' },
+      },
+    },
   });
 
-  it('uses the inbox name when an unread message has no public sender', () => {
+describe('widget agent name', () => {
+  it.each([
+    [
+      'available_name',
+      {
+        sender: { available_name: 'Available', name: 'Name' },
+        additional_attributes: { sender_name: 'Visitor service' },
+      },
+      'Available',
+    ],
+    [
+      'name',
+      {
+        sender: { name: 'Name' },
+        additional_attributes: { sender_name: 'Visitor service' },
+      },
+      'Name',
+    ],
+    [
+      'message sender_name',
+      { additional_attributes: { sender_name: 'Visitor service' } },
+      'Visitor service',
+    ],
+    ['inbox name', {}, 'GoChat'],
+  ])('conversation message prefers %s', (_source, message, expected) => {
+    expect(AgentMessage.computed.agentName.call({ ...context, message })).toBe(
+      expected
+    );
+  });
+
+  it('returns an empty name when the sanitized inbox name is unavailable', () => {
+    expect(
+      AgentMessage.computed.agentName.call({
+        ...context,
+        channelConfig: { ...context.channelConfig, websiteName: '' },
+        message: {},
+      })
+    ).toBe('');
+  });
+
+  it.each([
+    [
+      'available_name',
+      { available_name: 'Available', name: 'Name' },
+      'Available',
+    ],
+    ['name', { name: 'Name' }, 'Name'],
+    ['inbox name', {}, 'GoChat'],
+  ])('unread message prefers %s', (_source, sender, expected) => {
     expect(
       UnreadMessage.computed.agentName.call({
         ...context,
+        sender,
+        isSenderExist: UnreadMessage.methods.isSenderExist,
+      })
+    ).toBe(expected);
+  });
+
+  it('returns an empty unread name when the inbox name is unavailable', () => {
+    expect(
+      UnreadMessage.computed.agentName.call({
+        ...context,
+        channelConfig: { ...context.channelConfig, websiteName: '' },
         sender: {},
         isSenderExist: UnreadMessage.methods.isSenderExist,
       })
-    ).toBe('GoChat');
+    ).toBe('');
+  });
+
+  it('mounts the visitor WS output with the inbox name', () => {
+    const wrapper = mountAgentMessage(visitorPayload.data);
+
+    expect(wrapper.get('.agent-name').text()).toBe('GoChat');
   });
 });