feat: 增强 HTML 聊天档案导出

- 增加时间轴、消息筛选、搜索和完整时间显示
- 使用窗口化懒加载优化大消息档案
- 支持同名档案增量合并并安全复用媒体资源

tests/unit/export-media.test.ts

@@ -1,17 +1,13 @@
 import { describe, expect, it } from 'vitest'
-import { renderExportPage } from '../../src/main/export-html-template'
+import { JSDOM } from 'jsdom'
+import { EXPORT_PAGE_SIZE, renderExportPage } from '../../src/main/export-html-template'
 import { getImageExportAttempts } from '../../src/shared/export-media'
 import type { Message } from '../../src/shared/types'
 
-const baseMessage = (overrides: Partial<Message>): Message => ({
-  id: 'fixture-message',
-  from: 'fixture',
-  type: '文本',
-  datetime: '2026-08-01 10:00:00',
-  content: '',
-  isSender: false,
-  ...overrides
-})
+const inlineScriptOf = (html: string): string =>
+  Array.from(html.matchAll(/<script(?:\s[^>]*)?>([\s\S]*?)<\/script>/g))
+    .map((match) => match[1].trim())
+    .find(Boolean) || ''
 
 describe('export media', () => {
   it('always attempts the original before an explicitly enabled thumbnail fallback', () => {
@@ -25,47 +21,85 @@ describe('export media', () => {
     expect(repeated).toEqual(first)
   })
 
-  it('renders movable relative audio and video assets plus accurate missing-media details', () => {
-    const html = renderExportPage('脱敏导出', [
-      baseMessage({ id: 'voice', type: '语音', voiceDataUrl: 'voices/voice_1.wav' }),
-      baseMessage({
-        id: 'video',
-        type: '视频',
-        exportMediaType: 'video',
-        exportMediaUrl: 'media/video_2.mp4'
-      }),
-      baseMessage({
-        id: 'missing',
-        type: '语音',
-        exportMediaError: '语音文件缺失：本地未找到语音数据'
-      }),
-      baseMessage({
-        id: 'file',
-        type: '文件',
-        contentData: { type: 'share', typeVal: '6', title: '示例附件.zip', url: '' },
-        exportMediaType: 'file',
-        exportMediaName: '示例附件.zip',
-        exportMediaUrl: 'media/file_4_示例附件.zip'
-      })
-    ])
+  it('loads archive data and provides timeline, filters, search, and bounded lazy rendering', () => {
+    const html = renderExportPage('脱敏导出')
 
-    expect(html).toContain(
-      'audio class="audio" controls preload="metadata" src="voices/voice_1.wav"'
+    expect(EXPORT_PAGE_SIZE).toBe(240)
+    expect(html).toContain('<script src="data/messages.js"></script>')
+    expect(html).toContain('aria-label="聊天时间轴"')
+    expect(html).toContain('data-kind="media"')
+    expect(html).toContain('placeholder="搜索发送者或消息内容…"')
+    expect(html).toContain('filtered.slice(windowStart, windowEnd)')
+    expect(html).toContain('windowStart = Math.max(0, windowEnd - PAGE_SIZE)')
+    expect(html).toContain('date.getSeconds()')
+    const inlineScript = inlineScriptOf(html)
+    expect(inlineScript).toBeTruthy()
+    expect(() => new Function(inlineScript)).not.toThrow()
+  })
+
+  it('initially renders only one page and searches the full archive dataset', () => {
+    const html = renderExportPage('大量消息')
+    const dom = new JSDOM(html, { runScripts: 'outside-only' })
+    const messages = Array.from(
+      { length: 500 },
+      (_, index): Message => ({
+        id: `message-${index}`,
+        from: 'user',
+        type: '普通文本',
+        datetime: '',
+        content: index % 100 === 0 ? `needle-${index}` : `普通消息-${index}`,
+        isSender: false,
+        createTime: 1_767_225_600 + index * 86_400
+      })
     )
-    expect(html).toContain('video class="media-image" controls src="media/video_2.mp4"')
-    expect(html).toContain('语音文件缺失：本地未找到语音数据')
-    expect(html).toContain('class="file-attachment" href="media/file_4_示例附件.zip" download')
+    Object.assign(dom.window, {
+      __WECHAT_EXPORT__: {
+        version: 1,
+        sourceId: 'fixture',
+        name: '大量消息',
+        exportedAt: '2026-08-04T00:00:00.000Z',
+        messages
+      }
+    })
+
+    dom.window.eval(inlineScriptOf(html))
+
+    expect(dom.window.document.querySelectorAll('.message')).toHaveLength(EXPORT_PAGE_SIZE)
+    expect(dom.window.document.querySelector('#count')?.textContent).toBe(
+      '已显示 240 / 筛选 500 / 全部 500'
+    )
+    const list = dom.window.document.querySelector('#messages')!
+    for (let index = 0; index < 5; index += 1) {
+      list.dispatchEvent(new dom.window.Event('scroll'))
+      expect(dom.window.document.querySelectorAll('.message').length).toBeLessThanOrEqual(
+        EXPORT_PAGE_SIZE
+      )
+    }
+    const search = dom.window.document.querySelector('#query') as HTMLInputElement
+    search.value = 'needle'
+    search.dispatchEvent(new dom.window.Event('input'))
+    expect(dom.window.document.querySelectorAll('.message')).toHaveLength(5)
+    expect(dom.window.document.querySelectorAll('.timeline-month').length).toBeGreaterThan(1)
+    dom.window.close()
+  })
+
+  it('keeps relative media, file download, quote, and missing-media renderers', () => {
+    const html = renderExportPage('媒体档案')
+
+    expect(html).toContain('audio class="audio" controls preload="metadata"')
+    expect(html).toContain('video class="media-image" controls preload="metadata"')
+    expect(html).toContain('class="file-attachment" href="')
+    expect(html).toContain('class="quote-reference"')
+    expect(html).toContain('message.exportMediaError')
     expect(html).not.toMatch(/(?:src|href)="[A-Za-z]:\\/)
   })
 
   it('renders explicit and keyboard-accessible lightbox closing controls', () => {
-    const html = renderExportPage('图片预览', [
-      baseMessage({ id: 'image', type: '图片', exportMediaUrl: 'media/image.jpg' })
-    ])
+    const html = renderExportPage('图片预览')
 
     expect(html).toContain('aria-label="关闭图片预览"')
-    expect(html).toContain("closeButton.addEventListener('click',closeLightbox)")
-    expect(html).toContain('if(event.target===box)closeLightbox()')
-    expect(html).toContain("if(event.key==='Escape')closeLightbox()")
+    expect(html).toContain("closeButton.addEventListener('click', closeLightbox)")
+    expect(html).toContain('if (event.target === box) closeLightbox()')
+    expect(html).toContain("if (event.key === 'Escape') closeLightbox()")
   })
 })