/**
 * 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) })
})