40 lines
2.4 KiB
TypeScript
40 lines
2.4 KiB
TypeScript
/**
|
|
* 45-news: Apple News — 深层测试
|
|
* 覆盖: DOM(2)+文章列表(5)+内容完整性(3)+边界(2)+卸载
|
|
*/
|
|
import { describe, it, expect, beforeEach, afterEach } from 'vitest'
|
|
import { h, render } from 'vue'
|
|
import NewsComponent from '../../src/apps/news/News.vue'
|
|
import { setupDOM } from '../helpers'
|
|
|
|
describe('45-news', () => {
|
|
let body: HTMLElement
|
|
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) })
|
|
afterEach(() => { render(null, body); (body.parentElement as HTMLElement)?.remove() })
|
|
function m() { render(h(NewsComponent, {}), body) }
|
|
function card(i: number) { return body.querySelectorAll('.news-card')[i] as HTMLElement }
|
|
|
|
// --- DOM ---
|
|
it('news-body 容器', () => { m(); expect(body.querySelector('.news-body')).toBeTruthy() })
|
|
it('news-card 容器', () => { m(); expect(body.querySelector('.news-card')).toBeTruthy() })
|
|
|
|
// --- 文章列表 ---
|
|
it('4 篇文章', () => { m(); expect(body.querySelectorAll('.news-card').length).toBe(4) })
|
|
it('第一篇标题含 macOS', () => { m(); expect(card(0).querySelector('.news-title')?.textContent).toContain('macOS') })
|
|
it('第二篇含"本地优先"', () => { m(); expect(card(1).querySelector('.news-title')?.textContent).toContain('本地优先') })
|
|
it('第三篇含"浏览器平台"', () => { m(); expect(card(2).querySelector('.news-title')?.textContent).toContain('浏览器平台') })
|
|
it('第四篇含"开源素材"', () => { m(); expect(card(3).querySelector('.news-title')?.textContent).toContain('开源素材') })
|
|
|
|
// --- 内容完整性 ---
|
|
it('每篇有分类标签', () => { m(); [0, 1, 2, 3].forEach(i => expect(card(i).querySelector('.news-cat')?.textContent).toBeTruthy()) })
|
|
it('每篇有描述', () => { m(); [0, 1, 2, 3].forEach(i => expect(card(i).querySelector('.news-desc')?.textContent).toBeTruthy()) })
|
|
it('分类标签非空', () => { m(); expect(card(0).querySelector('.news-cat')?.textContent?.length).toBeGreaterThan(0) })
|
|
|
|
// --- 边界 ---
|
|
it('超过范围索引 undefined', () => { m(); expect(body.querySelectorAll('.news-card')[4]).toBeUndefined() })
|
|
it('渲染无 prop 不崩溃', () => { expect(() => render(h(NewsComponent, {}), body)).not.toThrow() })
|
|
|
|
// --- 卸载 ---
|
|
it('卸载后 DOM 为空', () => { m(); render(null, body); expect(body.children.length).toBe(0) })
|
|
})
|