87 lines
3.7 KiB
TypeScript
87 lines
3.7 KiB
TypeScript
import { afterEach, describe, expect, it, vi } from 'vitest'
|
|
import { flushPromises, mount, type VueWrapper } from '@vue/test-utils'
|
|
import { createMemoryHistory, createRouter } from 'vue-router'
|
|
import ProjectAssetsPage from '@/features/project-assets/ProjectAssetsPage.vue'
|
|
import { projectContextKey } from '@/features/projects/context'
|
|
import { testProjectContext } from '@/testing/project-context'
|
|
|
|
let wrapper: VueWrapper | undefined
|
|
afterEach(() => {
|
|
wrapper?.unmount()
|
|
wrapper = undefined
|
|
document.body.innerHTML = ''
|
|
vi.unstubAllGlobals()
|
|
})
|
|
|
|
describe('项目资产库页面', () => {
|
|
it('读取当前项目素材并支持名称、分类和原文件名筛选', async () => {
|
|
const fetcher = vi.fn<typeof fetch>().mockResolvedValue(
|
|
new Response(
|
|
JSON.stringify({
|
|
data: [
|
|
{
|
|
id: 'asset-scene',
|
|
projectId: 'capability-test',
|
|
name: '雨夜街道',
|
|
type: 'image',
|
|
category: 'scene',
|
|
mimeType: 'image/png',
|
|
extension: 'png',
|
|
size: 4096,
|
|
publicUrl: '/storage/scene.png',
|
|
metadata: { originalName: 'street-original.png' },
|
|
createdAt: '2026-09-21T00:00:00Z',
|
|
updatedAt: '2026-09-21T00:00:00Z'
|
|
},
|
|
{
|
|
id: 'asset-character',
|
|
projectId: 'capability-test',
|
|
name: '林默正面照',
|
|
type: 'image',
|
|
category: 'character',
|
|
mimeType: 'image/jpeg',
|
|
extension: 'jpg',
|
|
size: 8192,
|
|
publicUrl: '/storage/character.jpg',
|
|
metadata: null,
|
|
createdAt: '2026-09-21T01:00:00Z',
|
|
updatedAt: '2026-09-21T01:00:00Z'
|
|
}
|
|
]
|
|
})
|
|
)
|
|
)
|
|
vi.stubGlobal('fetch', fetcher)
|
|
const router = createRouter({
|
|
history: createMemoryHistory(),
|
|
routes: [{ path: '/projects/:projectId/assets', component: ProjectAssetsPage }]
|
|
})
|
|
await router.push('/projects/capability-test/assets')
|
|
wrapper = mount(ProjectAssetsPage, {
|
|
attachTo: document.body,
|
|
global: {
|
|
plugins: [router],
|
|
provide: { [projectContextKey as symbol]: testProjectContext() }
|
|
}
|
|
})
|
|
await flushPromises()
|
|
|
|
expect(fetcher).toHaveBeenCalledWith(
|
|
'/api/projects/capability-test/assets',
|
|
expect.objectContaining({ method: 'GET' })
|
|
)
|
|
expect(wrapper.findAll('.project-asset-card')).toHaveLength(2)
|
|
expect(wrapper.text()).toContain('雨夜街道')
|
|
expect(wrapper.text()).toContain('林默正面照')
|
|
|
|
await wrapper.get('input[aria-label="搜索项目素材"]').setValue('street-original')
|
|
expect(wrapper.findAll('.project-asset-card')).toHaveLength(1)
|
|
expect(wrapper.text()).toContain('雨夜街道')
|
|
expect(wrapper.text()).not.toContain('林默正面照')
|
|
|
|
await wrapper.get('input[aria-label="搜索项目素材"]').setValue('没有结果')
|
|
expect(wrapper.findAll('.project-asset-card')).toHaveLength(0)
|
|
expect(wrapper.text()).toContain('没有匹配的素材')
|
|
})
|
|
})
|