@lobehub/lobehub 2.0.0-next.266 → 2.0.0-next.268

package/e2e/src/features/page/README.md

@@ -0,0 +1,118 @@
+# Page 模块 E2E 测试覆盖
+
+本目录包含 Page（文稿）模块的所有 E2E 测试用例。
+
+## 模块概述
+
+Page 模块是 LobeHub 的文档管理功能，允许用户创建、编辑和管理文稿页面。
+
+**路由**: `/page`, `/page/[id]`
+
+## 功能清单与测试覆盖
+
+### 1. 侧边栏 - 文稿列表管理
+
+| 功能点       | 描述                           | 优先级 | 状态 | 测试文件       |
+| ------------ | ------------------------------ | ------ | ---- | -------------- |
+| 创建文稿     | 点击 + 按钮创建新文稿          | P0     | ✅   | `crud.feature` |
+| 重命名文稿   | 右键菜单 / 三点菜单重命名      | P0     | ✅   | `crud.feature` |
+| 复制文稿     | 复制文稿（自动添加 Copy 后缀） | P1     | ✅   | `crud.feature` |
+| 删除文稿     | 删除文稿（带确认弹窗）         | P0     | ✅   | `crud.feature` |
+| 复制全文     | 复制文稿内容到剪贴板           | P2     | ⏳   |                |
+| 列表分页设置 | 设置显示数量（20/40/60/100）   | P2     | ⏳   |                |
+| 全部文稿抽屉 | 打开完整列表 + 搜索            | P2     | ⏳   |                |
+| 搜索文稿     | 按标题 / 内容搜索过滤          | P1     | ⏳   |                |
+
+### 2. 编辑器 - 文稿头部
+
+| 功能点        | 描述                       | 优先级 | 状态 | 测试文件              |
+| ------------- | -------------------------- | ------ | ---- | --------------------- |
+| 返回按钮      | 返回上一页                 | P2     | ⏳   |                       |
+| 标题编辑      | 大标题输入框，自动保存     | P0     | ✅   | `editor-meta.feature` |
+| Emoji 选择    | 点击选择 / 更换 / 删除图标 | P1     | ✅   | `editor-meta.feature` |
+| 自动保存提示  | 显示保存状态               | P2     | ⏳   |                       |
+| 全宽模式切换  | 大屏幕下切换全宽 / 定宽    | P2     | ⏳   |                       |
+| 复制链接      | 复制文稿 URL               | P2     | ⏳   |                       |
+| 导出 Markdown | 导出为 .md 文件            | P2     | ⏳   |                       |
+| 页面信息      | 显示最后编辑时间           | P2     | ⏳   |                       |
+
+### 3. 编辑器 - 富文本编辑
+
+| 功能点        | 描述                     | 优先级 | 状态 | 测试文件                 |
+| ------------- | ------------------------ | ------ | ---- | ------------------------ |
+| 基础文本输入  | 输入和编辑文本           | P0     | ✅   | `editor-content.feature` |
+| 斜杠命令 (/)  | 打开命令菜单             | P1     | ✅   | `editor-content.feature` |
+| 标题 H1/H2/H3 | 插入标题                 | P1     | ✅   | `editor-content.feature` |
+| 任务列表      | 插入待办事项             | P2     | ✅   | `editor-content.feature` |
+| 无序列表      | 插入项目符号列表         | P2     | ✅   | `editor-content.feature` |
+| 有序列表      | 插入编号列表             | P2     | ⏳   |                          |
+| 图片上传      | 插入图片                 | P2     | ⏳   |                          |
+| 分隔线        | 插入水平分隔线           | P2     | ⏳   |                          |
+| 表格          | 插入表格                 | P2     | ⏳   |                          |
+| 代码块        | 插入代码块（带语法高亮） | P2     | 🚧   | `editor-content.feature` |
+| LaTeX 公式    | 插入数学公式             | P2     | ⏳   |                          |
+| 文本加粗      | 使用快捷键加粗           | P1     | ✅   | `editor-content.feature` |
+| 文本斜体      | 使用快捷键斜体           | P2     | ✅   | `editor-content.feature` |
+
+### 4. Copilot 侧边栏
+
+| 功能点          | 描述                | 优先级 | 状态 | 测试文件          |
+| --------------- | ------------------- | ------ | ---- | ----------------- |
+| 打开 / 关闭面板 | 展开 / 收起 Copilot | P1     | ⏳   | `copilot.feature` |
+| Ask Copilot     | 选中文本后询问      | P0     | ⏳   | `copilot.feature` |
+| Agent 切换      | 选择不同的 Agent    | P2     | ⏳   |                   |
+| 新建话题        | 创建新的对话话题    | P2     | ⏳   |                   |
+| 话题历史        | 查看和切换历史话题  | P2     | ⏳   |                   |
+| 对话交互        | 发送消息、接收回复  | P0     | ⏳   | `copilot.feature` |
+| 模型选择        | 切换使用的模型      | P2     | ⏳   |                   |
+| 文件上传        | 拖放上传文件        | P2     | ⏳   |                   |
+
+## 测试文件结构
+
+```
+e2e/src/features/page/
+├── README.md              # 本文档
+├── crud.feature           # 侧边栏 CRUD 操作 (5 scenarios)
+├── editor-meta.feature    # 编辑器元数据（标题、Emoji）(6 scenarios)
+└── editor-content.feature # 富文本编辑功能 (8 scenarios)
+```
+
+## 测试统计
+
+- **总场景数**: 19 (通过) + 1 (跳过)
+- **总步骤数**: 109+
+- **执行时间**: \~3 分钟
+
+## 测试执行
+
+```bash
+# 运行 Page 模块所有测试
+cd e2e
+BASE_URL=http://localhost:3006 \
+  DATABASE_URL=postgresql://postgres:postgres@localhost:5433/postgres \
+  pnpm exec cucumber-js --config cucumber.config.js --tags "@page and not @skip"
+
+# 运行特定测试
+pnpm exec cucumber-js --config cucumber.config.js --tags "@PAGE-CREATE-001"
+
+# 调试模式（显示浏览器）
+HEADLESS=false pnpm exec cucumber-js --config cucumber.config.js --tags "@PAGE-TITLE-001"
+```
+
+## 状态说明
+
+- ✅ 已完成 - 测试用例已实现并通过
+- ⏳ 待实现 - 功能已识别，测试待编写
+- 🚧 进行中 - 测试用例正在开发中或需要修复
+
+## 已知问题
+
+1. **代码块测试 (@PAGE-SLASH-005)**: 斜杠命令 `/codeblock` 触发不稳定，已标记 @skip
+
+## 更新记录
+
+| 日期       | 更新内容                                  |
+| ---------- | ----------------------------------------- |
+| 2025-01-12 | 初始化功能清单，完成侧边栏 CRUD           |
+| 2025-01-12 | 完成编辑器标题 / Emoji 测试 (6 scenarios) |
+| 2025-01-12 | 完成富文本编辑测试 (8 scenarios，1 跳过)  |

