xiaoshu-app/docs/superpowers/plans/2026-11-14-three-tap-reading.md

Three-tap Reading Implementation Plan

For agentic workers: REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement task-by-task. Steps use checkbox syntax.

Goal: 修正提示、重置、同排同字号和长按左滑，不改变学习次数或环节。 Architecture: 原共用 LearningPageComponent 保留 repetitions/studyStep；模板直接根据点击数显示提示。独立 PressSwipeLeftDirective 识别手势并拦截其合成点击；临时中文使用独立集合。 Tech Stack: Angular 20, TypeScript, SCSS, Jasmine/Karma, Playwright. Spec: docs/superpowers/specs/2026-11-14-three-tap-reading-design.md

Global Constraints

• 三轮、每词每轮三次不变；配对/听音/拼写/分组/保存及跳过行为不变。
• 老师带学、老师生词本、学生自学使用同一显示规则；单词与中文同字号。
• 保留工作区无关文件；按 AGENTS.md 仅提交本次文件并推送当前跟踪分支，不部署。

Review Focus

• 快速点击、音频失败与迟到回调不可改变提示。
• 轮次/手动乱序后不残留手势提示。
• 长按左滑不计次数；短划、右划、竖向滚动、取消、多指不误触。
• 320/375/768px 长词长释义不遮挡、提示在右边、字号一致。
• 第三轮结束后环节及入口身份不变。

Task 1: 点读显示与手势

Files: learning-page.component.ts/html/scss, styles.scss; shared/press-swipe-left.directive.ts; core/home-learning-modules.integration.spec.ts; shared/press-swipe-left.directive.spec.ts. Interfaces: directive selector [appPressSwipeLeft], output pressSwipeLeft; component revealStudyMeaning(word), studyMeaningRevealed set.

• 修改三入口路由回归：第二次立即显示、第三次隐藏、跨三轮重置、三轮后进入配对。
• 新增手势 DOM 测试：450ms 长按 + 左移40px；非目标手势不触发；抑制合成点击但允许随后点击/键盘。
• 运行测试确认旧实现失败，再实现最小修改。
• 运行移动端回归和移动端生产构建。

Task 2: 浏览器验收与交付

Files: scripts/check-three-tap-reading-browser.mjs; docs/qa/three-tap-reading-2026-11-14.md. Interfaces: 使用生产构建与本地隔离 API，三个入口完整三轮、配对/听音/拼写流程。

• 检查三个入口及320/375/768px布局、鼠标和触摸手势，保存本地证据。
• 独立复查差异，完成相应回归，记录明确验证边界。
• 仅提交本次修改并推送当前跟踪分支。

后续用户完成本地验收并授权上线，发布结果见 docs/qa/three-tap-reading-release-2026-11-14.md。