tdf-devtools-protocol
v0.0.41项目介绍
DevTools FrontEnd 到 DevTools BackEnd 的基于 JSON-RPC 通信。 方案设计文档: https://iwiki.woa.com/pages/viewpage.action?pageId=769466771 协议文档: http://tdf-devtools.woa.com/devtools-protocol/tdf/
快速上手
协议修改维护
在需要修改相对应的协议时,修改 json
下的协议及对应的 文档
并提交 MR
至 Master
;OCI 会自动构建新的 TS 声明文件发布 NPM
包以及创建新的 MR
合并至 Master
;
前端项目使用
安装
npm i tdf-devtools-protocol
使用示例:
在引用的该声明的前端项目的 @types 目录下 的 index.d.ts
声明文件中加入以下代码即可全局引用;
/// <reference types="@tencent/tdf-devtools-protocol" />
// 示例
registerModuleCallback(TdfCommand.TDFInspectorDumpDomTree, (error, msg) => {
const { itree } = msg as ProtocolTdf.TDFInspector.DumpDomTreeResponse;
this.handleRecieveDomTree(itree);
});
常见问题
协议支持的格式有哪些? 支持
JSON
,TypeScript
格式;JSON
目录下是协议的具体包含哪些domain
以及每个domain
下有哪些command
,event
; 具体在项目中应该如何进行组包解包? 可以查看 方案设计文档: https://iwiki.woa.com/pages/viewpage.action?pageId=769466771 的介绍; 即: 参照: JSON-RPCCommands Request
{ "id": 11, "method": "Debugger.getScriptSource", "params": { "scriptId": "17" } }
Commands Response
// 成功 { "id": 11, "result": { "scriptId": "17" } } // Error { "id": 11, "error": { "code": -1, "message": "error message" } }
Events(event 事件类似单向的”通知“,没有回包,无需 ID)
{ "method": "Debugger.scriptParsed", "params": { "scriptId": "17", "endColumn": 3, "endLine": 72, "scriptId": "17", "startColumn": 0, "startLine": 0, "url": "bootstrap.js", } }
OCI 的作用是什么? 修改
json
文件下协议后,在成功merge
至master
后会触发OCI
创建一个临时分支生成新的 typescript 文件并进行创建 MR 至 master 并且发布新的NPM
包至腾讯NPM
镜像源: tdf-devtools-protocol本地编译生成
Typescript
的命令? 确保已经安装npm
包后, 项目根目录下运行:npm run build
行为准则
Command / Event 命名规范
- 动作:enable、disable、focus
- 动词+名词:getAttributes、highlightNode、removeNode
Metadata
- Unknown
- Whatever
- Unknown
- released 5/11/2022