package/e2e/src/features/page/crud.feature

@@ -0,0 +1,62 @@
+@journey @P0 @page
+Feature: Page 文稿 CRUD 操作
+
+  作为用户，我希望能够创建、编辑和管理文稿页面，
+  以便记录和组织我的笔记和文档
+
+  Background:
+    Given 用户已登录系统
+
+  # ============================================
+  # 创建
+  # ============================================
+
+  @PAGE-CREATE-001
+  Scenario: 创建新文稿
+    Given 用户在 Page 页面
+    When 用户点击新建文稿按钮
+    Then 应该创建一个新的文稿
+    And 文稿列表中应该显示新文稿
+
+  # ============================================
+  # 重命名
+  # ============================================
+
+  @PAGE-RENAME-001
+  Scenario: 通过右键菜单重命名文稿
+    Given 用户在 Page 页面有一个文稿
+    When 用户右键点击该文稿
+    And 用户在菜单中选择重命名
+    And 用户输入新的文稿名称 "My Renamed Page"
+    Then 该文稿名称应该更新为 "My Renamed Page"
+
+  @PAGE-RENAME-002 @P1
+  Scenario: 重命名文稿后按 Enter 确认
+    Given 用户在 Page 页面有一个文稿
+    When 用户右键点击该文稿
+    And 用户在菜单中选择重命名
+    And 用户输入新的文稿名称 "Enter Confirmed Page" 并按 Enter
+    Then 该文稿名称应该更新为 "Enter Confirmed Page"
+
+  # ============================================
+  # 复制
+  # ============================================
+
+  @PAGE-DUPLICATE-001 @P1
+  Scenario: 复制文稿
+    Given 用户在 Page 页面有一个文稿 "Original Page"
+    When 用户右键点击该文稿
+    And 用户在菜单中选择复制
+    Then 文稿列表中应该出现 "Original Page (Copy)"
+
+  # ============================================
+  # 删除
+  # ============================================
+
+  @PAGE-DELETE-001
+  Scenario: 删除文稿
+    Given 用户在 Page 页面有一个文稿
+    When 用户右键点击该文稿
+    And 用户在菜单中选择删除
+    And 用户在弹窗中确认删除
+    Then 该文稿应该从列表中移除

