Sfoglia il codice sorgente

docs(story-12.7): 添加 Playwright MCP 探索结果到 Dev Notes

补充了人才小程序登录页面的实际测试探索结果,包括:
- 登录页面结构和 URL 路径
- 测试用户账号信息
- 表单验证行为和错误提示
- localStorage token 存储格式
- 退出登录功能和 Bug 修复记录
- Taro 小程序页面导航注意事项

Co-Authored-By: Claude <noreply@anthropic.com>
yourname 4 giorni fa
parent
commit
4380cc5984

+ 129 - 0
_bmad-output/implementation-artifacts/12-7-talent-mini-login.md

@@ -402,6 +402,135 @@ timeout 60 pnpm test:e2e:chromium talent-mini-login
 - 登录测试主要关注认证和访问权限
 - 不需要测试创建、编辑、删除等写操作
 
+### Playwright MCP 探索结果
+
+通过 Playwright MCP 工具探索人才小程序的实际页面结构和行为,获取了以下关键信息:
+
+#### 登录页面结构
+
+**页面 URL:**
+- 登录页: `http://localhost:8080/talent-mini/#/talent-mini/pages/login/index`
+- 登录后主页: `http://localhost:8080/talent-mini/#/talent-mini/pages/index/index`
+
+**页面元素:**
+- 账号输入框(接受手机号/身份证号/残疾证号)
+- 密码输入框
+- 登录按钮
+- 忘记密码链接
+
+#### 测试用户信息
+
+**用于测试的默认用户:**
+```typescript
+const testUser = {
+  account: '13800128219',    // 账号
+  password: 'admin123',      // 密码
+  username: 'talent_test_e2e' // 用户名
+};
+```
+
+> 注意:此用户为 Story 12.3 创建的测试用户,用于 E2E 测试验证
+
+#### 表单验证行为
+
+通过实际测试获取的表单验证反馈:
+
+| 场景 | 错误提示 |
+|------|---------|
+| 空账号提交 | "请输入手机号/身份证号/残疾证号" |
+| 空密码提交 | "请输入密码" |
+| 错误密码登录 | "登录失败" (HTTP 401) |
+
+**验证测试示例:**
+```typescript
+test('应该显示账号必填验证', async ({ talentMiniPage }) => {
+  await talentMiniPage.goto();
+  await talentMiniPage.fillPassword('admin123');
+  await talentMiniPage.clickLoginButton();
+  await talentMiniPage.expectValidationError('请输入手机号/身份证号/残疾证号');
+});
+```
+
+#### localStorage 存储格式
+
+**Token 存储:**
+- Key: `talent_token`
+- 格式: JSON 字符串(需要解析)
+- 内容示例: `"{\"access_token\":\"...\",\"token_type\":\"Bearer\"}"`
+
+**用户信息存储:**
+- Key: `talent_user`
+- 格式: JSON 字符串(需要解析)
+- 内容示例: `"{\"id\":1,\"username\":\"...\",\"nickname\":\"...\"}"`
+
+**Page Object 实现参考:**
+```typescript
+async getToken(): Promise<string | null> {
+  const storage = await this.page.evaluate(() => {
+    return window.localStorage.getItem('talent_token');
+  });
+  if (!storage) return null;
+  const tokenData = JSON.parse(storage);
+  return tokenData.access_token;
+}
+
+async clearAuth(): Promise<void> {
+  await this.page.evaluate(() => {
+    window.localStorage.removeItem('talent_token');
+    window.localStorage.removeItem('talent_user');
+  });
+}
+```
+
+#### 退出登录
+
+**入口位置:**
+- 页面路径:小程序 "更多" 页面
+- 操作:点击 "退出登录" 按钮
+
+**预期行为:**
+- 清除 localStorage 中的 `talent_token` 和 `talent_user`
+- 跳转回登录页面
+
+**Bug 修复记录:**
+
+退出登录功能在开发过程中经历了两次修复:
+
+1. **第一次修复:localStorage key 不一致**
+   - 问题:代码使用 `token` key,但实际存储使用 `talent_token`
+   - 解决:统一使用 `talent_token` 和 `talent_user`
+
+2. **第二次修复:页面跳转问题**
+   - 问题:退出后页面未跳转,仍停留在当前页面
+   - 解决:使用 `Taro.reLaunch` 方法确保页面重定向
+   - 代码变更:移除了不必要的延迟,直接调用重定向方法
+
+**修复验证:**
+```typescript
+test('应该成功退出登录', async ({ talentMiniPage }) => {
+  await talentMiniPage.goto();
+  await talentMiniPage.login('13800128219', 'admin123');
+
+  // 导航到更多页面并退出
+  await talentMiniPage.gotoMorePage();
+  await talentMiniPage.clickLogout();
+
+  // 验证 token 已清除
+  const token = await talentMiniPage.getToken();
+  expect(token).toBeNull();
+
+  // 验证返回登录页
+  await talentMiniPage.expectToBeOnLoginPage();
+});
+```
+
+#### 页面导航注意事项
+
+**Taro 小程序路由特性:**
+- 使用 Hash 路由模式 (`#/talent-mini/pages/...`)
+- 页面跳转使用 Taro API(如 `Taro.navigateTo`, `Taro.reLaunch`)
+- 退出登录应使用 `Taro.reLaunch` 确保完全重置页面栈
+
 ### 参考文档
 
 **架构文档:**