28 lines
2.6 KiB
TypeScript
28 lines
2.6 KiB
TypeScript
/**
|
|
* 38-messages: Messages Vue 组件化测试
|
|
*/
|
|
import { describe, it, expect, beforeEach, afterEach } from 'vitest'
|
|
import { h, render, nextTick } from 'vue'
|
|
import MessagesComponent from '../../src/apps/messages/Messages.vue'
|
|
import { store } from '../../src/composables/useStore'
|
|
import { setupDOM } from '../helpers'
|
|
|
|
function makeMockWin() { const el = document.createElement('div'); el.className = 'window'; document.getElementById('window-layer')?.appendChild(el); const body = document.createElement('div'); body.className = 'win-body'; el.appendChild(body); return { el, body, timers: [] as any[], data: {} } }
|
|
|
|
describe('38-messages — Messages Vue 组件化', () => {
|
|
let win: any
|
|
beforeEach(() => { localStorage.clear(); store.set('messages', null); setupDOM(); win = makeMockWin() })
|
|
afterEach(() => { render(null, win.body); win.el.remove() })
|
|
function mount() { const v = h(MessagesComponent, { win }); render(v, win.body) }
|
|
|
|
it('显示对话列表', () => { mount(); expect(win.body.querySelectorAll('.contact-row').length).toBeGreaterThanOrEqual(1) })
|
|
it('默认选中第一个对话', () => { mount(); expect(win.body.querySelector('.contact-row.sel')).toBeTruthy() })
|
|
it('显示聊天界面', () => { mount(); expect(win.body.querySelector('.msg-chat')).toBeTruthy() })
|
|
it('显示消息气泡', () => { mount(); expect(win.body.querySelector('.msg-bubble')).toBeTruthy() })
|
|
it('输入框存在', () => { mount(); expect(win.body.querySelector('.msg-input')).toBeTruthy() })
|
|
it('Enter 发送消息', async () => { mount(); await nextTick(); const input = win.body.querySelector('.msg-input') as HTMLInputElement; input.value = '你好'; input.dispatchEvent(new Event('input', { bubbles: true })); await nextTick(); input.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', bubbles: true })); await nextTick(); expect(input.value).toBe('') })
|
|
it('切换对话更新聊天', async () => { mount(); const rows = win.body.querySelectorAll('.contact-row'); (rows[1] as HTMLElement)?.dispatchEvent(new MouseEvent('click', { bubbles: true })); await nextTick(); expect(rows[1].classList.contains('sel')).toBe(true) })
|
|
it('未读标记清零', async () => { store.set('messages', { convs: [{ id: 'c1', name: '测试', msgs: [{ from: 'them', text: 'Hi', ts: Date.now() - 1000 }], unread: 3 }] }); mount(); const row = win.body.querySelector('.contact-row') as HTMLElement; row.dispatchEvent(new MouseEvent('click', { bubbles: true })); await nextTick(); const data = store.get('messages', {}); expect(data.convs[0].unread).toBe(0) })
|
|
it('卸载', () => { mount(); render(null, win.body); expect(win.body.children.length).toBe(0) })
|
|
})
|