feat(w3): add continuous read mode and Wave 3 plan

Introduce ReadModeOverlay with device width and font theme persistence, sidebar and volume menu entry, plus E2E-READ-01 through 03. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-07-08 16:38:54 +08:00
parent fe6e411d2c
commit c10be87d18
13 changed files with 653 additions and 2 deletions
@@ -0,0 +1,85 @@
+import { mkdtempSync, rmSync, existsSync } from 'fs'
+import { join } from 'path'
+import { tmpdir } from 'os'
+import { test, expect } from '@playwright/test'
+import {
+  launchApp,
+  skipOnboarding,
+  createBookAndOpenEditor,
+  ensureChapterEditor,
+  dismissCockpitIfOpen
+} from './helpers'
+
+test.describe('Read mode', () => {
+  let userDataDir: string
+
+  test.beforeEach(() => {
+    userDataDir = mkdtempSync(join(tmpdir(), 'bilin-e2e-read-'))
+  })
+
+  test.afterEach(() => {
+    if (userDataDir && existsSync(userDataDir)) {
+      try {
+        rmSync(userDataDir, { recursive: true, force: true, maxRetries: 3, retryDelay: 200 })
+      } catch {
+        /* ignore */
+      }
+    }
+  })
+
+  test('E2E-READ-01: open read mode shows merged chapter content', async () => {
+    const app = await launchApp(userDataDir)
+    const page = await app.firstWindow()
+    await skipOnboarding(page)
+    await createBookAndOpenEditor(page, '阅读模式测试')
+    await dismissCockpitIfOpen(page)
+    await ensureChapterEditor(page)
+
+    const editor = page.locator('.ProseMirror')
+    await editor.click()
+    await editor.pressSequentially('这是连续阅读模式测试正文。')
+    await page.keyboard.press('Control+S')
+
+    await page.getByTestId('chapter-read-mode').click()
+    await expect(page.getByTestId('read-mode-overlay')).toBeVisible({ timeout: 10_000 })
+    await expect(page.getByTestId('read-mode-content')).toContainText('连续阅读模式测试正文')
+
+    await app.close()
+  })
+
+  test('E2E-READ-02: switch device width to phone', async () => {
+    const app = await launchApp(userDataDir)
+    const page = await app.firstWindow()
+    await skipOnboarding(page)
+    await createBookAndOpenEditor(page, '阅读宽度测试')
+    await dismissCockpitIfOpen(page)
+    await ensureChapterEditor(page)
+    await page.getByTestId('chapter-read-mode').click()
+    await expect(page.getByTestId('read-mode-overlay')).toBeVisible({ timeout: 10_000 })
+
+    await page.getByTestId('read-device-width').selectOption('phone')
+    await expect(page.getByTestId('read-mode-content')).toHaveCSS('max-width', '360px')
+
+    await app.close()
+  })
+
+  test('E2E-READ-03: font theme persists after exit and re-enter', async () => {
+    const app = await launchApp(userDataDir)
+    const page = await app.firstWindow()
+    await skipOnboarding(page)
+    await createBookAndOpenEditor(page, '阅读主题测试')
+    await dismissCockpitIfOpen(page)
+    await ensureChapterEditor(page)
+    await page.getByTestId('chapter-read-mode').click()
+    await expect(page.getByTestId('read-mode-overlay')).toBeVisible({ timeout: 10_000 })
+    await page.getByTestId('read-font-theme').selectOption('eye-care')
+    await expect(page.locator('.read-mode-font-eye-care')).toBeVisible()
+
+    await page.getByTestId('read-mode-close').click()
+    await expect(page.getByTestId('read-mode-overlay')).toBeHidden()
+    await page.getByTestId('chapter-read-mode').click()
+    await expect(page.locator('.read-mode-font-eye-care')).toBeVisible()
+
+    await app.close()
+  })
+})