67 lines
3.2 KiB
TypeScript
67 lines
3.2 KiB
TypeScript
// @vitest-environment happy-dom
|
|
|
|
import { mount } from '@vue/test-utils'
|
|
import { describe, expect, it } from 'vitest'
|
|
import ExplainGuideStopCatalog from '@/components/explain/ExplainGuideStopCatalog.vue'
|
|
|
|
const stops = [
|
|
{ id: 'ready', name: '一个很长很长很长很长很长的讲解对象名称', coverImageUrl: '/cover.jpg', audioStatus: 'READY', hasAudio: true, hasTextRecord: true },
|
|
{ id: 'text', name: '图文对象', hasTextRecord: true },
|
|
{ id: 'none', name: '无内容对象' }
|
|
]
|
|
|
|
const mountCatalog = () => mount(ExplainGuideStopCatalog, { props: { guideStops: stops, selectedHallName: '宇宙厅', hasMore: true } })
|
|
|
|
describe('ExplainGuideStopCatalog', () => {
|
|
it('renders a stable single-column list with real availability copy and no arrows', () => {
|
|
const wrapper = mountCatalog()
|
|
expect(wrapper.find('.stop-list').exists()).toBe(true)
|
|
expect(wrapper.find('.stop-grid').exists()).toBe(false)
|
|
expect(wrapper.findAll('.stop-card')).toHaveLength(3)
|
|
expect(wrapper.findAll('.stop-cover.placeholder')).toHaveLength(2)
|
|
expect(wrapper.text()).toContain('音频可播放')
|
|
expect(wrapper.text()).toContain('图文可查看')
|
|
expect(wrapper.text()).toContain('暂无可用内容')
|
|
expect(wrapper.find('.hall-arrow').exists()).toBe(false)
|
|
expect(wrapper.find('.stop-name').classes()).toContain('stop-name')
|
|
})
|
|
|
|
it('searches and uses only data-driven fallback filters when guide levels are absent', async () => {
|
|
const wrapper = mountCatalog()
|
|
expect(wrapper.text()).not.toContain('核心展品')
|
|
expect(wrapper.get('input').attributes('placeholder')).toBe('搜索讲解对象')
|
|
await wrapper.get('input').setValue('图文')
|
|
expect(wrapper.findAll('.stop-card')).toHaveLength(1)
|
|
expect(wrapper.emitted('requestAll')).toHaveLength(1)
|
|
await wrapper.get('input').setValue('')
|
|
await wrapper.get('.filter-chip:nth-child(2)').trigger('tap')
|
|
expect(wrapper.findAll('.stop-card')).toHaveLength(1)
|
|
})
|
|
|
|
it('keeps loading and empty states available for the single-column list', async () => {
|
|
const wrapper = mount(ExplainGuideStopCatalog, { props: { loading: true } })
|
|
expect(wrapper.text()).toContain('正在加载讲解对象')
|
|
|
|
await wrapper.setProps({ loading: false, guideStops: [] })
|
|
expect(wrapper.text()).toContain('该展厅暂无讲解对象')
|
|
expect(wrapper.find('.stop-list').exists()).toBe(false)
|
|
})
|
|
|
|
it('emits card, back, retry, retry-more, and request-all actions', async () => {
|
|
const wrapper = mountCatalog()
|
|
await wrapper.get('.stop-card').trigger('tap')
|
|
await wrapper.get('.header-back').trigger('tap')
|
|
await wrapper.get('.filter-chip:nth-child(2)').trigger('tap')
|
|
expect(wrapper.emitted('guideStopClick')?.[0][0]).toMatchObject({ id: 'ready' })
|
|
expect(wrapper.emitted('back')).toHaveLength(1)
|
|
expect(wrapper.emitted('requestAll')).toHaveLength(1)
|
|
|
|
await wrapper.setProps({ error: '失败' })
|
|
await wrapper.get('.state-retry').trigger('tap')
|
|
expect(wrapper.emitted('retry')).toHaveLength(1)
|
|
await wrapper.setProps({ error: '', loadMoreError: '更多失败' })
|
|
await wrapper.get('.state-retry').trigger('tap')
|
|
expect(wrapper.emitted('retryMore')).toHaveLength(1)
|
|
})
|
|
})
|