lyf
5de005e011
- 将讲解编号置于标题上方并增强辨识度 - 编号详情返回后保留输入界面并清空原编号 - 增加页面栈丢失时恢复编号输入页的兜底逻辑 - 补充编号布局和返回流程回归测试 Made-with: Proma
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: '一个很长很长很长很长很长的讲解对象名称', externalCode: '0231', 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 one truthful availability tag 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.findAll('.stop-status')).toHaveLength(3)
|
||
expect(wrapper.text()).toContain('讲解')
|
||
expect(wrapper.text()).toContain('图文')
|
||
expect(wrapper.get('.stop-code').text()).toBe('编号：0231')
|
||
expect(wrapper.findAll('.stop-code')).toHaveLength(1)
|
||
const readyCopy = wrapper.get('.stop-card .stop-copy')
|
||
expect(readyCopy.element.firstElementChild?.classList.contains('stop-code')).toBe(true)
|
||
expect(readyCopy.element.lastElementChild?.classList.contains('stop-name')).toBe(true)
|
||
expect(wrapper.text()).not.toContain('暂无内容')
|
||
expect(wrapper.find('.hall-arrow').exists()).toBe(false)
|
||
expect(wrapper.find('.stop-name').classes()).toContain('stop-name')
|
||
})
|
||
|
||
it('does not expose search or category controls in the focused list', () => {
|
||
const wrapper = mountCatalog()
|
||
expect(wrapper.text()).not.toContain('核心展品')
|
||
expect(wrapper.find('input').exists()).toBe(false)
|
||
expect(wrapper.find('.catalog-controls').exists()).toBe(false)
|
||
expect(wrapper.find('.filter-chip').exists()).toBe(false)
|
||
})
|
||
|
||
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, and retry-more actions', async () => {
|
||
const wrapper = mountCatalog()
|
||
await wrapper.get('.stop-card').trigger('tap')
|
||
await wrapper.get('.header-back').trigger('tap')
|
||
expect(wrapper.emitted('guideStopClick')?.[0][0]).toMatchObject({ id: 'ready' })
|
||
expect(wrapper.emitted('back')).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)
|
||
})
|
||
})
|