macos-web/tests/cases/43-keynote.test.ts

29 lines
3.1 KiB
TypeScript

/**
* 43-keynote: Keynote Vue 组件化测试
* 覆盖: 缩略图/舞台、幻灯片切换、键盘导航、播放/退出/翻页、appState.play、卸载
*/
import { describe, it, expect, beforeEach, afterEach } from 'vitest'
import { h, render, nextTick } from 'vue'
import KeynoteComponent from '../../src/apps/keynote/Keynote.vue'
import { setupDOM } from '../helpers'
describe('43-keynote', () => {
let body: HTMLElement, win: any
beforeEach(() => { setupDOM(); const el = document.createElement('div'); el.className = 'window'; document.body.appendChild(el); body = document.createElement('div'); body.className = 'win-body'; el.appendChild(body); win = { el, body, timers: [], data: {} } })
afterEach(() => { render(null, body); win.el.remove() })
function m() { render(h(KeynoteComponent, { win }), body) }
it('4 张幻灯片缩略图', () => { m(); expect(body.querySelectorAll('.kn-thumb').length).toBe(4) })
it('舞台显示当前幻灯片', () => { m(); expect(body.querySelector('.kn-slide')).toBeTruthy() })
it('默认选中第一张', () => { m(); expect(body.querySelector('.kn-thumb.sel')?.textContent).toContain('macOS') })
it('点击缩略图切换', async () => { m(); const thumbs = body.querySelectorAll('.kn-thumb'); (thumbs[1] as HTMLElement).dispatchEvent(new MouseEvent('click', { bubbles: true })); await nextTick(); expect(body.querySelector('.kn-title')?.textContent).toContain('虚拟文件') })
it('ArrowRight 切换到下一张', async () => { m(); await nextTick(); win.el.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight' })); await nextTick(); expect(body.querySelector('.kn-title')?.textContent).toContain('虚拟文件') })
it('ArrowLeft 切换到上一张', async () => { m(); win.el.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight' })); win.el.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft' })); expect(body.querySelector('.kn-title')?.textContent).toContain('macOS') })
it('ArrowDown 同 ArrowRight', async () => { m(); await nextTick(); win.el.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' })); await nextTick(); expect(body.querySelector('.kn-title')?.textContent).toContain('虚拟文件') })
it('appState.play 存在', () => { m(); expect(typeof win.appState.play).toBe('function') })
it('play 后显示全屏播放', async () => { m(); win.appState.play(); await nextTick(); expect(body.querySelector('.kn-play')).toBeTruthy() })
it('播放中 Space 翻页', async () => { m(); win.appState.play(); await nextTick(); const playEl = body.querySelector('.kn-play') as HTMLElement; playEl.dispatchEvent(new KeyboardEvent('keydown', { key: ' ' })); await nextTick(); expect(body.querySelector('.kn-play .kn-title')?.textContent).toContain('虚拟文件') })
it('播放中 Escape 退出', async () => { m(); win.appState.play(); await nextTick(); (body.querySelector('.kn-play') as HTMLElement).dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape' })); await nextTick(); expect(body.querySelector('.kn-play')).toBeNull() })
it('卸载', () => { m(); render(null, body); expect(body.children.length).toBe(0) })
})