package/e2e/src/features/page/editor-content.feature

@@ -0,0 +1,93 @@
+@journey @P0 @page
+Feature: Page 编辑器富文本编辑
+
+  作为用户，我希望能够使用富文本编辑器编写内容，
+  以便创建格式丰富的文档
+
+  Background:
+    Given 用户已登录系统
+
+  # ============================================
+  # 基础文本编辑
+  # ============================================
+
+  @PAGE-CONTENT-001
+  Scenario: 输入基础文本内容
+    Given 用户打开一个文稿编辑器
+    When 用户点击编辑器内容区域
+    And 用户输入文本 "这是一段测试内容"
+    Then 编辑器应该显示输入的文本
+
+  @PAGE-CONTENT-002 @P1
+  Scenario: 编辑已有内容
+    Given 用户打开一个文稿编辑器
+    When 用户在编辑器中输入内容 "原始内容"
+    And 用户选中所有内容
+    And 用户输入文本 "修改后的内容"
+    Then 编辑器应该显示 "修改后的内容"
+
+  # ============================================
+  # 斜杠命令
+  # ============================================
+
+  @PAGE-SLASH-001 @P1
+  Scenario: 使用斜杠命令打开菜单
+    Given 用户打开一个文稿编辑器
+    When 用户点击编辑器内容区域
+    And 用户输入斜杠 "/"
+    Then 应该显示斜杠命令菜单
+
+  @PAGE-SLASH-002 @P1
+  Scenario: 通过斜杠命令插入一级标题
+    Given 用户打开一个文稿编辑器
+    When 用户点击编辑器内容区域
+    And 用户输入斜杠命令 "/h1"
+    And 用户按下 Enter 键
+    And 用户输入文本 "一级标题内容"
+    Then 编辑器应该包含一级标题
+
+  @PAGE-SLASH-003 @P1
+  Scenario: 通过斜杠命令插入无序列表
+    Given 用户打开一个文稿编辑器
+    When 用户点击编辑器内容区域
+    And 用户输入斜杠命令 "/ul"
+    And 用户按下 Enter 键
+    And 用户输入文本 "列表项一"
+    Then 编辑器应该包含无序列表
+
+  @PAGE-SLASH-004 @P2
+  Scenario: 通过斜杠命令插入任务列表
+    Given 用户打开一个文稿编辑器
+    When 用户点击编辑器内容区域
+    And 用户输入斜杠命令 "/tl"
+    And 用户按下 Enter 键
+    And 用户输入文本 "待办事项"
+    Then 编辑器应该包含任务列表
+
+  @PAGE-SLASH-005 @P2 @skip
+  Scenario: 通过斜杠命令插入代码块
+    Given 用户打开一个文稿编辑器
+    When 用户点击编辑器内容区域
+    And 用户输入斜杠命令 "/codeblock"
+    And 用户按下 Enter 键
+    Then 编辑器应该包含代码块
+
+  # ============================================
+  # 文本格式化
+  # ============================================
+
+  @PAGE-FORMAT-001 @P1
+  Scenario: 使用快捷键加粗文本
+    Given 用户打开一个文稿编辑器
+    When 用户在编辑器中输入内容 "加粗文本"
+    And 用户选中所有内容
+    And 用户按下快捷键 "Meta+B"
+    Then 选中的文本应该被加粗
+
+  @PAGE-FORMAT-002 @P2
+  Scenario: 使用快捷键斜体文本
+    Given 用户打开一个文稿编辑器
+    When 用户在编辑器中输入内容 "斜体文本"
+    And 用户选中所有内容
+    And 用户按下快捷键 "Meta+I"
+    Then 选中的文本应该变为斜体

