Files
trade-message-center/.trellis/tasks/09-14-centralize-dom-interactions/prd.md
T

3.4 KiB
Raw Blame History

集中非观测 DOM 交互

Goal

把 OneTalk 页面中非观测用途的直接 DOM 访问收敛到明确的 DOM 边界,并使用 @testing-library/dom@testing-library/user-event 对该边界的用户交互进行验证。这样新增页面动作不再复制手写 fixture 事件序列,同时不改变现有发送、身份判断或桥接行为。

Confirmed facts

  • OneTalk 页面脚本在 MAIN world、document_start 注入,并且必须构建为自包含 IIFE。
  • 当前没有 element.click()dispatchEvent()InputEventuser-event;DOM 使用主要是读取页面状态,或注入扩展自有提示和复制控件。
  • 非 observer 的 OneTalk DOM 触点位于:action-status-tooltip.tsconversation-id-copy.tspage-context.tsimage-send.tspage-bridge/main.ts
  • main-page/buyer-fact-observer/main-page/contact-observer/(包括其中的 MutationObserver 和 DOM 读取)不在本任务范围内,保持原路径与行为不变。
  • 扩展尚未引入 Testing Library;运行时只有浏览器原生 DOM,测试使用 Node 内置 test runner 和手写页面 fixture。
  • Popup 是扩展自有页面,不纳入本任务;popup/popup.ts 保持原路径和行为。

Requirements

  • R1:把本任务范围内 OneTalk 页面 DOM 查询、页面自有控件创建/更新,以及未来动作的公共入口整理到一个专属目录;业务编排、协议解码和页面桥不因目录整理而获得新的 DOM 权限。
  • R2:引入 @testing-library/dom@testing-library/user-event 作为 DOM 边界的测试工具,并用真实 DOM fixture 验证受控页面按钮的定位和点击。它们不进入生产 MAIN-world bundle,也不被误当成能生成 trusted event 的运行时自动化方案。
  • R3:保留当前的 OneTalk SDK 发送和媒体上传策略;本任务不把发送流程改成 DOM 点击,也不引入 chrome.debugger、CDP 或任意 selector/任意脚本的远程执行能力。
  • R4:维持 channelAccountId + conversationId 的精确页面身份判断、MAIN/ISOLATED/SW 桥接契约,以及现有页面控件的可见行为。
  • R5:新增依赖作为扩展测试依赖,并提供 Node test runner 可运行的浏览器 DOM 环境;生产 MAIN-world IIFE 不得引入测试运行时、暴露原始 payload、凭据或开放执行面。

Acceptance criteria

  • AC1:所有纳入范围的 OneTalk 页面直接 DOM 访问均由新目录拥有;调用方只通过其语义 API 使用页面 DOM。
  • AC2buyer-fact-observer/contact-observer/ 的生产代码保持未修改。
  • AC3:至少一项受控页面按钮交互通过 @testing-library/dom@testing-library/user-event 在真实 DOM fixture 中验证;生产入口不打包这些测试依赖。
  • AC4:会话 ID 复制控件、动作状态提示、当前会话识别、图片/文件上传器定位、桥接 identity 刷新与重构前行为一致。
  • AC5:相关 focused tests、pnpm --filter @trade-message-center/chrome-extension typecheck 和扩展构建通过;MAIN-world 入口没有产生 code-splitting 或顶层 import 问题。

Out of scope

  • 被动 DOM 观测:main-page/buyer-fact-observer/main-page/contact-observer/ 及其 MutationObserver
  • OneTalk 页面实际用户动作的新增业务功能、发送语义、协议、授权、Bridge 合约和服务端改动。
  • Playwright、chrome.debugger、CDP 或 Native Messaging 自动化。