package/e2e/src/features/page/editor-meta.feature

@@ -0,0 +1,60 @@
+@journey @P0 @page
+Feature: Page 编辑器元数据编辑
+
+  作为用户，我希望能够编辑文稿的标题和图标，
+  以便更好地组织和识别我的文档
+
+  Background:
+    Given 用户已登录系统
+
+  # ============================================
+  # 标题编辑
+  # ============================================
+
+  @PAGE-TITLE-001
+  Scenario: 编辑文稿标题
+    Given 用户打开一个文稿编辑器
+    When 用户点击标题输入框
+    And 用户输入标题 "我的测试文稿"
+    And 用户按下 Enter 键
+    Then 文稿标题应该更新为 "我的测试文稿"
+
+  @PAGE-TITLE-002 @P1
+  Scenario: 编辑标题后点击其他区域保存
+    Given 用户打开一个文稿编辑器
+    When 用户点击标题输入框
+    And 用户输入标题 "Click Away Title"
+    And 用户点击编辑器内容区域
+    Then 文稿标题应该更新为 "Click Away Title"
+
+  @PAGE-TITLE-003 @P1
+  Scenario: 清空标题后显示占位符
+    Given 用户打开一个文稿编辑器
+    When 用户点击标题输入框
+    And 用户清空标题内容
+    Then 应该显示标题占位符
+
+  # ============================================
+  # Emoji 图标
+  # ============================================
+
+  @PAGE-EMOJI-001 @P1
+  Scenario: 为文稿添加 Emoji 图标
+    Given 用户打开一个文稿编辑器
+    When 用户点击选择图标按钮
+    And 用户选择一个 Emoji
+    Then 文稿应该显示所选的 Emoji 图标
+
+  @PAGE-EMOJI-002 @P1
+  Scenario: 更换文稿的 Emoji 图标
+    Given 用户打开一个带有 Emoji 的文稿
+    When 用户点击已有的 Emoji 图标
+    And 用户选择另一个 Emoji
+    Then 文稿图标应该更新为新的 Emoji
+
+  @PAGE-EMOJI-003 @P2
+  Scenario: 删除文稿的 Emoji 图标
+    Given 用户打开一个带有 Emoji 的文稿
+    When 用户点击已有的 Emoji 图标
+    And 用户点击删除图标按钮
+    Then 文稿不应该显示 Emoji 图标

package/e2e/src/steps/agent/conversation.steps.ts

@@ -7,7 +7,7 @@ import { Given, Then, When } from '@cucumber/cucumber';
 import { expect } from '@playwright/test';
 
 import { llmMockManager, presetResponses } from '../../mocks/llm';
-import { CustomWorld } from '../../support/world';
+import { CustomWorld, WAIT_TIMEOUT } from '../../support/world';
 
 // ============================================
 // Given Steps
@@ -29,19 +29,19 @@ Given('用户进入 Lobe AI 对话页面', async function (this: CustomWorld) {
   console.log('   📍 Step: 导航到首页...');
   // Navigate to home page first
   await this.page.goto('/');
-  await this.page.waitForLoadState('networkidle', { timeout: 10_000 });
+  await this.page.waitForLoadState('networkidle', { timeout: WAIT_TIMEOUT });
 
   console.log('   📍 Step: 查找 Lobe AI...');
   // Find and click on "Lobe AI" agent in the sidebar/home
   const lobeAIAgent = this.page.locator('text=Lobe AI').first();
-  await expect(lobeAIAgent).toBeVisible({ timeout: 10_000 });
+  await expect(lobeAIAgent).toBeVisible({ timeout: WAIT_TIMEOUT });
 
   console.log('   📍 Step: 点击 Lobe AI...');
   await lobeAIAgent.click();
 
   console.log('   📍 Step: 等待聊天界面加载...');
   // Wait for the chat interface to be ready
-  await this.page.waitForLoadState('networkidle', { timeout: 10_000 });
+  await this.page.waitForLoadState('networkidle', { timeout: WAIT_TIMEOUT });
 
   console.log('   📍 Step: 查找输入框...');
   // The input is a rich text editor with contenteditable